File indexing completed on 2024-05-05 15:53:17
0001 /* GCompris - photo_hunter.js 0002 * 0003 * SPDX-FileCopyrightText: 2016 Stefan Toncu <stefan.toncu29@gmail.com> 0004 * 0005 * Authors: 0006 * <Marc Le Douarain> (GTK+ version) 0007 * Stefan Toncu <stefan.toncu29@gmail.com> (Qt Quick port) 0008 * 0009 * SPDX-License-Identifier: GPL-3.0-or-later 0010 */ 0011 .pragma library 0012 .import QtQuick 2.12 as Quick 0013 .import "qrc:/gcompris/src/core/core.js" as Core 0014 0015 var items 0016 var url = "qrc:/gcompris/src/activities/photo_hunter/resource/" 0017 0018 0019 //coordinates are normalized (0 to 1) position/size values of items relative to original image size 0020 var dataset = [ 0021 { 0022 "coordinates": [{x: 0.037, y: 0.011, w: 0.138, h: 0.138}, 0023 {x: 0.064, y: 0.707, w: 0.031, h: 0.032}, 0024 {x: 0.278, y: 0.816, w: 0.104, h: 0.072}] 0025 }, 0026 { 0027 "coordinates": [{x: 0.792, y: 0.16, w: 0.082, h: 0.093}, 0028 {x: 0.77, y: 0.906, w: 0.083, h: 0.06}, 0029 {x: 0.417, y: 0.759, w: 0.128, h: 0.206}] 0030 }, 0031 { 0032 "coordinates": [{x: 0.7, y: 0.09, w: 0.214, h: 0.072}, 0033 {x: 0.487, y: 0.856, w: 0.134, h: 0.055}] 0034 }, 0035 { 0036 "coordinates": [{x: 0.786, y: 0.093, w: 0.059, h: 0.028}, 0037 {x: 0.553, y: 0.477, w: 0.017, h: 0.044}, 0038 {x: 0.406, y: 0.929, w: 0.158, h: 0.046}, 0039 {x: 0.173, y: 0.388, w: 0.087, h: 0.073}] 0040 }, 0041 { 0042 "coordinates": [{x: 0.456, y: 0.143, w: 0.038, h: 0.033}, 0043 {x: 0.28, y: 0.72, w: 0.022, h: 0.023}, 0044 {x: 0.482, y: 0.686, w: 0.077, h: 0.039}, 0045 {x: 0.599, y: 0.786, w: 0.139, h: 0.074}] 0046 }, 0047 { 0048 "coordinates": [{x: 0.14, y: 0.291, w: 0.139, h: 0.14}, 0049 {x: 0.659, y: 0.084, w: 0.126, h: 0.082}, 0050 {x: 0.741, y: 0.872, w: 0.128, h: 0.072}] 0051 }, 0052 { 0053 "coordinates": [{x: 0.049, y: 0.265, w: 0.155, h: 0.05}, 0054 {x: 0.507, y: 0.739, w: 0.134, h: 0.049}, 0055 {x: 0.766, y: 0.405, w: 0.038, h: 0.039}] 0056 }, 0057 { 0058 "coordinates": [{x: 0.364, y: 0.665, w: 0.088, h: 0.029}, 0059 {x: 0.077, y: 0.834, w: 0.047, h: 0.058}, 0060 {x: 0.663, y: 0.395, w: 0.073, h: 0.054}, 0061 {x: 0.133, y: 0.503, w: 0.047, h: 0.071}, 0062 {x: 0.378, y: 0.239, w: 0.015, h: 0.022}, 0063 {x: 0.439, y: 0.48, w: 0.022, h: 0.015}] 0064 }, 0065 { 0066 "coordinates": 0067 [{x: 0.096, y: 0.157, w: 0.02, h: 0.017}, 0068 {x: 0.9, y: 0.891, w: 0.018, h: 0.011}, 0069 {x: 0.497, y: 0.899, w: 0.098, h: 0.014}] 0070 }, 0071 { 0072 "coordinates": [{x: 0.294, y: 0.86, w: 0.106, h: 0.048}, 0073 {x: 0.032, y: 0.146, w: 0.052, h: 0.022}, 0074 {x: 0.561, y: 0.25, w: 0.075, h: 0.087}, 0075 {x: 0.621, y: 0.559, w: 0.056, h: 0.074}] 0076 } 0077 ] 0078 0079 var numberOfLevel = dataset.length 0080 0081 0082 function start(items_) { 0083 items = items_ 0084 items.currentLevel = Core.getInitialLevel(numberOfLevel) 0085 initLevel() 0086 } 0087 0088 function stop() { 0089 } 0090 0091 function initLevel() { 0092 items.background.startedHelp = false 0093 setUp() 0094 } 0095 0096 function setUp() { 0097 loadCoordinate() 0098 0099 for (var i = 0; i < items.model.length; i++) { 0100 items.img1.circleRepeater.itemAt(i).opacity = 0 0101 items.img2.circleRepeater.itemAt(i).opacity = 0 0102 } 0103 0104 items.img1.good = 0 0105 items.img2.good = 0 0106 0107 items.total = dataset[items.currentLevel].coordinates.length 0108 0109 items.img1.source = url + "photo" + (items.currentLevel+1) + ".svg" 0110 items.img2.source = url + "photo" + (items.currentLevel+1) + ".svg" 0111 } 0112 0113 function loadCoordinate() { 0114 var pointPositions = dataset[items.currentLevel].coordinates 0115 var linePropertiesArray = [] 0116 0117 for (var i = 0; i < (pointPositions.length); i++) { 0118 var lineProperties = [] 0119 lineProperties[0] = pointPositions[i].x 0120 lineProperties[1] = pointPositions[i].y 0121 linePropertiesArray[i] = lineProperties 0122 } 0123 items.model = linePropertiesArray 0124 } 0125 0126 0127 function photoClicked(item, index) { 0128 //only if the difference is not yet spotted 0129 if (items.img2.repeater.itemAt(index).opacity === 0) { 0130 0131 //activate the particle loader 0132 items.img1.repeater.itemAt(index).particleLoader.item.burst(40) 0133 items.img2.repeater.itemAt(index).particleLoader.item.burst(40) 0134 0135 // show the actual difference on the second image 0136 items.img2.repeater.itemAt(index).differenceAnimation.start() 0137 0138 // scale animation for the blue circle 0139 items.img1.circleRepeater.itemAt(index).scaleAnim.start() 0140 items.img2.circleRepeater.itemAt(index).scaleAnim.start() 0141 0142 // set opacity of circle differences to 1 0143 items.img1.circleRepeater.itemAt(index).opacity = 1 0144 items.img2.circleRepeater.itemAt(index).opacity = 1 0145 0146 // all good; check if all the differences have been spotted 0147 item.good++ 0148 items.background.checkAnswer() 0149 } 0150 } 0151 0152 function nextLevel() { 0153 items.model = [] 0154 items.currentLevel = Core.getNextLevel(items.currentLevel, numberOfLevel); 0155 initLevel(); 0156 } 0157 0158 function previousLevel() { 0159 items.model = [] 0160 items.currentLevel = Core.getPreviousLevel(items.currentLevel, numberOfLevel); 0161 initLevel(); 0162 }