/****************************************************************************
**
** Copyright (C) 2011 Nokia Institute of Technology.
** All rights reserved.
** Contact: Manager (renato.chencarek@openbossa.org)
**
** This file is part of the Incredible Circus project.
**
** GNU Lesser General Public License Usage
**
** This file may be used under the terms of the GNU Lesser General Public
** License version 2.1 as published by the Free Software Foundation and
** appearing in the file LICENSE.LGPL included in the packaging of this
** file. Please review the following information to ensure the GNU Lesser
** General Public License version 2.1 requirements will be met:
** http://www.gnu.org/licenses/old-licenses/lgpl-2.1.html.
**
****************************************************************************/

import QtQuick 1.1

Item {
    id: layer

    signal okClicked()
    property string card: "barrel"

    function getText(card) {
        if (card == "elastic")
            return qsTr("Stretch, aim and release");
        else if (card == "barrel")
            return qsTr("Rotate and wait");
        else if (card == "gearbarrel")
            return qsTr("Tap it and blast it")

        return "";
    }

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

        MouseArea {
            anchors.fill: parent
        }

        Rectangle {
            opacity: 0.6
            color: "black"
            anchors.fill: parent
        }

        HelpCard {
            id: helpCard

            anchors.verticalCenter: parent.verticalCenter
            anchors.horizontalCenter: parent.horizontalCenter

            text: getText(card)
            image: card
        }

        ImageButton {
            anchors.top: helpCard.bottom
            anchors.horizontalCenter: helpCard.horizontalCenter
            anchors.topMargin: 16
            onClicked: layer.okClicked();
            source: "image://cache/widgets/helpcard/ok.png"
        }
    }

    states: State {
        name: "opened"
        PropertyChanges { target: frame; visible: true; opacity: 1.0; }
    }

    transitions: Transition {
        to: "opened"
        reversible: true
        SequentialAnimation {
            PropertyAction { target: frame; properties: "visible"; }
            NumberAnimation { target: frame; properties: "opacity"; duration: 200; }
        }
    }
}