GfA-Browser/Menu/MenuHeader.qml

import QtQuick 2.5
import QtQuick.Controls 1.4
//import Qt.labs.controls 1.0
import QtQuick.Controls 2.0
import QtQuick.Controls.Styles 1.3
import QtGraphicalEffects 1.0
import ApplicationLauncher 1.0

import "qrc:/Globals"

Item {
    property int buttImgBorder: 20 // in percent of parent.height defaults to 20%

    property string headerText: ""
    property string headerLogoImage: Globals.logoMenu
    property string buttUndoImage: "/images/UndoButton.svg"
    property string buttHomeImage: "/images/HomeButton.svg"
    property string buttLockImage: "/images/LockButton.svg"
    property string buttCamImage: "/images/LiveMode_Button.svg"
    property bool buttCam1Visible: false
    property bool buttCam2Visible: false
    property int camSelected: -1
    property int buttRadius: 0
    property color buttGradientStart: "darkgray"
    property color buttGradientStop: "black"
    property color buttGradientSelectedStart: Globals.customer_color_base
    property color buttGradientSelectedStop: Globals.customer_color_base
    property double itemMargin: height * (buttImgBorder / 200.0)
    property int buttClicked: 0;

    width: parent.width
    height: parent.height / 10.0

    function whichCamSet() {
        var _camSelected = settings.value("COMMON/CamSelected","-");
        var ret;

        if (_camSelected.toString() === "1") {
            camSelected = 1;
            ret = settings.value("CAM1SETTINGS/IpAddress","0.0.0.0");
        } else if (_camSelected.toString() === "2") {
            camSelected = 2;
            ret = settings.value("CAM2SETTINGS/IpAddress","0.0.0.0");
        }

        if ((_camSelected === "-" ) || (ret === "0.0.0.0")) {
            if (settings.value("CAM1SETTINGS/IpAddress","0.0.0.0") !== "0.0.0.0") {
                settings.setValue("COMMON/CamSelected", "1");
                camSelected = 1;
                ret = settings.value("CAM1SETTINGS/IpAddress","0.0.0.0");
            } else if (settings.value("CAM2SETTINGS/IpAddress","0.0.0.0") !== "0.0.0.0") {
                settings.setValue("COMMON/CamSelected", "2");
                camSelected = 2;
                ret = settings.value("CAM2SETTINGS/IpAddress","0.0.0.0");
            }
        }

        buttCam1Visible =  (settings.value("CAM1SETTINGS/IpAddress","0.0.0.0") !== "0.0.0.0")?true:false;
        buttCam2Visible =  (settings.value("CAM2SETTINGS/IpAddress","0.0.0.0") !== "0.0.0.0")?true:false;

        return ret;
    }

    Rectangle {
        anchors.fill: parent
        gradient: Gradient {
//            GradientStop { position: 0.0; color: "black" }
//            GradientStop { position: 1.0; color: "lightgray" }
            GradientStop { position: 0.0; color: "white" }
            GradientStop { position: 1.0; color: "darkgray" }
        }
    }

    Button {
        id: buttonUndo

        anchors.right: parent.right
        anchors.rightMargin: itemMargin
        anchors.top: parent.top
        anchors.topMargin: itemMargin

        height: parent.height - parent.height * (buttImgBorder / 100.0)
        width: height
        Image {
            anchors.centerIn: parent
            fillMode: Image.PreserveAspectFit
            source: buttUndoImage
            sourceSize.height: parent.height - parent.height * (buttImgBorder / 100.0)
            sourceSize.width: parent.width - parent.width * (buttImgBorder / 100.0)
            height: sourceSize.height
            width:sourceSize.width
        }
        background: Rectangle {
            radius: buttRadius
            gradient: Gradient {
                GradientStop { position:0 ; color: buttGradientStart }
                GradientStop { position:1 ; color: buttGradientStop }
            }
        }
        onClicked: {
            buttClicked += 1;
            sysinfo.beep();
            stackView.pop(StackView.Transition); }
    }

    Button {
        id: buttonHome
        anchors.right: buttonUndo.left
        anchors.rightMargin: itemMargin
        anchors.top: parent.top
        anchors.topMargin: itemMargin
        height: parent.height - parent.height * (buttImgBorder / 100.0)
        width: height
        Image {
            anchors.centerIn: parent
            fillMode: Image.PreserveAspectFit
            source: buttHomeImage
            sourceSize.height: parent.height - parent.height * (buttImgBorder / 100.0)
            sourceSize.width: parent.width - parent.width * (buttImgBorder / 100.0)
            height: sourceSize.height
            width:sourceSize.width
        }
        background: Rectangle {
            radius: buttRadius
            gradient: Gradient {
                GradientStop { position:0 ; color: buttGradientStart }
                GradientStop { position:1 ; color: buttGradientStop }
            }
        }
        onClicked: {
            buttClicked += 1;
            sysinfo.beep();
            stackView.pop(null, StackView.Transition); }
    }

    Button {
        id: buttonLoc
        anchors.right: buttonHome.left
        anchors.rightMargin: itemMargin
        anchors.top: parent.top
        anchors.topMargin: itemMargin
        height: parent.height - parent.height * (buttImgBorder / 100.0)
        width: height

        Image {
            anchors.centerIn: parent
            fillMode: Image.PreserveAspectFit
            source: buttLockImage
            sourceSize.height: parent.height - parent.height * (buttImgBorder / 100.0)
            sourceSize.width: parent.width - parent.width * (buttImgBorder / 100.0)
            height: sourceSize.height
            width:sourceSize.width
        }
        background: Rectangle {
            radius: buttRadius
            gradient: Gradient {
                GradientStop { position:0 ; color: buttGradientStart }
                GradientStop { position:1 ; color: buttGradientStop }
            }
        }
        onClicked: {
            buttClicked += 1;
            sysinfo.beep();
            while (stackView.depth > 2) {
                stackView.pop(StackView.Transition);
            }
        }
    }

    Button {
        property string in2: Globals.in2Status

        id: buttonCam2
        anchors.right: buttonLoc.left
        anchors.rightMargin: itemMargin * 3
        anchors.top: parent.top
        anchors.topMargin: itemMargin
        height: parent.height - parent.height * (buttImgBorder / 100.0)
        width: height
        visible: buttCam2Visible

        Image {
            anchors.centerIn: parent
            fillMode: Image.PreserveAspectFit
            source: buttCamImage
            sourceSize.height: parent.height - parent.height * (buttImgBorder / 100.0)
            sourceSize.width: parent.width - parent.width * (buttImgBorder / 100.0)
            height: sourceSize.height
            width:sourceSize.width
            visible: parent.visible
        }
        background: Rectangle {
            radius: buttRadius
            visible: parent.visible
            gradient: Gradient {
                GradientStop { position:0 ; color: camSelected === 2?buttGradientSelectedStart:buttGradientStart }
                GradientStop { position:1 ; color: camSelected === 2?buttGradientSelectedStop:buttGradientStop }
            }
        }
        onClicked: {
            sysinfo.beep();
            if(settings.value("CAM2SETTINGS/IpAddress","0.0.0.0") !== "0.0.0.0" ) {
                settings.setValue("COMMON/CamSelected", "2");
                camSelected = 2;
            }
        }
        onIn2Changed: {
            if((settings.value("CAM2SETTINGS/IpAddress","0.0.0.0") !== "0.0.0.0" ) &&
                    (Globals.in2Status == "2")){
                settings.setValue("COMMON/CamSelected", "2");
                camSelected = 2;
            }
        }

    }

    Button {
        property string in1: Globals.in1Status
        id: buttonCam1
        anchors.right: buttonCam2.left
        anchors.rightMargin: itemMargin
        anchors.top: parent.top
        anchors.topMargin: itemMargin
        height: parent.height - parent.height * (buttImgBorder / 100.0)
        width: height
        visible: buttCam1Visible

        Image {
            anchors.centerIn: parent
            fillMode: Image.PreserveAspectFit
            source: buttCamImage
            sourceSize.height: parent.height - parent.height * (buttImgBorder / 100.0)
            sourceSize.width: parent.width - parent.width * (buttImgBorder / 100.0)
            height: sourceSize.height
            width:sourceSize.width
            visible: parent.visible
        }
        background: Rectangle {
            radius: buttRadius
            visible: parent.visible
            gradient: Gradient {
                GradientStop { position:0 ; color: camSelected === 1?buttGradientSelectedStart:buttGradientStart }
                GradientStop { position:1 ; color: camSelected === 1?buttGradientSelectedStop:buttGradientStop }
            }
        }
        onClicked: {
            sysinfo.beep();
            if(settings.value("CAM1SETTINGS/IpAddress","0.0.0.0") !== "0.0.0.0" ) {
                settings.setValue("COMMON/CamSelected", "1");
                camSelected = 1;
            }
        }
        onIn1Changed: {
            if((settings.value("CAM1SETTINGS/IpAddress","0.0.0.0") !== "0.0.0.0" ) &&
                    (Globals.in1Status == "1")){
                settings.setValue("COMMON/CamSelected", "1");
                camSelected = 1;
            }
        }
    }

    Image {
        anchors.left: parent.left
        anchors.leftMargin: itemMargin

        anchors.top: parent.top
        anchors.topMargin: itemMargin
        source: headerLogoImage
        fillMode: Image.PreserveAspectFit
        sourceSize.height: parent.height - parent.height * (buttImgBorder / 100.0)
        sourceSize.width: parent.width/3.0 - parent.width/3.0 * (buttImgBorder / 100.0)
        height: sourceSize.height
        width:sourceSize.width
    }

    Text {
        anchors.centerIn: parent
        anchors.top: parent.top
        anchors.topMargin: itemMargin
        color: "white"
        font.pixelSize: (parent.height * 0.5)
        text : headerText
    }
}