Warning, /education/gcompris/src/activities/babymatch/DragListItem.qml is written in an unsupported language. File is not indexed.
0001 /* gcompris - DragListItem.qml
0002 *
0003 * SPDX-FileCopyrightText: 2015 Pulkit Gupta <pulkitgenius@gmail.com>
0004 *
0005 * Authors:
0006 * Pulkit Gupta <pulkitgenius@gmail.com>
0007 *
0008 * SPDX-License-Identifier: GPL-3.0-or-later
0009 */
0010 import QtQuick 2.12
0011 import QtGraphicalEffects 1.0
0012 import GCompris 1.0
0013 import "babymatch.js" as Activity
0014
0015 Item {
0016 id: item
0017
0018 width: tile.width
0019 height: tile.height
0020
0021 property string source: imgName
0022 property double tileSize
0023 property int imgSize: Math.round(tileSize * 0.9)
0024 property QtObject answer: tileImage.parent
0025 property bool selected: false
0026 property alias dropStatus: tileImage.dropStatus
0027
0028 signal pressed
0029
0030 ParallelAnimation {
0031 id: tileImageAnimation
0032 NumberAnimation {
0033 target: tileImage
0034 easing.type: Easing.OutQuad
0035 property: "x"
0036 to: tileImage.moveImageX
0037 duration: 430
0038 }
0039 NumberAnimation {
0040 target: tileImage
0041 easing.type: Easing.OutQuad
0042 property: "y"
0043 to: tileImage.moveImageY
0044 duration: 430
0045 }
0046 onStarted: {
0047 tileImage.anchors.centerIn = undefined;
0048 view.showGlow = false;
0049 }
0050 onStopped: {
0051 tileImage.parent = tileImage.tileImageParent;
0052 if(tileImage.currentTargetSpot == null) {
0053 tileImage.centerInTile();
0054 } else {
0055 tileImage.anchors.centerIn = tileImage.currentTargetSpot;
0056 }
0057 updateOkButton();
0058 }
0059 }
0060
0061 Rectangle {
0062 id: tile
0063 width: tileSize
0064 height: tileSize
0065 color: (parent.selected && tileImage.parent == tile) ? "#33FF294D" : "transparent"
0066 border.color: (parent.selected && tileImage.parent == tile) ? "white" : "transparent"
0067 border.width: 3
0068 radius: 2
0069
0070 property double xCenter: tile.x + tile.width * 0.5
0071 property double yCenter: tile.y + tile.height * 0.5
0072
0073 Image {
0074 id: sourceImage
0075 visible: false
0076 source: Activity.imagesUrl + imgName
0077 }
0078
0079 Image {
0080 id: tileImage
0081 sourceSize.width: width
0082 sourceSize.height: height
0083 width: imgSize
0084 height: imgSize
0085 x: parent.xCenter - width * 0.5
0086 y: parent.yCenter - height * 0.5
0087 fillMode: Image.PreserveAspectFit
0088 source: Activity.imagesUrl + imgName
0089
0090 property double fullWidth: imgWidth ? imgWidth * backgroundImage.width : (backgroundImage.source == "" ?
0091 sourceImage.sourceSize.width :
0092 backgroundImage.width * sourceImage.sourceSize.width/backgroundImageSource.sourceSize.width)
0093 property double fullHeight: imgHeight ? imgHeight * backgroundImage.height : (backgroundImage.source == "" ?
0094 sourceImage.sourceSize.height :
0095 backgroundImage.height * sourceImage.sourceSize.height/backgroundImageSource.sourceSize.height)
0096 property QtObject tileImageParent
0097 property double moveImageX
0098 property double moveImageY
0099 property int dropStatus: -1 // -1: Nothing / 0: Bad pos / 1: Good pos
0100 property bool small: true
0101 property Item currentTargetSpot
0102 property bool dropEnabled: false
0103 property bool parentIsTile : parent == tile ? true : false
0104
0105 onFullWidthChanged: correctDroppedImageSize();
0106 onFullHeightChanged: correctDroppedImageSize();
0107
0108 function correctDroppedImageSize() {
0109 if(tileImage.dropStatus == 0 || tileImage.dropStatus == 1) {
0110 tileImage.width = tileImage.fullWidth;
0111 tileImage.height = tileImage.fullHeight;
0112 }
0113 }
0114
0115 function centerInTile() {
0116 x = tile.xCenter - tileImage.width * 0.5;
0117 y = tile.yCenter - tileImage.height * 0.5;
0118 }
0119
0120 function imageRemove() {
0121 dropStatus = -1;
0122 if(backgroundImage.source == "")
0123 leftWidget.z = 1;
0124
0125 tileImage.currentTargetSpot = null;
0126 tileImage.tileImageParent = tile;
0127 toSmall();
0128 var coord = tileImage.parent.mapFromItem(tile, tile.xCenter - tileImage.width * 0.5,
0129 tile.yCenter - tileImage.height * 0.5);
0130 tileImage.moveImageX = coord.x;
0131 tileImage.moveImageY = coord.y;
0132 tileImageAnimation.start();
0133 }
0134
0135 function toSmall() {
0136 width = imgSize;
0137 height = imgSize;
0138 small = true;
0139 }
0140
0141 function toFull() {
0142 width = fullWidth;
0143 height = fullHeight;
0144 small = false;
0145 }
0146
0147 MouseArea {
0148 enabled: !items.inputLocked
0149 drag.target: parent
0150 property real startX
0151 property real startY
0152
0153 anchors.centerIn: parent
0154 // the MouseArea size of dropped items is never smaller than the dropCircles
0155 width: Math.max(parent.width, items.minimumClickArea)
0156 height: Math.max(parent.height, items.minimumClickArea)
0157
0158 onPressed: {
0159 Activity.hideInstructions();
0160 item.pressed();
0161 tileImage.toSmall();
0162 tileImage.anchors.centerIn = undefined;
0163 tileImage.dropStatus = -1;
0164 item.hideOkButton();
0165 startX = mouseX;
0166 startY = mouseY;
0167 toolTip.show(toolTipText);
0168 if(tileImage.parent == tile)
0169 leftWidget.z = 3;
0170 else {
0171 leftWidget.z = 1;
0172 }
0173
0174 if(tileImage.currentTargetSpot) {
0175 var coords = movePlaceholder.mapFromItem(backgroundImage, tileImage.currentTargetSpot.xCenter, tileImage.currentTargetSpot.yCenter);
0176 tileImage.parent = movePlaceholder;
0177 tileImage.x = coords.x - tileImage.width * 0.5;
0178 tileImage.y = coords.y - tileImage.height * 0.5;
0179 tileImage.currentTargetSpot.currentTileImageItem = null;
0180 tileImage.currentTargetSpot = null;
0181 }
0182 if(imgSound)
0183 activity.audioVoices.play(ApplicationInfo.getAudioFilePath(imgSound));
0184 }
0185
0186 onPositionChanged: {
0187 tileImage.opacity = 0.5;
0188 if((background.verticalBar && tileImage.x > leftWidget.width) || (!background.verticalBar && tileImage.y > leftWidget.height)) {
0189 tileImage.dropEnabled = true;
0190 Activity.highLightSpot(getClosestSpot(), tileImage);
0191 } else {
0192 tileImage.dropEnabled = false;
0193 Activity.clearHighLightSpots();
0194 }
0195 }
0196
0197 onReleased: {
0198 tileImage.opacity = 1;
0199 Activity.highLightSpot(null, tileImage);
0200 var closestSpot = null;
0201 if(tileImage.dropEnabled) {
0202 closestSpot = getClosestSpot();
0203 updateFoundStatus(closestSpot);
0204 tileImage.dropEnabled = false;
0205 }
0206 if(closestSpot === null) {
0207 if(tileImage.currentTargetSpot)
0208 tileImage.currentTargetSpot.imageRemove();
0209 else
0210 tileImage.imageRemove();
0211 } else {
0212 if(tileImage.currentTargetSpot !== closestSpot) {
0213 closestSpot.imageRemove();
0214 closestSpot.imageAdd(tileImage);
0215 }
0216 tileImage.currentTargetSpot = closestSpot;
0217 tileImage.tileImageParent = backgroundImage;
0218 var originCoords = tileImage.parent.mapToItem(backgroundImage, tileImage.x, tileImage.y);
0219 tileImage.parent = tileImage.tileImageParent;
0220 tileImage.x = originCoords.x;
0221 tileImage.y = originCoords.y;
0222 tileImage.toFull();
0223 var coord = tileImage.parent.mapFromItem(backgroundImage,
0224 closestSpot.xCenter - tileImage.fullWidth/2,
0225 closestSpot.yCenter - tileImage.fullHeight/2);
0226 tileImage.moveImageX = coord.x;
0227 tileImage.moveImageY = coord.y;
0228 tileImage.z = 100;
0229 tileImageAnimation.start();
0230 }
0231 }
0232
0233 function getClosestSpot() {
0234 var coordImg = tileImage.parent.mapToItem(backgroundImage,
0235 tileImage.x + tileImage.width/2,
0236 tileImage.y + tileImage.height/2);
0237 return Activity.getClosestSpot(coordImg.x, coordImg.y);
0238 }
0239
0240 function updateFoundStatus(closestSpot) {
0241 if(!closestSpot) {
0242 tileImage.dropStatus = -1;
0243 return;
0244 }
0245 if(closestSpot.imgName === imgName)
0246 tileImage.dropStatus = 1;
0247 else
0248 tileImage.dropStatus = 0;
0249 }
0250 }
0251
0252 Image {
0253 id: wrongAnswer
0254 anchors.centerIn: parent
0255 height: imgSize * 0.3
0256 width: imgSize * 0.3
0257 fillMode: Image.PreserveAspectFit
0258 z: 10
0259 source:"qrc:/gcompris/src/activities/babymatch/resource/error.svg"
0260 visible: view.showGlow && tileImage.dropStatus === 0
0261 }
0262
0263 }
0264
0265 Glow {
0266 id: tileImageGlow
0267 parent: tileImage.parent
0268 anchors.fill: tileImage
0269 radius: 8
0270 samples: 17
0271 color: view.showGlow && Activity.glowEnabled ?
0272 (tileImage.dropStatus === 0 ? "red" : "white") :
0273 'transparent'
0274 source: tileImage
0275 opacity: tileImage.opacity
0276 }
0277 }
0278
0279 function hideOkButton() {
0280 if(view.okShowed) {
0281 hideOk.start();
0282 view.okShowed = false;
0283 view.showGlow = false;
0284 }
0285 }
0286
0287 function updateOkButton() {
0288 if(view.areAllPlaced()) {
0289 showOk.start();
0290 }
0291 if(!view.okShowed && tileImage.dropStatus >= 0)
0292 view.checkDisplayedGroup();
0293 if(!view.okShowed && tileImage.dropStatus == -1) {
0294 view.displayedGroup[parseInt(index/view.nbItemsByGroup)] = true;
0295 view.setPreviousNavigation();
0296 view.setNextNavigation();
0297 view.checkDisplayedGroup();
0298 }
0299 }
0300 }