futuqtquickhackathon/FutuHeia/qml/FutuHeia-hackathon/maemo5/SportSelector.qml

import Qt 4.7
import "../js/FutuHeia.js" as FutuHeia

Item {
    id: sportSelector
    width: screenWidth

    property string selectedName
    property int selectedId

    function setApiVariables(sportModelIndex) {
        selectedName = sportsModel.get(sportModelIndex).name;
        selectedId = sportsModel.get(sportModelIndex).sportId;
        FutuHeia.log("selectedName = " + selectedName);
        FutuHeia.log("selectedId = " + selectedId);
    }

    Component {
        id: sportSelectorItem

        Item {
            id: rect
            height: sportSelector.height
            width: 200
            visible: PathView.onPath
            opacity: PathView.transparency
            scale: PathView.scaling
            MouseArea {
                anchors.fill: parent
                onClicked: sportsView.currentIndex = index
            }

            Text {
                id: textItem
                anchors.fill: parent
                text: name
                color: PathView.isCurrentItem ? heiaYellow : heiaLightGrey
                anchors.horizontalCenter: parent.horizontalCenter
                font.family: appItem.applicationFont
                font.pixelSize: appItem.applicationFontSize + 10
                smooth: true
                wrapMode: Text.WordWrap
                horizontalAlignment: "AlignHCenter"
                verticalAlignment: "AlignVCenter"
            }

            transform: [
                Rotation {
                    angle: PathView.angle
                    origin.x: rect.width/2
                    axis.x: 0; axis.y: 1; axis.z: 0
                }
            ]
        }
    }

    AnimatedImage {
        visible: appItem.loadingSports
        anchors.centerIn: parent;
        source: "loading.gif"
    }

    /*
    Text {
        visible: appItem.loadingSports
        text:  qsTr("Getting sports...");
        font.family: appItem.applicationFont;
        font.pixelSize: appItem.applicationFontSize;
        anchors.centerIn: parent;
        color: appItem.heiaTextColor;
    }
    */

    PathView {
        visible: !appItem.loadingSports
        id: sportsView
        y: -10
        width: sportSelector.width
        height: sportSelector.height
        pathItemCount: 10
        model: sportsModel
        delegate: sportSelectorItem
        preferredHighlightBegin: 0.16
        preferredHighlightEnd: 0.16
        dragMargin: sportSelector.height/2
        currentIndex: 0

        path: Path {
            startX: 0
            startY: sportSelector.height/8
            PathAttribute { name: "angle"; value: -120.0 }
            PathAttribute { name: "scaling"; value: 0.2 }
            PathAttribute { name: "transparency"; value: 0.0 }
            PathPercent { value: 0.0 }

            PathQuad {x: sportSelector.width/5; y: sportSelector.height-30; controlX: 10; controlY:  sportSelector.height-30}
            PathAttribute { name: "angle"; value: 0.0 }
            PathAttribute { name: "scaling"; value: 1.0 }
            PathAttribute { name: "transparency"; value: 1.0 }

            PathQuad {x: sportSelector.width/2; y: sportSelector.height/2; controlX: 2*sportSelector.width/5; controlY:  sportSelector.height-30}
            PathAttribute { name: "angle"; value: 70.0 }
            PathAttribute { name: "scaling"; value: 0.44 }
            PathAttribute { name: "transparency"; value: 0.7 }
            PathPercent { value: 0.3 }

            PathQuad {x: sportSelector.width-sportSelector.width/5; y: sportSelector.height/2; controlX: 3*sportSelector.width/5; controlY:  sportSelector.height/3}
            PathAttribute { name: "angle"; value: 0.0 }
            PathAttribute { name: "scaling"; value: 0.5 }
            PathAttribute { name: "transparency"; value: 0.7 }
            PathPercent { value: 0.65 }

            PathQuad {x: sportSelector.width-10; y: sportSelector.height/8; controlX: sportSelector.width; controlY:  sportSelector.height/2+sportSelector.height/8}
            PathAttribute { name: "angle"; value: 90.0 }
            PathAttribute { name: "scaling"; value: 0.1 }
            PathAttribute { name: "transparency"; value: 0.0 }
            PathPercent { value: 1.0 }
        }
        onCurrentIndexChanged: setApiVariables(currentIndex)

    }
}