Warning, /education/gcompris/src/activities/categorization/MenuScreen.qml is written in an unsupported language. File is not indexed.

0001 /* GCompris - MenuScreen.qml
0002 *
0003 * Copyright (C) Divyam Madaan <divyam3897@gmail.com> (Qt Quick port)
0004 *
0005 * Authors:
0006 *   Pascal Georges (pascal.georges1@free.fr) (GTK+ version)
0007 *   Holger Kaelberer <holger.k@elberer.de> (Qt Quick port of imageid)
0008 *   Siddhesh suthar <siddhesh.it@gmail.com> (Qt Quick port)
0009 *   Bruno Coudoin <bruno.coudoin@gcompris.net> (Integration Lang dataset)
0010 *
0011 *   SPDX-License-Identifier: GPL-3.0-or-later
0012 */
0013 import QtQuick 2.12
0014 import GCompris 1.0
0015 import QtGraphicalEffects 1.0
0016 
0017 import "../../core"
0018 import "categorization.js" as Activity
0019 
0020 Image {
0021     id: menuScreen
0022     anchors.fill: parent
0023     fillMode: Image.PreserveAspectCrop
0024     source: "qrc:/gcompris/src/activities/guesscount/resource/backgroundW01.svg"
0025     sourceSize.width: width
0026     sourceSize.height: height
0027     opacity: 0
0028 
0029     property alias menuModel: menuModel
0030     property alias iAmReady: iAmReady
0031     property bool keyboardMode: false
0032     property bool started: opacity == 1
0033 
0034     Behavior on opacity { PropertyAnimation { duration: 200 } }
0035 
0036     visible: opacity != 0
0037 
0038     function start() {
0039         focus = true
0040         forceActiveFocus()
0041         menuGrid.currentIndex = 0
0042         opacity = 1
0043     }
0044 
0045     function stop() {
0046         focus = false
0047         opacity = 0
0048     }
0049 
0050     Keys.onEscapePressed: {
0051         home()
0052     }
0053 
0054     Keys.enabled: (items.mode == "expert") ? false : true
0055     Keys.onPressed: {
0056         if(event.key === Qt.Key_Space) {
0057             menuGrid.currentItem.selectCurrentItem()
0058             event.accepted = true
0059         }
0060         if(event.key === Qt.Key_Enter) {
0061             menuGrid.currentItem.selectCurrentItem()
0062             event.accepted = true
0063         }
0064         if(event.key === Qt.Key_Return) {
0065             menuGrid.currentItem.selectCurrentItem()
0066             event.accepted = true
0067         }
0068         if(event.key === Qt.Key_Left) {
0069             menuGrid.moveCurrentIndexLeft()
0070             event.accepted = true
0071         }
0072         if(event.key === Qt.Key_Right) {
0073             menuGrid.moveCurrentIndexRight()
0074             event.accepted = true
0075         }
0076         if(event.key === Qt.Key_Up) {
0077             menuGrid.moveCurrentIndexUp()
0078             event.accepted = true
0079         }
0080         if(event.key === Qt.Key_Down) {
0081             menuGrid.moveCurrentIndexDown()
0082             event.accepted = true
0083         }
0084     }
0085 
0086     Keys.onReleased: {
0087         keyboardMode = true
0088         event.accepted = false
0089     }
0090 
0091     // sections
0092     property int iconWidth: 180 * ApplicationInfo.ratio
0093     property int iconHeight: 180 * ApplicationInfo.ratio
0094 
0095     property int levelCellWidth: background.width / Math.floor(background.width / iconWidth )
0096     property int levelCellHeight: iconHeight * 1.2
0097 
0098     ListModel {
0099         id: menuModel
0100     }
0101 
0102     GridView {
0103         id: menuGrid
0104         anchors {
0105             fill: parent
0106             bottomMargin: bar.height
0107         }
0108         cellWidth: levelCellWidth
0109         cellHeight: levelCellHeight
0110         clip: true
0111         model: menuModel
0112         keyNavigationWraps: true
0113         property int spacing: 10
0114 
0115         ReadyButton {
0116             id: iAmReady
0117             focus: true
0118             visible: items.iAmReadyChecked
0119             onClicked: {
0120                 Activity.startCategory()
0121             }
0122         }
0123 
0124         delegate: Item {
0125             id: delegateItem
0126             width: levelCellWidth - menuGrid.spacing
0127             height: levelCellHeight - menuGrid.spacing
0128             property string sectionName: name
0129             opacity: (items.mode == "expert") ? 0.25 : 1
0130 
0131             Rectangle {
0132                 id: activityBackground
0133                 width: levelCellWidth - menuGrid.spacing
0134                 height: levelCellHeight - menuGrid.spacing
0135                 anchors.horizontalCenter: parent.horizontalCenter
0136                 color: "white"
0137                 opacity: 0.5
0138             }
0139 
0140             Image {
0141                 id: containerImage
0142                 source: image
0143                 anchors.top: activityBackground.top
0144                 anchors.horizontalCenter: parent.horizontalCenter
0145                 height: activityBackground.height*0.8 - 6
0146                 width: height
0147                 anchors.margins: 5
0148                 sourceSize.height: height
0149                 fillMode: Image.PreserveAspectCrop
0150                 clip: true
0151             }
0152 
0153             GCText {
0154                 id: categoryName
0155                 anchors.top: containerImage.bottom
0156                 horizontalAlignment: Text.AlignHCenter
0157                 verticalAlignment: Text.AlignVCenter
0158                 width: activityBackground.width
0159                 height: activityBackground.height*0.2 - 6
0160                 fontSizeMode: Text.Fit
0161                 elide: Text.ElideRight
0162                 maximumLineCount: 2
0163                 wrapMode: Text.WordWrap
0164                 text: name
0165                 opacity: (items.mode == "expert") ? 0 : 1
0166             }
0167 
0168             ParticleSystemStarLoader {
0169                 id: particles
0170                 anchors.fill: activityBackground
0171             }
0172             MouseArea {
0173                 anchors.fill: activityBackground
0174                 enabled: menuScreen.started && items.mode !== "expert"
0175                 onClicked: selectCurrentItem()
0176             }
0177 
0178             function selectCurrentItem() {
0179                 particles.burst(50)
0180                 Activity.storeCategoriesLevels(index)
0181             }
0182 
0183             Image {
0184                 source: "qrc:/gcompris/src/activities/menu/resource/" +
0185                         ( favorite ? "all.svg" : "all_disabled.svg" );
0186                 anchors {
0187                     top: parent.top
0188                     right: parent.right
0189                     rightMargin: 4 * ApplicationInfo.ratio
0190                 }
0191                 sourceSize.width: iconWidth * 0.25
0192                 visible: ApplicationSettings.sectionVisible
0193                 MouseArea {
0194                     anchors.fill: parent
0195                     onClicked: {
0196                                 for(var i = 0; i < items.menuModel.count; i++) {
0197                             var category = items.menuModel.get(i)
0198                             var categoryIndex = category.index
0199                             if(index == categoryIndex)
0200                             menuModel.get(i)['favorite'] = !menuModel.get(i)['favorite']
0201                         }
0202                     }
0203                 }
0204             }
0205         } //delegate close
0206 
0207         highlight: Rectangle {
0208             width: levelCellWidth - menuGrid.spacing
0209             height: levelCellHeight - menuGrid.spacing
0210             color:  "#AA41AAC4"
0211             border.width: 3
0212             border.color: "black"
0213             visible: (items.mode == "expert") ? false : true
0214             Behavior on x { SpringAnimation { spring: 2; damping: 0.2 } }
0215             Behavior on y { SpringAnimation { spring: 2; damping: 0.2 } }
0216         }
0217 
0218         Rectangle {
0219             id: menusMask
0220             visible: false
0221             anchors.fill: menuGrid
0222             gradient: Gradient {
0223                 GradientStop { position: 0.0; color: "#FFFFFFFF" }
0224                 GradientStop { position: 0.92; color: "#FFFFFFFF" }
0225                 GradientStop { position: 0.96; color: "#00FFFFFF" }
0226             }
0227         }
0228         
0229         layer.enabled: ApplicationInfo.useOpenGL
0230         layer.effect: OpacityMask {
0231             id: activitiesOpacity
0232             source: menuGrid
0233             maskSource: menusMask
0234             anchors.fill: menuGrid
0235         }
0236     } // grid view close
0237 }