ui/editmode/ConfigOverlay.qml

0001 /*
0002     SPDX-FileCopyrightText: 2016 Smith AR <audoban@openmailbox.org>
0003     SPDX-FileCopyrightText: 2016 Michail Vourlakos <mvourlakos@gmail.com>
0004     SPDX-License-Identifier: GPL-2.0-or-later
0005 */
0006
0007 import QtQuick 2.7
0008 import QtQuick.Layouts 1.0
0009 import QtGraphicalEffects 1.0
0010
0011 import org.kde.plasma.plasmoid 2.0
0012 import org.kde.plasma.core 2.0 as PlasmaCore
0013 import org.kde.plasma.components 2.0 as PlasmaComponents
0014 import org.kde.kquickcontrolsaddons 2.0
0015
0016 import org.kde.latte.core 0.2 as LatteCore
0017
0018 MouseArea {
0019     id: configurationArea
0020     z: 1000
0021
0022     width: plasmoid.formFactor === PlasmaCore.Types.Horizontal ? root.width : thickness
0023     height: plasmoid.formFactor === PlasmaCore.Types.Vertical ? root.height : thickness
0024
0025     visible: root.inConfigureAppletsMode
0026     hoverEnabled: root.inConfigureAppletsMode
0027
0028     focus: true
0029     cursorShape: {
0030         if (currentApplet && tooltip.visible && currentApplet.latteStyleApplet) {
0031             return root.isHorizontal ? Qt.SizeHorCursor : Qt.SizeVerCursor;
0032         }
0033
0034         return Qt.ArrowCursor;
0035     }
0036
0037     property bool isResizingLeft: false
0038     property bool isResizingRight: false
0039     property Item currentApplet
0040     property Item previousCurrentApplet
0041     readonly property alias draggedPlaceHolder: placeHolder
0042
0043     property Item currentHoveredLayout: {
0044         if (placeHolder.parent !== configurationArea) {
0045             return placeHolder.parent;
0046         }
0047
0048         return currentApplet ? currentApplet.parent : null
0049     }
0050
0051     property int lastX
0052     property int lastY
0053     property int appletX
0054     property int appletY
0055
0056     readonly property int thickness: metrics.mask.thickness.maxNormal - metrics.extraThicknessForNormal
0057     readonly property int spacerHandleSize: units.smallSpacing
0058
0059     onHeightChanged: tooltip.visible = false;
0060     onWidthChanged: tooltip.visible = false;
0061
0062
0063     function hoveredItem(x, y) {
0064         //! main layout
0065         var relevantLayout = mapFromItem(layoutsContainer.mainLayout, 0, 0);
0066         var item = layoutsContainer.mainLayout.childAt(x-relevantLayout.x, y-relevantLayout.y);
0067
0068         if (!item) {
0069             // start layout
0070             relevantLayout = mapFromItem(layoutsContainer.startLayout,0,0);
0071             item = layoutsContainer.startLayout.childAt(x-relevantLayout.x, y-relevantLayout.y);
0072         }
0073
0074         if (!item) {
0075             // end layout
0076             relevantLayout = mapFromItem(layoutsContainer.endLayout,0,0);
0077             item = layoutsContainer.endLayout.childAt(x-relevantLayout.x, y-relevantLayout.y);
0078         }
0079
0080         return item;
0081     }
0082
0083     function relevantLayoutForApplet(curapplet) {
0084         var relevantLayout;
0085
0086         if (curapplet.parent === layoutsContainer.mainLayout) {
0087             relevantLayout = mapFromItem(layoutsContainer.mainLayout, 0, 0);
0088         } else if (curapplet.parent === layoutsContainer.startLayout) {
0089             relevantLayout = mapFromItem(layoutsContainer.startLayout, 0, 0);
0090         } else if (curapplet.parent === layoutsContainer.endLayout) {
0091             relevantLayout = mapFromItem(layoutsContainer.endLayout, 0, 0);
0092         }
0093
0094         return relevantLayout;
0095     }
0096
0097
0098     onPositionChanged: {
0099         if (pressed) {
0100             if(currentApplet){
0101                 if (plasmoid.formFactor === PlasmaCore.Types.Vertical) {
0102                     currentApplet.y += (mouse.y - lastY);
0103                 } else {
0104                     currentApplet.x += (mouse.x - lastX);
0105                 }
0106             }
0107
0108             lastX = mouse.x;
0109             lastY = mouse.y;
0110
0111             var mousesink = {x: mouse.x, y: mouse.y};
0112
0113             //! ignore thicknes moving at all cases
0114             if (plasmoid.formFactor === PlasmaCore.Types.Horizontal) {
0115                 mousesink.y = configurationArea.height / 2;
0116             } else {
0117                 mousesink.x = configurationArea.width / 2;
0118             }
0119
0120             var item = hoveredItem(mousesink.x, mousesink.y);
0121
0122             if (item && item !== placeHolder) {
0123                 var posInItem = mapToItem(item, mousesink.x, mousesink.y);
0124
0125                 if ((plasmoid.formFactor === PlasmaCore.Types.Vertical && posInItem.y < item.height/2) ||
0126                         (plasmoid.formFactor !== PlasmaCore.Types.Vertical && posInItem.x < item.width/2)) {
0127                     fastLayoutManager.insertBefore(item, placeHolder);
0128                 } else {
0129                     fastLayoutManager.insertAfter(item, placeHolder);
0130                 }
0131             }
0132
0133         } else {
0134             var item = hoveredItem(mouse.x, mouse.y);
0135
0136             if (root.dragOverlay && item && !item.isParabolicEdgeSpacer) {
0137                 root.dragOverlay.currentApplet = item;
0138             } else {
0139                 currentApplet = null;
0140                 root.dragOverlay.currentApplet = null;
0141             }
0142         }
0143
0144         if (root.dragOverlay.currentApplet) {
0145             hideTimer.stop();
0146
0147             tooltip.visible = true;
0148             tooltip.raise();
0149         }
0150     }
0151
0152     onExited: hideTimer.restart();
0153
0154     onCurrentAppletChanged: {
0155         previousCurrentApplet = currentApplet;
0156
0157         if (!currentApplet || !root.dragOverlay.currentApplet) {
0158             hideTimer.restart();
0159             return;
0160         }
0161
0162         var relevantLayout = relevantLayoutForApplet(currentApplet) ;
0163
0164         if (!relevantLayout) {
0165             return;
0166         }
0167
0168         lockButton.checked = currentApplet.lockZoom;
0169         colorizingButton.checked = !currentApplet.userBlocksColorizing;
0170     }
0171
0172     onPressed: {
0173         if (!root.dragOverlay.currentApplet) {
0174             return;
0175         }
0176
0177         var relevantApplet = mapFromItem(currentApplet, 0, 0);
0178         var rootArea = mapFromItem(root, 0, 0);
0179
0180         appletX = mouse.x - relevantApplet.x + rootArea.x;
0181         appletY = mouse.y - relevantApplet.y + rootArea.y;
0182
0183         lastX = mouse.x;
0184         lastY = mouse.y;
0185         fastLayoutManager.insertBefore(currentApplet, placeHolder);
0186         currentApplet.parent = root;
0187         currentApplet.x = root.isHorizontal ? lastX - currentApplet.width/2 : lastX-appletX;
0188         currentApplet.y = root.isVertical ? lastY - currentApplet.height/2 : lastY-appletY;
0189         currentApplet.z = 900;
0190     }
0191
0192     onReleased: {
0193         if (!handle.visible) {
0194             tooltip.visible = false;
0195         }
0196
0197         if (!root.dragOverlay.currentApplet) {
0198             return;
0199         }
0200
0201         if(currentApplet && currentApplet.applet){
0202             if (plasmoid.formFactor === PlasmaCore.Types.Vertical) {
0203                 currentApplet.applet.configuration.length = handle.height;
0204             } else {
0205                 currentApplet.applet.configuration.length = handle.width;
0206             }
0207         }
0208
0209         configurationArea.isResizingLeft = false;
0210         configurationArea.isResizingRight = false;
0211
0212         fastLayoutManager.insertBefore(placeHolder, currentApplet);
0213         placeHolder.parent = configurationArea;
0214         currentApplet.z = 1;
0215
0216         if (root.myView.alignment === LatteCore.Types.Justify) {
0217             fastLayoutManager.moveAppletsBasedOnJustifyAlignment();
0218         }
0219
0220         fastLayoutManager.save();
0221         layouter.updateSizeForAppletsInFill();
0222     }
0223
0224     onWheel: {
0225         if (!currentApplet || !currentApplet.latteStyleApplet) {
0226             return;
0227         }
0228
0229         var angle = wheel.angleDelta.y / 8;
0230
0231         if (angle > 12)
0232             currentApplet.latteStyleApplet.increaseLength();
0233         else if (angle < 12)
0234             currentApplet.latteStyleApplet.decreaseLength();
0235     }
0236
0237     Connections {
0238         target: currentApplet
0239         onWidthChanged: {
0240             if (configurationArea.pressed && root.isHorizontal) {
0241                 currentApplet.x = configurationArea.lastX - currentApplet.width/2;
0242             }
0243         }
0244
0245         onHeightChanged: {
0246             if (configurationArea.pressed && root.isVertical) {
0247                 currentApplet.y = configurationArea.lastY - currentApplet.height/2;
0248             }
0249         }
0250     }
0251
0252     Item {
0253         id: placeHolder
0254         visible: configurationArea.pressed
0255         width: currentApplet !== null ? (root.isVertical ? currentApplet.width : Math.min(root.maxLength / 2, currentApplet.width)) : 0
0256         height: currentApplet !== null ? (!root.isVertical ? currentApplet.height : Math.min(root.maxLength / 2, currentApplet.height)) : 0
0257
0258         readonly property bool isPlaceHolder: true
0259         readonly property int length: root.isVertical ? height : width
0260     }
0261
0262     Timer {
0263         id: hideTimer
0264         interval: animations.duration.large * 2
0265         onTriggered: {
0266             if (!tooltipMouseArea.containsMouse) {
0267                 tooltip.visible = false;
0268                 currentApplet = null;
0269             }
0270         }
0271     }
0272
0273     Item {
0274         id: handle
0275         parent: currentApplet ? currentApplet : configurationArea
0276         anchors.fill: parent
0277         visible: currentApplet && (configurationArea.containsMouse || tooltipMouseArea.containsMouse)
0278
0279         Loader {
0280             anchors.fill: parent
0281             active: root.debug.graphicsEnabled
0282             sourceComponent: Rectangle {
0283                 color: "transparent"
0284                 border.width:1
0285                 border.color: "yellow"
0286             }
0287         }
0288
0289         //BEGIN functions
0290         //END functions
0291
0292         Item {
0293             id: handleVisualItem
0294             width: root.isHorizontal ? parent.width : thickness
0295             height: root.isHorizontal ? thickness : parent.height
0296
0297             readonly property int thickness: root.isHorizontal ? parent.height - metrics.margin.screenEdge : parent.width - metrics.margin.screenEdge
0298
0299             Rectangle{
0300                 anchors.fill: parent
0301                 color: theme.backgroundColor
0302                 radius: 3
0303                 opacity: 0.35
0304             }
0305
0306             PlasmaCore.IconItem {
0307                 source: "transform-move"
0308                 width: Math.min(144, root.metrics.iconSize)
0309                 height: width
0310                 anchors.centerIn: parent
0311                 opacity: 0.9
0312                 layer.enabled: root.environment.isGraphicsSystemAccelerated
0313                 layer.effect: DropShadow {
0314                     radius: root.myView.itemShadow.size
0315                     fast: true
0316                     samples: 2 * radius
0317                     color: root.myView.itemShadow.shadowColor
0318
0319                     verticalOffset: 2
0320                 }
0321             }
0322
0323
0324             states:[
0325                 State{
0326                     name: "bottom"
0327                     when: plasmoid.location === PlasmaCore.Types.BottomEdge
0328
0329                     AnchorChanges{
0330                         target: handleVisualItem;
0331                         anchors.horizontalCenter: parent.horizontalCenter; anchors.verticalCenter: undefined;
0332                         anchors.right: undefined; anchors.left: undefined; anchors.top: undefined; anchors.bottom: parent.bottom;
0333                     }
0334                     PropertyChanges{
0335                         target: handleVisualItem;
0336                         anchors.leftMargin: 0;    anchors.rightMargin: 0;     anchors.topMargin:0;    anchors.bottomMargin: metrics.margin.screenEdge;
0337                         anchors.horizontalCenterOffset: 0; anchors.verticalCenterOffset: 0;
0338                     }
0339                 },
0340                 State{
0341                     name: "top"
0342                     when: plasmoid.location === PlasmaCore.Types.TopEdge
0343
0344                     AnchorChanges{
0345                         target: handleVisualItem;
0346                         anchors.horizontalCenter: parent.horizontalCenter; anchors.verticalCenter: undefined;
0347                         anchors.right: undefined; anchors.left: undefined; anchors.top: parent.top; anchors.bottom: undefined;
0348                     }
0349                     PropertyChanges{
0350                         target: handleVisualItem;
0351                         anchors.leftMargin: 0;    anchors.rightMargin: 0;     anchors.topMargin: metrics.margin.screenEdge;    anchors.bottomMargin: 0;
0352                         anchors.horizontalCenterOffset: 0; anchors.verticalCenterOffset: 0;
0353                     }
0354                 },
0355                 State{
0356                     name: "left"
0357                     when: plasmoid.location === PlasmaCore.Types.LeftEdge
0358
0359                     AnchorChanges{
0360                         target: handleVisualItem;
0361                         anchors.horizontalCenter: undefined; anchors.verticalCenter: parent.verticalCenter;
0362                         anchors.right: undefined; anchors.left: parent.left; anchors.top: undefined; anchors.bottom: undefined;
0363                     }
0364                     PropertyChanges{
0365                         target: handleVisualItem;
0366                         anchors.leftMargin: metrics.margin.screenEdge;    anchors.rightMargin: 0;     anchors.topMargin:0;    anchors.bottomMargin: 0;
0367                         anchors.horizontalCenterOffset: 0; anchors.verticalCenterOffset: 0;
0368                     }
0369                 },
0370                 State{
0371                     name: "right"
0372                     when: plasmoid.location === PlasmaCore.Types.RightEdge
0373
0374                     AnchorChanges{
0375                         target: handleVisualItem;
0376                         anchors.horizontalCenter: undefined; anchors.verticalCenter: parent.verticalCenter;
0377                         anchors.right: parent.right; anchors.left: undefined; anchors.top: undefined; anchors.bottom: undefined;
0378                     }
0379                     PropertyChanges{
0380                         target: handleVisualItem;
0381                         anchors.leftMargin: 0;    anchors.rightMargin: metrics.margin.screenEdge;     anchors.topMargin:0;    anchors.bottomMargin: 0;
0382                         anchors.horizontalCenterOffset: 0; anchors.verticalCenterOffset: 0;
0383                     }
0384                 }
0385             ]
0386
0387         }
0388
0389         Behavior on opacity {
0390             NumberAnimation {
0391                 duration: animations.duration.large
0392                 easing.type: Easing.InOutQuad
0393             }
0394         }
0395     }
0396     PlasmaCore.Dialog {
0397         id: tooltip
0398         visualParent: currentApplet
0399
0400         type: PlasmaCore.Dialog.Dock
0401         flags: Qt.WindowStaysOnTopHint | Qt.WindowDoesNotAcceptFocus | Qt.BypassWindowManagerHint | Qt.ToolTip
0402         location: plasmoid.location
0403
0404         onVisualParentChanged: {
0405             if (visualParent && currentApplet
0406                     && (currentApplet.applet || currentApplet.isSeparator || currentApplet.isInternalViewSplitter)) {
0407
0408                 configureButton.visible = !currentApplet.isInternalViewSplitter
0409                         && (currentApplet.applet.pluginName !== "org.kde.latte.plasmoid")
0410                         && currentApplet.applet.action("configure")
0411                         && currentApplet.applet.action("configure").enabled;
0412                 closeButton.visible = !currentApplet.isInternalViewSplitter && currentApplet.applet.action("remove") && currentApplet.applet.action("remove").enabled;
0413                 lockButton.visible = !currentApplet.isInternalViewSplitter
0414                         && !currentApplet.communicator.indexerIsSupported
0415                         && !currentApplet.communicator.appletBlocksParabolicEffect
0416                         && !currentApplet.isSeparator;
0417
0418                 colorizingButton.visible = root.colorizerEnabled && !currentApplet.appletBlocksColorizing && !currentApplet.isInternalViewSplitter;
0419
0420                 label.text = currentApplet.isInternalViewSplitter ? i18n("Justify Splitter") : currentApplet.applet.title;
0421             }
0422         }
0423
0424         mainItem: MouseArea {
0425             id: tooltipMouseArea
0426             enabled: currentApplet
0427             width: handleRow.childrenRect.width + (2 * handleRow.spacing)
0428             height: Math.max(configureButton.height, label.contentHeight, closeButton.height)
0429             hoverEnabled: true
0430             LayoutMirroring.enabled: Qt.application.layoutDirection === Qt.RightToLeft
0431             LayoutMirroring.childrenInherit: true
0432
0433             onEntered: hideTimer.stop();
0434             onExited: hideTimer.restart();
0435
0436             Row {
0437                 id: handleRow
0438                 anchors.horizontalCenter: parent.horizontalCenter
0439                 spacing: 2*units.smallSpacing
0440
0441                 Row{
0442                     spacing: units.smallSpacing
0443                     PlasmaComponents.ToolButton {
0444                         id: configureButton
0445                         anchors.verticalCenter: parent.verticalCenter
0446                         iconSource: "configure"
0447                         tooltip: i18n("Configure applet")
0448                         onClicked: {
0449                             tooltip.visible = false;
0450                             currentApplet.applet.action("configure").trigger();
0451                         }
0452                     }
0453
0454                     PlasmaComponents.Label {
0455                         id: label
0456                         anchors.verticalCenter: parent.verticalCenter
0457                         anchors.rightMargin: units.smallSpacing
0458                         textFormat: Text.PlainText
0459                         maximumLineCount: 1
0460                     }
0461
0462                     Row{
0463                         spacing: units.smallSpacing/2
0464
0465                         PlasmaComponents.ToolButton{
0466                             id: colorizingButton
0467                             checkable: true
0468                             iconSource: "color-picker"
0469                             tooltip: i18n("Enable painting  for this applet")
0470
0471                             onClicked: {
0472                                 fastLayoutManager.setOption(currentApplet.applet.id, "userBlocksColorizing", !checked);
0473                             }
0474                         }
0475
0476                         PlasmaComponents.ToolButton{
0477                             id: lockButton
0478                             checkable: true
0479                             iconSource: checked ? "lock" : "unlock"
0480                             tooltip: i18n("Disable parabolic effect for this applet")
0481
0482                             onClicked: {
0483                                 fastLayoutManager.setOption(currentApplet.applet.id, "lockZoom", checked);
0484                             }
0485                         }
0486
0487                         PlasmaComponents.ToolButton {
0488                             id: closeButton
0489                             anchors.verticalCenter: parent.verticalCenter
0490                             iconSource: "delete"
0491                             tooltip: i18n("Remove applet")
0492                             onClicked: {
0493                                 tooltip.visible = false;
0494                                 if(currentApplet && currentApplet.applet)
0495                                     currentApplet.applet.action("remove").trigger();
0496                             }
0497                         }
0498                     }
0499                 }
0500             }
0501         }
0502     }
0503
0504     states: [
0505         State {
0506             name: "bottom"
0507             when: (plasmoid.location === PlasmaCore.Types.BottomEdge)
0508
0509             AnchorChanges {
0510                 target: configurationArea
0511                 anchors{ top:undefined; bottom:parent.bottom; left:undefined; right:undefined;
0512                     horizontalCenter:parent.horizontalCenter; verticalCenter:undefined}
0513             }
0514         },
0515         State {
0516             name: "top"
0517             when: (plasmoid.location === PlasmaCore.Types.TopEdge)
0518
0519             AnchorChanges {
0520                 target: configurationArea
0521                 anchors{ top:parent.top; bottom:undefined; left:undefined; right:undefined;
0522                     horizontalCenter:parent.horizontalCenter; verticalCenter:undefined}
0523             }
0524         },
0525         State {
0526             name: "left"
0527             when: (plasmoid.location === PlasmaCore.Types.LeftEdge)
0528
0529             AnchorChanges {
0530                 target: configurationArea
0531                 anchors{ top:undefined; bottom:undefined; left:parent.left; right:undefined;
0532                     horizontalCenter:undefined; verticalCenter:parent.verticalCenter}
0533             }
0534         },
0535         State {
0536             name: "right"
0537             when: (plasmoid.location === PlasmaCore.Types.RightEdge)
0538
0539             AnchorChanges {
0540                 target: configurationArea
0541                 anchors{ top:undefined; bottom:undefined; left:undefined; right:parent.right;
0542                     horizontalCenter:undefined; verticalCenter:parent.verticalCenter}
0543             }
0544         }
0545     ]
0546 }