diff --git a/mix/qml/CodeEditorView.qml b/mix/qml/CodeEditorView.qml index 4d54994fe..9c0b804d7 100644 --- a/mix/qml/CodeEditorView.qml +++ b/mix/qml/CodeEditorView.qml @@ -19,7 +19,8 @@ Item { function isDocumentOpen(documentId) { for (var i = 0; i < editorListModel.count; i++) - if (editorListModel.get(i).documentId === documentId) + if (editorListModel.get(i).documentId === documentId && + editors.itemAt(i).item) return true; return false; } diff --git a/mix/qml/WebPreview.qml b/mix/qml/WebPreview.qml index 10d0b3c83..88b992b54 100644 --- a/mix/qml/WebPreview.qml +++ b/mix/qml/WebPreview.qml @@ -6,6 +6,7 @@ import QtQuick.Controls.Styles 1.1 import QtWebEngine 1.0 import QtWebEngine.experimental 1.0 import HttpServer 1.0 +import "." Item { id: webPreview @@ -38,7 +39,7 @@ Item { function updateDocument(documentId, action) { for (var i = 0; i < pageListModel.count; i++) - if (pageListModel.get(i).documentId === i) + if (pageListModel.get(i).documentId === documentId) action(i); } @@ -82,10 +83,22 @@ Item { onDocumentRemoved: { updateDocument(documentId, function(i) { pageListModel.remove(i) } ) } + onDocumentUpdated: { updateDocument(documentId, function(i) { pageListModel.set(i, projectModel.getDocument(documentId)) } ) } + onDocumentOpened: { + if (!document.isHtml) + return; + for (var i = 0; i < pageListModel.count; i++) { + var doc = pageListModel.get(i); + if (doc.documentId === document.documentId) { + pageCombo.currentIndex = i; + } + } + } + onProjectLoading: { for (var i = 0; i < target.listModel.count; i++) { var document = target.listModel.get(i); @@ -146,45 +159,86 @@ Item { ColumnLayout { anchors.fill: parent - - RowLayout { - anchors.top: parent.top - Layout.fillWidth: true; - Text { - text: qsTr("Page") - } - ComboBox { - id: pageCombo - model: pageListModel - textRole: "name" - currentIndex: -1 - onCurrentIndexChanged: changePage() - } - Button { - text: qsTr("Reload") - onClicked: reload() + spacing: 0 + Rectangle + { + SourceSansProLight + { + id: regularFont } - CheckBox { - id: autoReloadOnSave - checked: true - text: qsTr("Auto reload on save") + + anchors.leftMargin: 4 + color: WebPreviewStyle.general.headerBackgroundColor + Layout.preferredWidth: parent.width + Layout.preferredHeight: 32 + Row { + anchors.top: parent.top + anchors.fill: parent + anchors.leftMargin: 3 + spacing: 3 + DefaultLabel { + text: qsTr("Preview of") + anchors.verticalCenter: parent.verticalCenter + } + + ComboBox { + id: pageCombo + model: pageListModel + textRole: "name" + currentIndex: -1 + onCurrentIndexChanged: changePage() + anchors.verticalCenter: parent.verticalCenter + style: ComboBoxStyle { + font: regularFont.name + } + } + + Action { + tooltip: qsTr("Reload") + id: buttonReloadAction + onTriggered: { + reload(); + } + } + + Button { + iconSource: "qrc:/qml/img/available_updates.png" + action: buttonReloadAction + anchors.verticalCenter: parent.verticalCenter + width: 26 + height: 26 + } + CheckBox { + id: autoReloadOnSave + checked: true + anchors.verticalCenter: parent.verticalCenter + style: CheckBoxStyle { + label: DefaultLabel { + text: qsTr("Auto reload on save") + } + } + } } } - WebEngineView { - Layout.fillWidth: true + Rectangle + { + Layout.preferredWidth: parent.width Layout.fillHeight: true - id: webView - experimental.settings.localContentCanAccessRemoteUrls: true - onJavaScriptConsoleMessage: { - console.log(sourceID + ":" + lineNumber + ":" + message); - } - onLoadingChanged: { - if (!loading) { - initialized = true; - webView.runJavaScript("init(\"" + httpServer.url + "/rpc/\")"); - if (pendingPageUrl) - setPreviewUrl(pendingPageUrl); + WebEngineView { + anchors.fill: parent + id: webView + experimental.settings.localContentCanAccessRemoteUrls: true + onJavaScriptConsoleMessage: { + console.log(sourceID + ":" + lineNumber + ":" + message); + } + onLoadingChanged: { + if (!loading) { + initialized = true; + webView.runJavaScript("init(\"" + httpServer.url + "/rpc/\")"); + if (pendingPageUrl) + setPreviewUrl(pendingPageUrl); + } } } } diff --git a/mix/qml/WebPreviewStyle.qml b/mix/qml/WebPreviewStyle.qml new file mode 100644 index 000000000..551f5a446 --- /dev/null +++ b/mix/qml/WebPreviewStyle.qml @@ -0,0 +1,14 @@ +pragma Singleton +import QtQuick 2.0 + +QtObject { + + function absoluteSize(rel) + { + return systemPointSize + rel; + } + + property QtObject general: QtObject { + property string headerBackgroundColor: "#f0f0f0" + } +} diff --git a/mix/qml/img/available_updates.png b/mix/qml/img/available_updates.png new file mode 100644 index 000000000..fa08c1d80 Binary files /dev/null and b/mix/qml/img/available_updates.png differ diff --git a/mix/qml/qmldir b/mix/qml/qmldir index ca8e494fe..0f3fcd88c 100644 --- a/mix/qml/qmldir +++ b/mix/qml/qmldir @@ -4,3 +4,4 @@ singleton ProjectFilesStyle 1.0 ProjectFilesStyle.qml singleton DebuggerPaneStyle 1.0 DebuggerPaneStyle.qml singleton StateStyle 1.0 StateStyle.qml singleton StatusPaneStyle 1.0 StatusPaneStyle.qml +singleton WebPreviewStyle 1.0 WebPreviewStyle.qml diff --git a/mix/res.qrc b/mix/res.qrc index 6d9ce3d79..0acf9f39e 100644 --- a/mix/res.qrc +++ b/mix/res.qrc @@ -97,5 +97,7 @@ qml/DefaultTextField.qml qml/CommonSeparator.qml qml/Style.qml + qml/WebPreviewStyle.qml + qml/img/available_updates.png