activities/magic-hat-minus/Hat.qml

0001 /* GCompris - Hat.qml
0002  *
0003  * SPDX-FileCopyrightText: 2014 Thibaut ROMAIN <thibrom@gmail.com>
0004  *
0005  * Authors:
0006  *   Thibaut ROMAIN <thibrom@gmail.com>
0007  *
0008  *   SPDX-License-Identifier: GPL-3.0-or-later
0009  */
0010 import QtQuick 2.12
0011
0012 import "../../core"
0013 import "magic-hat.js" as Activity
0014
0015 Item {
0016     id: hatItem
0017     property alias state: hatImg.state
0018     property alias target: offStar
0019     property int starsSize
0020     property GCSfx audioEffects
0021
0022     function getTarget() {
0023         return offStar
0024     }
0025
0026     Image {
0027         id: hatImg
0028         z: 100
0029         source: Activity.url + "hat.svg"
0030         sourceSize.height: parent.height
0031         fillMode: Image.PreserveAspectFit
0032         anchors.centerIn: parent
0033         state: "NormalPosition"
0034
0035         transform: Rotation {
0036             id: rotate
0037             origin.x: 0
0038             origin.y: hatImg.height
0039             axis.x: 0
0040             axis.y: 0
0041             axis.z: 1
0042             Behavior on angle {
0043                 animation: rotAnim
0044             }
0045         }
0046
0047         states: [
0048             State {
0049                 name: "NormalPosition"
0050                 PropertyChanges {
0051                     target: rotate
0052                     angle: 0
0053                 }
0054                 PropertyChanges {
0055                     target: baseRotAnim
0056                     running: true
0057                 }
0058             },
0059             State {
0060                 name: "Rotated"
0061                 PropertyChanges {
0062                     target: baseRotAnim
0063                     running: false
0064                 }
0065                 PropertyChanges {
0066                     target: rotate
0067                     angle: -45
0068                 }
0069             },
0070             State {
0071                 name: "GuessNumber"
0072                 PropertyChanges {
0073                     target: baseRotAnim
0074                     running: false
0075                 }
0076                 PropertyChanges{
0077                     target: hatImg
0078                     source: Activity.url + "hat-point.svg"
0079                 }
0080                 PropertyChanges {
0081                     target: rotate
0082                     angle: 0
0083                 }
0084             }
0085         ]
0086
0087      }
0088
0089     RotationAnimation {
0090                 id: rotAnim
0091                 direction: hatImg.state == "Rotated" ?
0092                                RotationAnimation.Counterclockwise :
0093                                RotationAnimation.Clockwise
0094                 duration: 500
0095                 onRunningChanged: if(!rotAnim.running && hatImg.state == "Rotated") {
0096                         Activity.moveStarsUnderHat()
0097                     }
0098     }
0099
0100     SequentialAnimation {
0101           id: baseRotAnim
0102           running: true
0103           loops: Animation.Infinite
0104           NumberAnimation {
0105               target: hatImg
0106               property: "rotation"
0107               from: 0; to: 25
0108               duration: 500
0109           }
0110           NumberAnimation {
0111               target: hatImg
0112               property: "rotation"
0113               from: 25; to: 0
0114               duration: 500
0115           }
0116           NumberAnimation {
0117               target: hatImg
0118               property: "rotation"
0119               from: 0; to: 0
0120               duration: 2000
0121           }
0122           NumberAnimation {
0123               target: hatImg
0124               property: "rotation"
0125               from: 0; to: -25
0126               duration: 500
0127           }
0128           NumberAnimation {
0129               target: hatImg
0130               property: "rotation"
0131               from: -25; to: 0
0132               duration: 500
0133           }
0134           NumberAnimation {
0135               target: hatImg
0136               property: "rotation"
0137               from: 0; to: 0
0138               duration: 2000
0139           }
0140     }
0141
0142     MouseArea {
0143         id: hatMouseArea
0144         anchors.fill:hatImg
0145         onClicked: {
0146             if(hatImg.state == "NormalPosition") {
0147                 baseRotAnim.running = false;
0148                 hatImg.rotation = 0;
0149                 hatImg.state = "Rotated";
0150             }
0151         }
0152     }
0153
0154     // The target for the moving stars
0155     Item {
0156         id: offStar
0157         height: hatItem.starsSize
0158         width: hatItem.starsSize
0159         y: hatImg.y + hatImg.paintedHeight - height
0160         anchors {
0161             horizontalCenter: parent.horizontalCenter
0162         }
0163
0164         z: hatImg.z - 1
0165     }
0166 }