Warning, /education/gcompris/src/activities/magic-hat-minus/MagicHat.qml is written in an unsupported language. File is not indexed.

0001 /* GCompris - MagicHat.qml
0002  *
0003  * SPDX-FileCopyrightText: 2014 Thibaut ROMAIN <thibrom@gmail.com>
0004  *
0005  * Authors:
0006  *   <Bruno Coudoin> (GTK+ version)
0007  *   Thibaut ROMAIN <thibrom@gmail.com> (Qt Quick port)
0008  *
0009  *   SPDX-License-Identifier: GPL-3.0-or-later
0010  */
0011 import QtQuick 2.12
0012 import GCompris 1.0
0013 
0014 import "../../core"
0015 import "magic-hat.js" as Activity
0016 import "."
0017 
0018 ActivityBase {
0019     id: activity
0020 
0021     onStart: focus = true
0022     onStop: {}
0023 
0024     property string mode: "minus"
0025 
0026     pageComponent: Image {
0027         id: background
0028         anchors.fill: parent
0029         source: Activity.url + "background.svg"
0030         sourceSize.width: width
0031         sourceSize.height: height
0032         fillMode: Image.PreserveAspectCrop
0033         property int starSize: Math.min((background.width - 10 * ApplicationInfo.ratio) / 14 ,
0034                                         (operationLayout.height - 10 * ApplicationInfo.ratio) / 12)
0035 
0036         signal start
0037         signal stop
0038 
0039         property var starColors : ["1", "2", "3"]
0040 
0041         Component.onCompleted: {
0042             dialogActivityConfig.initialize()
0043             activity.start.connect(start)
0044             activity.stop.connect(stop)
0045         }
0046 
0047         onStart: Activity.start(items, mode)
0048         onStop: Activity.stop()
0049 
0050         property bool vert: background.width >= (background.height - okButton.height)
0051 
0052         // Add here the QML items you need to access in javascript
0053         QtObject {
0054             id: items
0055             property Item main: activity.main
0056             property alias background: background
0057             property GCSfx audioEffects: activity.audioEffects
0058             property int currentLevel: activity.currentLevel
0059             readonly property var levels: activity.datasetLoader.data
0060             property alias bonus: bonus
0061             property alias hat: theHat
0062             property alias introductionText: introText
0063             property var repeatersList:
0064                 [repeaterFirstRow, repeaterSecondRow, repeaterAnswerRow]
0065         }
0066 
0067         Rectangle {
0068             id: introTextBG
0069             width: introText.width
0070             height: introText.height
0071             anchors.centerIn: introText
0072             color: "#373737"
0073             radius: 5 * ApplicationInfo.ratio
0074             visible: introText.visible
0075         }
0076 
0077         GCText {
0078             id: introText
0079             anchors {
0080                 horizontalCenter: parent.horizontalCenter
0081                 top: parent.top
0082                 topMargin: 10 * ApplicationInfo.ratio
0083             }
0084             width: parent.width - 10 * ApplicationInfo.ratio
0085             height: (background.height - bar.height * 1.2) * 0.1
0086             fontSizeMode: Text.Fit
0087             minimumPointSize: 7
0088             fontSize: hugeSize
0089             font.bold: true
0090             color: "white"
0091             wrapMode: TextEdit.WordWrap
0092             horizontalAlignment: TextEdit.AlignHCenter
0093             text: qsTr("Click on the hat to begin the game")
0094         }
0095 
0096         Image {
0097             // The math operation
0098             id: operatorImage
0099             source: mode == "minus" ? Activity.url + "minus.svg" :
0100                                       Activity.url + "plus.svg"
0101             anchors.right: operationLayout.left
0102             anchors.rightMargin: 10
0103             width: background.starSize
0104             height: width
0105             sourceSize.width: width
0106             y: operationLayout.y + secondRow.y - height * 0.5
0107         }
0108 
0109         Grid {
0110             id: operationLayout
0111             anchors {
0112                 top: introTextBG.bottom
0113                 topMargin: 10
0114                 horizontalCenter: background.horizontalCenter
0115                 horizontalCenterOffset: operatorImage.width * 0.5
0116             }
0117             width: background.starSize * 12
0118             height: (background.height - bar.height * 1.2) * 0.7
0119             columns: 1
0120             Column {
0121                 id: firstRow
0122                 height: background.starSize * 4
0123                 spacing: 5
0124                 z: 10
0125                 Repeater {
0126                     id: repeaterFirstRow
0127                     model: 3
0128                     StarsBar {
0129                         barGroupIndex: 0
0130                         barIndex: index
0131                         width: operationLayout.width
0132                         backgroundColor: "grey"
0133                         starsColor: starColors[index]
0134                         theHat: items.hat
0135                         starsSize: background.starSize
0136                         opacity: 0
0137                     }
0138                 }
0139             }
0140             Column {
0141                 id: secondRow
0142                 height: background.starSize * 4
0143                 spacing: 5
0144                 z: 9
0145                 Repeater {
0146                     id: repeaterSecondRow
0147                     model: 3
0148                     StarsBar {
0149                         barGroupIndex: 1
0150                         barIndex: index
0151                         width: operationLayout.width
0152                         backgroundColor: "grey"
0153                         starsColor: starColors[index]
0154                         theHat: items.hat
0155                         starsSize: background.starSize
0156                         opacity: 0
0157                     }
0158                 }
0159             }
0160 
0161             Rectangle {
0162                 width: (background.starSize + 5) * 10 - 5
0163                 height: 5 * ApplicationInfo.ratio
0164                 color: "white"
0165             }
0166 
0167             Rectangle {
0168                 width: (background.starSize + 5) * 10 - 5
0169                 height: 10 * ApplicationInfo.ratio
0170                 opacity: 0
0171             }
0172 
0173             Column {
0174                 id: answerRow
0175                 height: background.starSize * 4
0176                 spacing: 5
0177                 Repeater {
0178                     id: repeaterAnswerRow
0179                     model: 3
0180                     StarsBar {
0181                         barGroupIndex: 2
0182                         barIndex: index
0183                         width: operationLayout.width
0184                         backgroundColor: "#53b9c9"
0185                         starsColor: starColors[index]
0186                         authorizeClick: false
0187                         theHat: items.hat
0188                         starsSize: background.starSize
0189                         opacity: 0
0190                     }
0191                 }
0192             }
0193         }
0194 
0195         DialogChooseLevel {
0196             id: dialogActivityConfig
0197             currentActivity: activity.activityInfo
0198 
0199             onSaveData: {
0200                 levelFolder = dialogActivityConfig.chosenLevels
0201                 currentActivity.currentLevels = dialogActivityConfig.chosenLevels
0202                 ApplicationSettings.setCurrentLevels(currentActivity.name, dialogActivityConfig.chosenLevels)
0203             }
0204             onClose: {
0205                 home()
0206             }
0207             onStartActivity: {
0208                 background.stop()
0209                 background.start()
0210             }
0211         }
0212 
0213         DialogHelp {
0214             id: dialogHelp
0215             onClose: home()
0216         }
0217 
0218         Bar {
0219             id: bar
0220             level: items.currentLevel + 1
0221             content: BarEnumContent { value: help | home | level | activityConfig }
0222             onHelpClicked: {
0223                 displayDialog(dialogHelp)
0224             }
0225             onActivityConfigClicked: {
0226                 displayDialog(dialogActivityConfig)
0227             }
0228             onPreviousLevelClicked: Activity.previousLevel()
0229             onNextLevelClicked: Activity.nextLevel()
0230             onHomeClicked: activity.home()
0231         }
0232 
0233         Hat {
0234             id: theHat
0235             anchors {
0236                 bottom: bar.top
0237                 margins: 20 * ApplicationInfo.ratio
0238             }
0239             x: Math.max(20 * ApplicationInfo.ratio, operationLayout.x * 0.5 - width * 0.5)
0240             height: (background.height - bar.height * 1.2) * 0.2
0241             width: height
0242             starsSize: background.starSize
0243             audioEffects: activity.audioEffects
0244         }
0245 
0246         BarButton {
0247             id: okButton
0248             anchors {
0249                 bottom: bar.top
0250                 right: parent.right
0251                 rightMargin: 10 * ApplicationInfo.ratio
0252                 bottomMargin: 10 * ApplicationInfo.ratio
0253             }
0254             source: "qrc:/gcompris/src/core/resource/bar_ok.svg"
0255             width: (background.height - bar.height * 1.2) * 0.15
0256             sourceSize.width: width
0257             enabled: !bonus.isPlaying && theHat.state === "GuessNumber"
0258             onClicked: Activity.verifyAnswer()
0259         }
0260 
0261         Bonus {
0262             id: bonus
0263             Component.onCompleted: win.connect(Activity.nextLevel)
0264         }
0265     }
0266 
0267 }