QGCPipable.qml 6.02 KB
Newer Older
1 2 3 4 5 6 7 8
/****************************************************************************
 *
 *   (c) 2009-2016 QGROUNDCONTROL PROJECT <http://www.qgroundcontrol.org>
 *
 * QGroundControl is licensed according to the terms in the file
 * COPYING.md in the root of the source code directory.
 *
 ****************************************************************************/
9 10


11 12
import QtQuick                      2.3
import QtQuick.Controls             1.2
13 14 15 16 17 18 19 20 21 22 23 24

import QGroundControl               1.0
import QGroundControl.ScreenTools   1.0
import QGroundControl.Controls      1.0
import QGroundControl.Palette       1.0

Item {
    id: pip

    property bool isHidden:  false
    property bool isDark:    false

25 26 27 28
    // As a percentage of the window width
    property real maxSize: 0.75
    property real minSize: 0.10

Patrick José Pereira's avatar
Patrick José Pereira committed
29
    property bool inPopup: false
30
    property bool enablePopup: true
Patrick José Pereira's avatar
Patrick José Pereira committed
31

32 33
    signal  activated()
    signal  hideIt(bool state)
34
    signal  newWidth(real newWidth)
Patrick José Pereira's avatar
Patrick José Pereira committed
35
    signal  popup()
36 37

    MouseArea {
38
        id: pipMouseArea
39 40
        anchors.fill: parent
        enabled:      !isHidden
41
        hoverEnabled: true
42 43 44 45 46
        onClicked: {
            pip.activated()
        }
    }

47 48 49 50 51 52
    // MouseArea to drag in order to resize the PiP area
    MouseArea {
        id: pipResize
        anchors.top: parent.top
        anchors.right: parent.right
        height: ScreenTools.minTouchPixels
Jacob Walser's avatar
Jacob Walser committed
53
        width: height
54 55 56 57 58 59 60 61 62 63 64 65 66 67 68 69 70 71 72 73 74 75 76 77 78 79 80 81 82 83 84
        property var initialX: 0
        property var initialWidth: 0

        onClicked: {
            // TODO propagate
        }

        // When we push the mouse button down, we un-anchor the mouse area to prevent a resizing loop
        onPressed: {
            pipResize.anchors.top = undefined // Top doesn't seem to 'detach'
            pipResize.anchors.right = undefined // This one works right, which is what we really need
            pipResize.initialX = mouse.x
            pipResize.initialWidth = pip.width
        }

        // When we let go of the mouse button, we re-anchor the mouse area in the correct position
        onReleased: {
            pipResize.anchors.top = pip.top
            pipResize.anchors.right = pip.right
        }

        // Drag
        onPositionChanged: {
            if (pipResize.pressed) {
                var parentW = pip.parent.width // flightView
                var newW = pipResize.initialWidth + mouse.x - pipResize.initialX
                if (newW < parentW * maxSize && newW > parentW * minSize) {
                    newWidth(newW)
                }
            }
        }
Jacob Walser's avatar
Jacob Walser committed
85 86
    }

87 88 89 90 91 92 93
    // Resize icon
    Image {
        source:         "/qmlimages/pipResize.svg"
        fillMode:       Image.PreserveAspectFit
        mipmap: true
        anchors.right:  parent.right
        anchors.top:    parent.top
Patrick José Pereira's avatar
Patrick José Pereira committed
94
        visible:        !isHidden && (ScreenTools.isMobile || pipMouseArea.containsMouse) && !inPopup
95 96 97 98 99 100 101 102 103 104 105 106 107 108 109 110 111 112 113 114 115 116 117 118 119 120
        height:         ScreenTools.defaultFontPixelHeight * 2.5
        width:          ScreenTools.defaultFontPixelHeight * 2.5
        sourceSize.height:  height
    }

    // Resize pip window if necessary when main window is resized
    property var pipLock: 2

    Connections {
        target: pip.parent
        onWidthChanged: {
            // hackity hack...
            // don't fire this while app is loading/initializing (it happens twice)
            if (pipLock) {
                pipLock--
                return
            }

            var parentW = pip.parent.width

            if (pip.width > parentW * maxSize) {
                newWidth(parentW * maxSize)
            } else if (pip.width < parentW * minSize) {
                newWidth(parentW * minSize)
            }
        }
Jacob Walser's avatar
Jacob Walser committed
121 122
    }

Patrick José Pereira's avatar
Patrick José Pereira committed
123 124 125 126 127 128 129 130
     //-- PIP Popup Indicator
    Image {
        id:             popupPIP
        source:         "/qmlimages/PiP.svg"
        mipmap:         true
        fillMode:       Image.PreserveAspectFit
        anchors.left:   parent.left
        anchors.top:    parent.top
131
        visible:        !isHidden && !inPopup && !ScreenTools.isMobile && enablePopup && pipMouseArea.containsMouse
Patrick José Pereira's avatar
Patrick José Pereira committed
132 133 134 135 136 137 138 139 140 141 142 143
        height:         ScreenTools.defaultFontPixelHeight * 2.5
        width:          ScreenTools.defaultFontPixelHeight * 2.5
        sourceSize.height:  height
        MouseArea {
            anchors.fill: parent
            onClicked: {
                inPopup = true
                pip.popup()
            }
        }
    }

144 145 146
    //-- PIP Corner Indicator
    Image {
        id:             closePIP
Patrick José Pereira's avatar
Patrick José Pereira committed
147
        source:         "/qmlimages/pipHide.svg"
148 149 150 151
        mipmap:         true
        fillMode:       Image.PreserveAspectFit
        anchors.left:   parent.left
        anchors.bottom: parent.bottom
Jacob Walser's avatar
Jacob Walser committed
152
        visible:        !isHidden && (ScreenTools.isMobile || pipMouseArea.containsMouse)
153 154
        height:         ScreenTools.defaultFontPixelHeight * 2.5
        width:          ScreenTools.defaultFontPixelHeight * 2.5
dogmaphobic's avatar
dogmaphobic committed
155
        sourceSize.height:  height
156 157 158 159 160 161 162 163 164 165 166 167 168
        MouseArea {
            anchors.fill: parent
            onClicked: {
                pip.hideIt(true)
            }
        }
    }

    //-- Show PIP
    Rectangle {
        id:                     openPIP
        anchors.left :          parent.left
        anchors.bottom:         parent.bottom
169 170 171
        height:                 ScreenTools.defaultFontPixelHeight * 2
        width:                  ScreenTools.defaultFontPixelHeight * 2
        radius:                 ScreenTools.defaultFontPixelHeight / 3
172 173 174 175 176
        visible:                isHidden
        color:                  isDark ? Qt.rgba(0,0,0,0.75) : Qt.rgba(0,0,0,0.5)
        Image {
            width:              parent.width  * 0.75
            height:             parent.height * 0.75
dogmaphobic's avatar
dogmaphobic committed
177
            sourceSize.height:  height
178 179 180 181 182 183 184 185 186 187 188 189 190 191
            source:             "/res/buttonRight.svg"
            mipmap:             true
            fillMode:           Image.PreserveAspectFit
            anchors.verticalCenter:     parent.verticalCenter
            anchors.horizontalCenter:   parent.horizontalCenter
        }
        MouseArea {
            anchors.fill: parent
            onClicked: {
                pip.hideIt(false)
            }
        }
    }
}