contents/ui/main.qml

0001 /*
0002  *  SPDX-FileCopyrightText: 2017 David Faure <faure@kde.org>
0003  *
0004  *  SPDX-License-Identifier: GPL-2.0-or-later
0005  */
0006
0007 import QtQuick 2.15
0008 import QtQuick.Layouts 1.1
0009 import org.kde.plasma.components 3.0 as PlasmaComponents3
0010 import org.kde.kirigami 2.20 as Kirigami
0011 import org.kde.plasma.extras 2.0 as PlasmaExtras
0012 import org.kde.plasma.plasmoid 2.0
0013 import QtWebEngine
0014 import QtQuick.Controls
0015
0016 import org.kde.plasma.private.dict 1.0
0017
0018 PlasmoidItem {
0019     id: root
0020     switchWidth: Kirigami.Units.gridUnit * 10
0021     switchHeight: Kirigami.Units.gridUnit * 10
0022
0023     fullRepresentation: ColumnLayout {
0024         Keys.forwardTo: input
0025
0026         DictObject {
0027             id: dict
0028             selectedDictionary: plasmoid.configuration.dictionary
0029             // Activate the busy indicator, and deactivate it when page is loaded.
0030             onSearchInProgress: placeholder.opacity = 1;
0031             onDefinitionFound: html => {
0032                 web.loadHtml(html);
0033                 placeholder.opacity = 0;
0034             }
0035         }
0036
0037         RowLayout {
0038             focus: true
0039             Layout.alignment: Qt.AlignTop
0040             Layout.fillWidth: true
0041             PlasmaExtras.SearchField {
0042                 id: input
0043                 focus: root.expanded && !Kirigami.InputMethod.willShowOnActive
0044                 placeholderText: i18nc("@info:placeholder", "Enter word to define here…")
0045                 Layout.fillWidth: true
0046                 Layout.minimumWidth: Kirigami.Units.gridUnit * 12
0047                 onAccepted: {
0048                     if (input.text === "") {
0049                         web.visible = false;
0050                         placeholder.opacity = 0;
0051                         web.loadHtml("");
0052                     } else {
0053                         web.visible = Qt.binding(() => !dict.hasError);
0054                         dict.lookup(input.text);
0055                     }
0056                 }
0057             }
0058             PlasmaComponents3.Button {
0059                 id: configureButton
0060
0061                 display: PlasmaComponents3.AbstractButton.IconOnly
0062                 hoverEnabled: true
0063                 icon.name: "configure"
0064                 text: Plasmoid.internalAction("configure").text
0065
0066                 PlasmaComponents3.ToolTip.delay: Kirigami.Units.toolTipDelay
0067                 PlasmaComponents3.ToolTip.text: configureButton.text
0068                 PlasmaComponents3.ToolTip.visible: configureButton.hovered
0069
0070                 onClicked: Plasmoid.internalAction("configure").trigger();
0071             }
0072         }
0073
0074         Item {
0075             Layout.fillWidth: true
0076             Layout.fillHeight: true
0077             Layout.minimumHeight: input.Layout.minimumWidth
0078
0079             WebEngineView {
0080                 id: web
0081                 anchors.fill: parent
0082                 visible: false
0083
0084                 zoomFactor: 1
0085                 profile: dict.webProfile
0086                 property Menu contextMenu: Menu {
0087                     Repeater {
0088                         model: [
0089                             WebEngineView.Back,
0090                             WebEngineView.Forward,
0091                             WebEngineView.Copy,
0092                         ]
0093                         MenuItem {
0094                             text: web.action(modelData).text
0095                             enabled: web.action(modelData).enabled
0096                             onClicked: web.action(modelData).trigger()
0097                             icon.name: web.action(modelData).iconName
0098                             display: MenuItem.TextBesideIcon
0099                         }
0100                     }
0101                 }
0102                 onContextMenuRequested: request => {
0103                     request.accepted = true;
0104                     contextMenu.popup();
0105                 }
0106             }
0107
0108             Item {
0109                 id: placeholder
0110                 anchors.fill: parent
0111                 opacity: 0
0112
0113                 Loader {
0114                     active: placeholder.visible
0115                     anchors.fill: parent
0116                     asynchronous: true
0117
0118                     sourceComponent: dict.hasError ? errorPlaceholder : loadingPlaceholder
0119                 }
0120
0121                 Behavior on opacity {
0122                     NumberAnimation {
0123                         easing.type: Easing.InOutQuad
0124                         duration: Kirigami.Units.veryLongDuration
0125                     }
0126                 }
0127             }
0128
0129             Component {
0130                 id: loadingPlaceholder
0131
0132                 Rectangle {
0133                     anchors.fill: parent
0134                     color: web.backgroundColor
0135
0136                     PlasmaComponents3.BusyIndicator {
0137                         anchors.centerIn: parent
0138                     }
0139                 }
0140             }
0141
0142             Component {
0143                 id: errorPlaceholder
0144
0145                 Item {
0146                     anchors.fill: parent
0147
0148                     PlasmaExtras.PlaceholderMessage {
0149                         width: parent.width - Kirigami.Units.gridUnit * 2 // For text wrap
0150                         anchors.centerIn: parent
0151                         iconName: "network-disconnect"
0152                         text: i18n("Unable to load definition")
0153                         explanation: i18nc("%2 human-readable error string", "Error code: %1 (%2)", dict.errorCode, dict.errorString)
0154                     }
0155                 }
0156             }
0157         }
0158     }
0159 }