Warning, /education/marble/examples/qml/where-is-that/where-is-that.qml is written in an unsupported language. File is not indexed.
0001 // SPDX-License-Identifier: LGPL-2.1-or-later 0002 // 0003 // SPDX-FileCopyrightText: 2010 Dennis Nienhüser <nienhueser@kde.org> 0004 // 0005 0006 import Qt 4.7 0007 import org.kde.marble 0.20 0008 0009 Rectangle { 0010 id: screen 0011 width: 800; 0012 height: 400 0013 0014 Rectangle 0015 { 0016 id: banner 0017 x: 0 0018 y: 0 0019 width: screen.width 0020 height: 30 0021 color: "yellow" 0022 0023 // XmlListModel { 0024 // id: questionModel 0025 // source: "questions.xml" 0026 // query: "/items/item" 0027 // XmlRole { name: "question"; query: "question/string()" } 0028 // XmlRole { name: "lon"; query: "lon/string()" } 0029 // XmlRole { name: "lat"; query: "lat/string()" } 0030 // } 0031 0032 // @todo: XmlListModel would be nicer, but does not yet allow data access for non-views 0033 ListModel { 0034 id: questionModel 0035 ListElement { 0036 question: "Tom Sawyer paints aunt Polly's fence. Where was that?" 0037 lon: -91.3775 0038 lat: 39.704167 0039 } 0040 ListElement { 0041 question: "Jonathan Harker meets Count Dracula. Where?" 0042 lon: 25.370894 0043 lat: 45.517444 0044 } 0045 ListElement { 0046 question: "Henry Jekyll becomes Edward Hyde in...?" 0047 lon: -0.11832 0048 lat: 51.50939 0049 } 0050 ListElement { 0051 question: "Where did Quasimodo ring the bells?" 0052 lon: 2.35 0053 lat: 48.852778 0054 } 0055 } 0056 0057 Component { 0058 id: questionDelegate 0059 Row { 0060 Text { 0061 id: questionItem 0062 text: question 0063 font { pointSize: 12; bold: true } 0064 color: "#606060" 0065 } 0066 } 0067 } 0068 0069 ListView { 0070 id: questionView 0071 0072 x: 10 0073 y: 5 0074 width: banner.width - button.width - 30 0075 height: 20 0076 0077 visible: false 0078 clip: true 0079 0080 model: questionModel 0081 delegate: questionDelegate 0082 } 0083 0084 FloatButton 0085 { 0086 id: button 0087 y: 2 0088 anchors.left: questionView.right 0089 font { pointSize: 12; bold: true } 0090 color: "#606060" 0091 label: "Start" 0092 0093 onClicked: 0094 { 0095 if ( screen.state == "moving" ) { 0096 screen.state = "solving" 0097 } else if ( screen.state == "solving" ) { 0098 if ( questionView.currentIndex < questionView.count - 1 ) { 0099 questionView.visible = true 0100 questionView.currentIndex = questionView.currentIndex + 1 0101 screen.state = "selecting" 0102 messages.text = "Select the target in the map" 0103 } else { 0104 screen.state = "finished" 0105 messages.text = "" 0106 } 0107 } else if ( screen.state == "finished" ) { 0108 questionView.currentIndex = 0 0109 screen.state = "selecting" 0110 } 0111 else { 0112 screen.state = "selecting" 0113 } 0114 } 0115 } 0116 } 0117 0118 MouseArea 0119 { 0120 id: area 0121 anchors.top: banner.bottom 0122 width: screen.width 0123 height: screen.height - banner.height 0124 0125 onClicked: 0126 { 0127 if ( screen.state == "selecting" || screen.state == "moving" ) { 0128 screen.state = "selecting" 0129 0130 var opx = pointer.x 0131 var opy = pointer.y 0132 pointer.x = area.mouseX 0133 pointer.y = area.mouseY 0134 selection.x = pointer.x; 0135 selection.y = pointer.y - selection.height 0136 screen.state = "moving" 0137 messages.text = "Done? Click 'Solve'" 0138 0139 var diff = (pointer.x-opx) * (pointer.x-opx); 0140 diff += (pointer.y-opy) * (pointer.y-opy); 0141 if ( diff > 2000 ) { 0142 animation.duration = 500 0143 animation.start() 0144 } else { 0145 animation.duration = 100 0146 } 0147 } 0148 } 0149 0150 MarbleWidget { 0151 id: map 0152 width: area.width 0153 height: area.height 0154 0155 projection: "Mercator" 0156 mapThemeId: "earth/plain/plain.dgml" 0157 } 0158 0159 Image 0160 { 0161 id: selection 0162 x: 200 0163 y: 200 0164 source: "fixing-pin.svg" 0165 visible: false 0166 } 0167 0168 Rectangle 0169 { 0170 id: pointer 0171 x: 200 0172 y: 200 0173 width: 1 0174 height: 1 0175 visible: false 0176 } 0177 0178 PropertyAnimation { 0179 id: solutionanimation 0180 target: solution 0181 property: "scale" 0182 from: .01; to: 1 0183 duration: 1500 0184 } 0185 0186 Image 0187 { 0188 id: solution 0189 x: 200 0190 y: 200 0191 visible: false 0192 source: "target.svg" 0193 } 0194 0195 Rectangle 0196 { 0197 x: 5 0198 y: parent.height - 40 0199 width: 300 0200 height: 30 0201 radius: 5 0202 color: "yellow" 0203 0204 Text 0205 { 0206 id: messages 0207 x: 10 0208 y: 5 0209 width: 280 0210 text: "Where is that?" 0211 font { pointSize: 12; bold: true } 0212 color: "#606060" 0213 visible: true 0214 } 0215 } 0216 } 0217 0218 PropertyAnimation { 0219 id: animation 0220 target: selection 0221 property: "scale" 0222 from: .1; to: 1 0223 duration: 500 0224 } 0225 0226 function calculateSolution() 0227 { 0228 var lon = questionModel.get(questionView.currentIndex).lon 0229 var lat = questionModel.get(questionView.currentIndex).lat 0230 var pixel = map.pixel( lon, lat ) 0231 solution.x = pixel.x 0232 solution.y = pixel.y - solution.height 0233 } 0234 0235 function solve() 0236 { 0237 var flon = questionModel.get(questionView.currentIndex).lon 0238 var flat = questionModel.get(questionView.currentIndex).lat 0239 var coordinate = map.coordinate( pointer.x, pointer.y ) 0240 var dist = coordinate.distance( flon, flat ) / 1000 0241 messages.text = "Target distance: " + dist.toFixed(1) + " km" 0242 } 0243 0244 states: [ 0245 State { 0246 name: "selecting" 0247 PropertyChanges { target: questionView; visible: true } 0248 PropertyChanges { target: button; label: "Solve" } 0249 PropertyChanges { target: button; visible: false } 0250 PropertyChanges { target: solution; visible: false } 0251 PropertyChanges { target: map; inputEnabled: false } 0252 PropertyChanges { target: selection; visible: false } 0253 StateChangeScript{ script: calculateSolution(); } 0254 }, 0255 State { 0256 name: "moving" 0257 PropertyChanges { target: questionView; visible: true } 0258 PropertyChanges { target: button; label: "Solve" } 0259 PropertyChanges { target: button; visible: true } 0260 PropertyChanges { target: solution; visible: false } 0261 PropertyChanges { target: map; inputEnabled: false } 0262 PropertyChanges { target: selection; visible: true; } 0263 }, 0264 State { 0265 name: "solving" 0266 PropertyChanges { target: questionView; visible: true } 0267 PropertyChanges { target: button; label: "Next" } 0268 PropertyChanges { target: button; visible: true } 0269 PropertyChanges { target: solution; visible: true } 0270 PropertyChanges { target: map; inputEnabled: false } 0271 PropertyChanges { target: selection; visible: true } 0272 StateChangeScript{ script: solutionanimation.start(); } 0273 StateChangeScript{ script: solve(); } 0274 }, 0275 State { 0276 name: "finished" 0277 PropertyChanges { target: questionView; visible: true } 0278 PropertyChanges { target: button; label: "Try Again" } 0279 PropertyChanges { target: button; visible: true } 0280 PropertyChanges { target: solution; visible: false } 0281 PropertyChanges { target: messages; text: "" } 0282 PropertyChanges { target: map; inputEnabled: true } 0283 PropertyChanges { target: selection; visible: false } 0284 } 0285 ] 0286 0287 transitions: [ 0288 Transition { 0289 id: movetransition 0290 from: "selecting" 0291 to: "moving" 0292 reversible: true 0293 NumberAnimation { 0294 target: selection 0295 properties: "x,y" 0296 duration: animation.duration 0297 } 0298 } 0299 ] 0300 0301 }