meewords/qml/MeeWords/Learning.qml

import QtQuick 1.1
import com.nokia.meego 1.0
import "Logic.js" as Logic

Page {
    id: pageLearning

    onVisibleChanged: {
        if(visible) {
            //console.log("onVisibleChanged")
        }
    }


    tools: ToolBarLayout {
        id: tool_only_back
        opacity: userTheme.opacityToolbar
        ToolIcon {
            id: toolIconBack
            //iconId: "toolbar-back"
            iconSource: "images/toolbar/back.png"
            onClicked: {
                pageStack.pop();
            }
        }
    } //ToolBarLayout

    QNMTitle {
        id: titlePage
        text: qsTr("Learn words")
        image: "images/learn.png"
        busy: false
    }

    BackgroundPage { }

    /****************************************************************/


    function nextWord() {
        var objRes = Logic.getWord( appWindow.bufWords )
        if( objRes !== undefined) {
            appWindow.learnWord = ""
            appWindow.learnTranslation = ""

            appWindow.porgressLearn = appWindow.porgressLearn + 1
            var pg = Qt.resolvedUrl("Learning.qml")
            appWindow.bufWords = objRes.buf
            pageStack.replace( pg )
            timerShowWords.w1 = objRes.obj.word
            timerShowWords.w2 = objRes.obj.translation

            appWindow.curShowTrue = objRes.obj.strue
            appWindow.curShowFalse = objRes.obj.sfalse
            appWindow.curWordId = objRes.obj.id

            timerShowWords.restart()
        } else {
            var pg1 = Qt.resolvedUrl( "LearnStop.qml" )
            pageStack.replace( pg1 )
        }

    }

    /****************************************************************/
    Timer {
        id: timerShowWords

        property string w1: ""
        property string w2: ""

        interval: 500
        running: false
        repeat: false
        onTriggered: {
            appWindow.learnWord = w1
            appWindow.learnTranslation = w2
        }
    }

    /****************************************************************/
    Item {
        id: wrapperWordCard
        anchors.top: titlePage.bottom
        anchors.left: parent.left
        anchors.leftMargin: screen.orientationString == "Landscape" || screen.orientationString == "LandscapeInverted" ? 16 : 0

        width: screen.orientationString == "Landscape" || screen.orientationString == "LandscapeInverted" ? parent.width/2 : parent.width
        height: screen.orientationString == "Landscape" || screen.orientationString == "LandscapeInverted" ? parent.height - titlePage.height : (parent.height - titlePage.height)/2

        Item {
            id: pbLearn
            anchors.top: parent.top
            anchors.topMargin: 20
            anchors.horizontalCenter: parent.horizontalCenter
            width: 0.9*parent.width
            height: 21
            Text {
                id: txtProgress
                anchors.verticalCenter: parent.verticalCenter
                width: 0.2*parent.width
                font.pixelSize: 22
                text: appWindow.porgressLearn + "/" + appWindow.siz_bufWords
            }
            MyProgressBar {
                width: 0.8*parent.width
                anchors.left: txtProgress.right
                anchors.verticalCenter: parent.verticalCenter
                height: parent.height
                color: "#405fff"
                timeAnim: 0
                minValue: 0
                maxValue: appWindow.siz_bufWords
                value: appWindow.porgressLearn
            }
        }

        Flipable {
            id: flipWrapper
            anchors.centerIn: parent

            property bool flipped: false

            front: Image {
                id: cardFace
                anchors.centerIn: parent
                width: screen.orientationString == "Landscape" || screen.orientationString == "LandscapeInverted" ? 420 : 450
                height: screen.orientationString == "Landscape" || screen.orientationString == "LandscapeInverted" ? 180 : 200
                source: "images/wordItem.png"
                smooth: true
                TextEdit {
                    id: wordText
                    anchors.centerIn: parent
                    wrapMode: TextEdit.WrapAtWordBoundaryOrAnywhere
                    text: appWindow.learnWord
                    font.pixelSize: 40
                    font.bold: true
                    clip: true
                    focus: true
                    readOnly: true
                    height: parent.height-16
                    width: parent.width-18
                    horizontalAlignment: TextEdit.AlignHCenter
                    verticalAlignment: TextEdit.AlignVCenter
                    onTextChanged: {
                        Logic.strItem( wordText, 390 )
                    }
                }
            }

            onStateChanged: {
                if(state == "forward")
                    Logic.strItem( wordText, 390 )
                else
                    Logic.strItem( translateText, 390 )
            }

            back: Image {
                id: cardBack
                anchors.centerIn: parent
                width: screen.orientationString == "Landscape" || screen.orientationString == "LandscapeInverted" ? 420 : 450
                height: screen.orientationString == "Landscape" || screen.orientationString == "LandscapeInverted" ? 180 : 200
                source: "images/wordItem.png"
                smooth: true
                TextEdit {
                    id: translateText
                    anchors.centerIn: parent
                    wrapMode: TextEdit.WrapAtWordBoundaryOrAnywhere
                    text: appWindow.learnTranslation
                    font.pixelSize: 40
                    font.bold: true
                    clip: true
                    focus: true
                    readOnly: true
                    height: parent.height-16
                    width: parent.width-18
                    horizontalAlignment: TextEdit.AlignHCenter
                    verticalAlignment: TextEdit.AlignVCenter
                    color: "blue"
                    onTextChanged: {
                        Logic.strItem( translateText, 390 )
                    }
                }
            }

            transform: Rotation {
                id: rotation
                origin.x: flipWrapper.width/2
                origin.y: flipWrapper.height/2
                axis.x: 1; axis.y: 0; axis.z: 0     // set axis.y to 1 to rotate around y-axis
                angle: 0    // the default angle
            }
            state: "forward"

            states: [
                State {
                    name: "back"
                    PropertyChanges { target: rotation; angle: 180 }
                    //PropertyChanges { target: wordText; visible: false }
                    //PropertyChanges { target: translateText; visible: true }
                    when: flipWrapper.flipped
                },
                State {
                    name: "forward"
                    //PropertyChanges { target: wordText; visible: true }
                    //PropertyChanges { target: translateText; visible: false }
                    when: ! flipWrapper.flipped
                }
            ]

            transitions: Transition {
                ParallelAnimation {
                    NumberAnimation { target: rotation; property: "angle"; duration: 400 }
                    /*onCompleted: {
                        console.log("ParallelAnimation::onCompleted")
                    }
                    onStarted: {
                        console.log("ParallelAnimation::onStarted")
                    }*/

                }
            }

        } //Flipable

        MouseArea {
            id: ma
            anchors.fill: parent
            onClicked: {
                flipWrapper.flipped = !flipWrapper.flipped
            }
        }
    }

    /****************************************************************/
    Item {
        id: wrapperButton
        anchors.top: screen.orientationString == "Landscape" || screen.orientationString == "LandscapeInverted" ? titlePage.bottom : wrapperWordCard.bottom
        anchors.left: screen.orientationString == "Landscape" || screen.orientationString == "LandscapeInverted" ? wrapperWordCard.right : parent.left

        width: screen.orientationString == "Landscape" || screen.orientationString == "LandscapeInverted" ? parent.width/2 : parent.width
        height: screen.orientationString == "Landscape" || screen.orientationString == "LandscapeInverted" ? parent.height - titlePage.height : (parent.height - titlePage.height)/2


        MyButton {
            id: buttonTrue
            text: qsTr("I knew")
            height: 120
            width: 360
            anchors.top: wrapperButton.top
            anchors.topMargin: screen.orientationString == "Landscape" || screen.orientationString == "LandscapeInverted" ? 30 : 10
            anchors.horizontalCenter: parent.horizontalCenter
            iconSource: "images/ok.png"
            fontSize: 32
            color: "green"
            isGlow: false
            onClicked: {
                appWindow.curShowTrue += 1
                Logic.wordTrue( appWindow.curWordId, appWindow.curShowTrue )
                pageLearning.nextWord()
                appWindow.answTrue += 1
            }
        }

        MyButton {
            id: buttonFalse
            text: qsTr("I didn't know")
            height: 120
            width: 360
            anchors.top: buttonTrue.bottom
            anchors.topMargin: 50
            anchors.horizontalCenter: parent.horizontalCenter
            iconSource: "images/cancel.png"
            fontSize: 32
            color: "red"
            isGlow: false
            onClicked: {
                appWindow.curShowFalse += 1
                Logic.wordFalse( appWindow.curWordId, appWindow.curShowFalse )
                appWindow.answFalse += 1

                var _show = appWindow.curShowFalse + appWindow.curShowTrue
                var obj_we = new Object()
                obj_we.model_word = appWindow.learnWord
                obj_we.model_translation = appWindow.learnTranslation
                obj_we.word_show = _show
                obj_we.show_error = appWindow.curShowFalse

                var listWE = appWindow.bufWordsErrorTest
                listWE.push( obj_we )
                appWindow.bufWordsErrorTest = listWE

                pageLearning.nextWord()
            }
        }

    }

    /****************************************************************/

}