/*
    This file is part of Gabriel's Qt/QML CardBoard Sample (or short GQQCS)

    GQQCS is free software: you can redistribute it and/or modify
    it under the terms of the GNU General Public License as published by
    the Free Software Foundation, either version 3 of the License, or
    (at your option) any later version.

    GQQCS is distributed in the hope that it will be useful,
    but WITHOUT ANY WARRANTY; without even the implied warranty of
    MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE.  See the
    GNU General Public License for more details.

    You should have received a copy of the GNU General Public License
    along with Foobar.  If not, see <http://www.gnu.org/licenses/>.

    Updated: 07/08/2015 by: Gabriel F.
*/

import QtQuick 2.4

Item {
    id: rootSobre
    anchors.fill: parent
    visible: false
    opacity: 0.0

    NumberAnimation {
        id: fadeIn
        target: rootSobre
        property: "opacity"
        duration: 500
        easing.type: Easing.InOutQuad
        to: 1.0
        onStarted: { menu.yScroll = 1.0; rootSobre.visible = true }
    }

    NumberAnimation {
        id: fadeOut
        target: rootSobre
        property: "opacity"
        duration: 500
        easing.type: Easing.InOutQuad
        to: 0.0
        onStopped: { rootSobre.visible = false }
    }

    function show() { fadeIn.start() }
    function hide() { fadeOut.start() }

    property double minY: -about_box_L.height
    property double yPos: visible ? (1-menu.yScroll)*minY : 0.0
    onYPosChanged: {
        if (menu.yScroll == 0) {
            rootSobre.hide()
        }
    }

    Rectangle {
        anchors.fill: parent
        color: "white"
    }

    Item {
        width: stereo ? parent.width*0.5 : parent.width
        height: parent.height
        anchors.verticalCenter: parent.verticalCenter
        anchors.left: parent.left
        clip: true

        Item {
            id: about_box_L
            width: parent.width
            height: petrec_text.paintedHeight + logo.height + sair_text.paintedHeight + (2*logo.height*0.3)
            y: yPos

            Image {
                id: logo
                width: parent.width
                height: rootSobre.height*0.3
                fillMode: Image.PreserveAspectFit
                source: "qrc:/images/logo.svg"
            }

            Text {
                id: petrec_text
                anchors.top: logo.bottom
                anchors.horizontalCenter: parent.horizontalCenter
                anchors.topMargin: logo.height*0.3
                width: parent.width*0.8
                text: localeHelper.getSymbol("AboutText")
                wrapMode: Text.WordWrap
                font.pixelSize: width*0.04
                color: "black"
            }

            Text {
                id: sair_text
                anchors.top: petrec_text.bottom
                anchors.horizontalCenter: parent.horizontalCenter
                anchors.topMargin: logo.height*0.5
                width: parent.width*0.8
                font.bold: true
                text: localeHelper.getSymbol("BackText")
                horizontalAlignment: Text.AlignHCenter
                wrapMode: Text.WordWrap
                font.pixelSize: width*0.15
                color: "steelblue"
                opacity: 1-menu.yScroll
            }

            Text {
                id: sair_text2
                anchors.top: sair_text.bottom
                anchors.horizontalCenter: parent.horizontalCenter
                anchors.topMargin: logo.height*0.5
                width: parent.width*0.8
                font.bold: true
                text: useGyro ? localeHelper.getSymbol("BackTextDetailsG") : localeHelper.getSymbol("BackTextDetailsT")
                horizontalAlignment: Text.AlignHCenter
                wrapMode: Text.WordWrap
                font.pixelSize: width*0.07
                color: "steelblue"
                opacity: 1-menu.yScroll
            }
        }
    }

    Item {
        width: parent.width*0.5
        height: parent.height
        anchors.verticalCenter: parent.verticalCenter
        anchors.right: parent.right
        clip: true
        visible: stereo

        Item {
            id: about_box_R
            width: parent.width
            height: about_box_L.height
            y: yPos

            Image {
                id: logo_R
                width: parent.width
                height: rootSobre.height*0.3
                fillMode: Image.PreserveAspectFit
                source: logo.source
            }

            Text {
                id: petrec_text_R
                anchors.top: logo_R.bottom
                anchors.horizontalCenter: parent.horizontalCenter
                anchors.topMargin: logo_R.height*0.3
                width: parent.width*0.8
                text: petrec_text.text
                wrapMode: Text.WordWrap
                font.pixelSize: width*0.04
                color: "black"
            }

            Text {
                id: sair_text_R
                anchors.top: petrec_text_R.bottom
                anchors.horizontalCenter: parent.horizontalCenter
                anchors.topMargin: logo_R.height*0.5
                width: parent.width*0.8
                font.bold: true
                text: sair_text.text
                horizontalAlignment: Text.AlignHCenter
                wrapMode: Text.WordWrap
                font.pixelSize: width*0.15
                color: "steelblue"
                opacity: 1-menu.yScroll
            }
            Text {
                id: sair_text_R2
                anchors.top: sair_text_R.bottom
                anchors.horizontalCenter: parent.horizontalCenter
                anchors.topMargin: logo_R.height*0.5
                width: parent.width*0.8
                font.bold: true
                text: sair_text2.text
                horizontalAlignment: Text.AlignHCenter
                wrapMode: Text.WordWrap
                font.pixelSize: width*0.07
                color: "steelblue"
                opacity: 1-menu.yScroll
            }
        }
    }
}