Merge pull request 'Feature In-Game Compass' (#27) from feature/in-game-compass into develop

Reviewed-on: https://gitea.e5tv.hu/esoko/mapguesser/pulls/27
Reviewed-by: Pőcze Bence <bence@pocze.ch>

multi/index.js

@@ -5,7 +5,7 @@ process.title = 'mapguesser-multi';
 class MultiGame {
     static ROUND_TIMEOUT_DEFAULT = 120000;
     static ROUND_TIMEOUT_MINIMUM = 15000;
-    static ROUND_TIMEOUT_DIVIDER = 2;
+    static ROUND_TIMEOUT_DIVIDER = 1.5;
     static ROUND_TIMEOUT_OFFSET = 500;
 
     constructor() {
@@ -36,19 +36,20 @@ class MultiGame {
 
     createRoom(roomId) {
         this.rooms.set(roomId, { members: new Map(), rounds: [], currentRound: -1, updated: new Date() });
+
+        return { ok: true };
     }
 
     joinRoom(roomId, token, userName) {
         if (!this.rooms.has(roomId)) {
-            console.error('Room does not exist!')
-            return;
+            return { error: 'room_not_found' };
         }
 
         var room = this.rooms.get(roomId);
         room.updated = new Date();
 
         if (room.members.has(token)) {
-            return;
+            return { error: 'member_already_joined' };
         }
 
         var data = { userName: userName };
@@ -58,13 +59,13 @@ class MultiGame {
         });
 
         room.members.set(token, { userName: userName, connection: null });
+
+        return { ok: true };
     }
 
     startGame(roomId, places) {
         if (!this.rooms.has(roomId)) {
-            //TODO: send something back
-            console.log('Room does not exist!')
-            return;
+            return { error: 'room_not_found' };
         }
 
         var room = this.rooms.get(roomId);
@@ -84,19 +85,23 @@ class MultiGame {
         room.rounds = rounds;
 
         this.nextRound(roomId, 0);
+
+        return { ok: true };
     }
 
     guess(roomId, token, guessPosition, distance, score) {
         if (!this.rooms.has(roomId)) {
-            //TODO: send something back
-            console.log('Room does not exist!')
-            return;
+            return { error: 'room_not_found' };
         }
 
         var room = this.rooms.get(roomId);
         room.updated = new Date();
 
         var round = room.rounds[room.currentRound];
+        if (round.results.has(token)) {
+            return { error: 'already_guessed' };
+        }
+
         var member = room.members.get(token);
         var allResults = this._collectResultsInRound(room, round);
 
@@ -106,14 +111,12 @@ class MultiGame {
 
         this._setNewTimeout(room, round);
 
-        return allResults;
+        return { allResults: allResults };
     }
 
     nextRound(roomId, currentRound) {
         if (!this.rooms.has(roomId)) {
-            //TODO: send something back
-            console.log('Room does not exist!')
-            return;
+            return { error: 'room_not_found' };
         }
 
         var room = this.rooms.get(roomId);
@@ -137,6 +140,8 @@ class MultiGame {
         room.members.forEach(function (member) {
             self._sendToMember(member, 'new_round', data);
         });
+
+        return { ok: true };
     }
 
     _setNewTimeout(room, round) {
@@ -150,7 +155,7 @@ class MultiGame {
         } else {
             round.timeout = round.timeout - (new Date() - round.timeoutStarted);
             if (round.timeout > MultiGame.ROUND_TIMEOUT_DIVIDER * MultiGame.ROUND_TIMEOUT_MINIMUM) {
-                round.timeout = round.timeout / MultiGame.ROUND_TIMEOUT_DIVIDER;
+                round.timeout = Math.round(round.timeout / MultiGame.ROUND_TIMEOUT_DIVIDER);
             } else if (round.timeout > MultiGame.ROUND_TIMEOUT_MINIMUM) {
                 round.timeout = MultiGame.ROUND_TIMEOUT_MINIMUM;
             }
@@ -165,9 +170,18 @@ class MultiGame {
     }
 
     _endRound(room, round) {
-        var data = { position: round.place.position, allResults: this._collectResultsInRound(room, round) };
+        var allResults = this._collectResultsInRound(room, round);
         var self = this;
-        room.members.forEach(function (member) {
+        room.members.forEach(function (member, token) {
+            var result = { guessPosition: null, distance: null, score: 0 };
+
+            if (round.results.has(token)) {
+                result = round.results.get(token);
+            } else {
+                round.results.set(token, result);
+            }
+
+            var data = { position: round.place.position, result: result, allResults: allResults };
             self._sendToMember(member, 'end_round', data);
         });
     }
@@ -183,9 +197,13 @@ class MultiGame {
         }
 
         data.history = [];
-        for (var i = 0; i < room.currentRound; ++i) {
+        for (var i = 0; i <= room.currentRound; ++i) {
             var round = room.rounds[i];
 
+            if (i === room.currentRound && !round.results.has(token)) {
+                continue;
+            }
+
             var result = { guessPosition: null, distance: null, score: 0 };
             var allResults = [];
 
@@ -210,6 +228,8 @@ class MultiGame {
             data.members.push({ userName: currentMember.userName, me: member === currentMember });
         });
 
+        data.readyToContinue = room.currentRound >= 0 && room.members.size === room.rounds[room.currentRound].results.size
+
         this._sendToMember(member, 'initialize', data);
     }
 
@@ -280,30 +300,30 @@ var tcpServer = net.createServer(function (socket) {
             return;
         }
 
-        var response = { data: null };
+        var response;
         switch (data.func) {
             case 'create_room':
-                response.data = multiGame.createRoom(data.args.roomId);
+                response = multiGame.createRoom(data.args.roomId);
 
                 break;
 
             case 'join_room':
-                response.data = multiGame.joinRoom(data.args.roomId, data.args.token, data.args.userName);
+                response = multiGame.joinRoom(data.args.roomId, data.args.token, data.args.userName);
 
                 break;
 
             case 'start_game':
-                response.data = multiGame.startGame(data.args.roomId, data.args.places);
+                response = multiGame.startGame(data.args.roomId, data.args.places);
 
                 break
 
             case 'guess':
-                response.data = multiGame.guess(data.args.roomId, data.args.token, data.args.guessPosition, data.args.distance, data.args.score);
+                response = multiGame.guess(data.args.roomId, data.args.token, data.args.guessPosition, data.args.distance, data.args.score);
 
                 break;
 
             case 'next_round':
-                response.data = multiGame.nextRound(data.args.roomId, data.args.currentRound);
+                response = multiGame.nextRound(data.args.roomId, data.args.currentRound);
 
                 break;
         }

multi/package.json

@@ -8,6 +8,6 @@
         "ws": "^7.4.4"
     },
     "scripts": {},
-    "author": "Pőcze Bence <bence@pocze.ch>",
+    "author": "Pőcze Bence and The MapGuesser Contributors <bence@pocze.ch>",
     "license": "GNU AGPL 3.0"
 }

public/static/css/game.css

@@ -149,13 +149,47 @@
     color: #701919;
 }
 
+#navigation {
+    position: absolute;
+    z-index: 2;
+}
+
+#navigation .navigationItem {
+    margin-top: 10px;
+    opacity: 70%;
+    cursor: pointer;
+}
+
+#navigation .navigationItem:hover {
+    opacity: 100%;
+}
+
+#navigation .navigationItem div {
+    position: absolute;
+}
+
+#navigation .circleBackground {
+    width: 100%;
+    height: 100%;
+    opacity: 50%;
+}
+
+#navigation .navigationIcon {
+    width: 75%;
+    height: 75%;
+    margin: auto;
+    margin-top: 50%;
+    transform: translateY(-50%);
+    -ms-transform: translateY(-50%);
+}
+
 @media screen and (max-width: 599px) {
     #mapName {
         display: none;
     }
     #showGuessButtonContainer {
         position: absolute;
-        left: 20px;
+        left: 65px;
         bottom: 30px;
         right: 20px;
         z-index: 2;
@@ -172,6 +206,14 @@
     #scoreBarBase {
         width: 100%;
     }
+    #navigation {
+        bottom: 25px;
+        left: 10px;
+        width: 45px;
+    }
+    #navigation .navigationItem {
+        height: 45px;
+    }
 }
 
 @media screen and (min-width: 600px) {
@@ -215,6 +257,14 @@
     #scoreBarBase {
         width: 60%;
     }
+    #navigation {
+        bottom: 50px;
+        left: 20px;
+        width: 60px;
+    }
+    #navigation .navigationItem {
+        height: 60px;
+    }
     @media screen and (max-height: 424px) {
         #guess {
             top: 10px;
@@ -229,5 +279,13 @@
             right: 20px;
             bottom: 30px;
         }
+        #navigation {
+            bottom: 30px;
+            left: 10px;
+            width: 45px;
+        }
+        #navigation .navigationItem {
+            height: 45px;
+        }
     }
 }

public/static/css/mapguesser.css

@@ -12,6 +12,10 @@ html, body {
     padding: 0;
 }
 
+body {
+    background-color: #cccccc;
+}
+
 button::-moz-focus-inner, input::-moz-focus-inner {
     padding: 0;
     border: 0;
@@ -374,6 +378,7 @@ header>p>span:not(:last-child) {
 }
 
 main {
+    background-color: #ffffff;
     padding: 6px 12px;
 }
 

public/static/img/circle_background.svg

@@ -0,0 +1,3 @@
+<svg xmlns="http://www.w3.org/2000/svg" width="100%" height="100%" viewBox="0 0 16 16">
+  <circle cx="50%" cy="50%" r="50%" fill="black" />
+</svg>

public/static/img/compass.svg

@@ -0,0 +1,5 @@
+<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 100 100">
+  <polygon id="needleNorth" points="50,0 33,50 66,50" style="fill:red;stroke:black;stroke-width:1" />
+  <polygon id="needleSouth" points="50,100 33,50 66,50" style="fill:white;stroke:black;stroke-width:1" />
+  Sorry, your browser does not support inline SVG.
+</svg>

public/static/img/house-fill.svg

@@ -0,0 +1,5 @@
+<!-- Original image: Copyright (c) 2019 The Bootstrap Authors. License can be found in 'USED_SOFTWARE' in section 'Bootstrap Icons'. -->
+<svg xmlns="http://www.w3.org/2000/svg" width="100%" height="100%" fill="#3183ce" viewBox="0 0 16 16">
+  <path fill-rule="evenodd" d="m8 3.293 6 6V13.5a1.5 1.5 0 0 1-1.5 1.5h-9A1.5 1.5 0 0 1 2 13.5V9.293l6-6zm5-.793V6l-2-2V2.5a.5.5 0 0 1 .5-.5h1a.5.5 0 0 1 .5.5z"/>
+  <path fill-rule="evenodd" d="M7.293 1.5a1 1 0 0 1 1.414 0l6.647 6.646a.5.5 0 0 1-.708.708L8 2.207 1.354 8.854a.5.5 0 1 1-.708-.708L7.293 1.5z"/>
+</svg>

public/static/js/game.js

@@ -17,7 +17,7 @@
         adaptGuess: false,
         googleLink: null,
 
-        readyToContinue: false,
+        readyToContinue: true,
         timeoutEnd: null,
         countdownHandler: null,
 
@@ -97,52 +97,61 @@
             },
 
             initialize: function (data) {
-                if (data.history) {
-                    for (var i = 0; i < data.history.length; ++i) {
-                        var round = data.history[i];
-                        Game.rounds.push({ position: round.position, guessPosition: round.result.guessPosition, realMarker: null, guessMarkers: [] });
-                        Game.addPositionToResultMap(true);
-                        if (round.result.guessPosition) {
-                            Game.addGuessPositionToResultMap(round.result.guessPosition, null, true);
-                        }
-                        Game.scoreSum += round.result.score;
+                Game.readyToContinue = false;
 
-                        for (var j = 0; j < round.allResults.length; ++j) {
-                            var result = round.allResults[j];
+                if (data.history.length === 0 && !data.place) {
+                    var div = document.getElementById('players');
+
+                    for (var i = 0; i < data.members.length; ++i) {
+                        var member = data.members[i];
+
+                        var p = document.createElement('p');
+                        p.innerHTML = member.userName + (member.me ? ' (me)' : '');
+                        div.appendChild(p);
+                    }
+                }
+
+                for (var i = 0; i < data.history.length; ++i) {
+                    var round = data.history[i];
+                    Game.rounds.push({ position: round.position, guessPosition: round.result.guessPosition, realMarker: null, guessMarkers: [] });
+                    Game.addPositionToResultMap(true);
+                    if (round.result.guessPosition) {
+                        Game.addGuessPositionToResultMap(round.result.guessPosition, null, true);
+                    }
+                    Game.scoreSum += round.result.score;
+
+                    for (var j = 0; j < round.allResults.length; ++j) {
+                        var result = round.allResults[j];
+                        if (result.guessPosition) {
                             Game.addGuessPositionToResultMap(result.guessPosition, result, true);
                         }
                     }
-
-                    document.getElementById('currentRound').innerHTML = String(Game.rounds.length) + '/' + String(Game.NUMBER_OF_ROUNDS);
-                    document.getElementById('currentScoreSum').innerHTML = String(Game.scoreSum) + '/' + String(Game.rounds.length * Game.MAX_SCORE);
                 }
 
+                document.getElementById('currentRound').innerHTML = String(Game.rounds.length) + '/' + String(Game.NUMBER_OF_ROUNDS);
+                document.getElementById('currentScoreSum').innerHTML = String(Game.scoreSum) + '/' + String(Game.rounds.length * Game.MAX_SCORE);
+
                 if (data.timeout) {
                     Game.startCountdown(data.timeout);
                 }
 
                 if (data.place) {
-                    Game.readyToContinue = false;
+                    Game.readyToContinue = data.readyToContinue;
                     Game.panoId = data.place.panoId;
                     Game.pov = data.place.pov;
 
                     document.getElementById('multi').style.visibility = 'hidden';
-                    document.getElementById('panoCover').style.visibility = 'hidden';
 
-                    Game.startNewRound();
+                    if (Game.rounds.length === 0 || !Game.rounds[Game.rounds.length - 1].position) {
+                        document.getElementById('panoCover').style.visibility = 'hidden';
+                        Game.startNewRound();
+                    } else {
+                        Game.loadPano(Game.panoId, Game.pov);
+                        Game.showResultFromHistory(data.history[data.history.length - 1].result);
+                    }
                 }
 
                 document.getElementById('loading').style.visibility = 'hidden';
-
-                var div = document.getElementById('players');
-
-                for (var i = 0; i < data.members.length; ++i) {
-                    var member = data.members[i];
-
-                    var p = document.createElement('p');
-                    p.innerHTML = member.userName + (member.me ? ' (me)' : '');
-                    div.appendChild(p);
-                }
             },
 
             memberJoined: function (data) {
@@ -195,15 +204,10 @@
                     return;
                 }
 
-                // TODO: refactor - it is necessary for mobile
-                if (window.getComputedStyle(document.getElementById('guess')).visibility === 'hidden') {
-                    document.getElementById('showGuessButton').click();
-                }
-
                 document.getElementById('guessButton').disabled = true;
                 document.getElementById('panoCover').style.visibility = 'visible';
 
-                Game.showResults(data.position, null, { distance: NaN, score: 0 }, data.allResults);
+                Game.receiveResult(data.position, data.result.guessPosition, { distance: data.result.distance, score: data.result.score }, data.allResults);
             }
         },
 
@@ -253,8 +257,6 @@
 
         initialize: function () {
             document.getElementById('panoCover').style.visibility = 'visible';
-            document.getElementById('currentRound').innerHTML = '1/' + String(Game.NUMBER_OF_ROUNDS);
-            document.getElementById('currentScoreSum').innerHTML = '0/0';
 
             Game.map.setOptions({
                 draggableCursor: 'crosshair'
@@ -279,19 +281,17 @@
                 Game.panoId = this.response.place.panoId;
                 Game.pov = this.response.place.pov;
 
-                if (this.response.history) {
-                    for (var i = 0; i < this.response.history.length; ++i) {
-                        var round = this.response.history[i];
-                        Game.rounds.push({ position: round.position, guessPosition: round.result.guessPosition, realMarker: null, guessMarkers: [] });
-                        Game.addPositionToResultMap(true);
-                        Game.addGuessPositionToResultMap(round.result.guessPosition, null, true);
-                        Game.scoreSum += round.result.score;
-                    }
-
-                    document.getElementById('currentRound').innerHTML = String(Game.rounds.length) + '/' + String(Game.NUMBER_OF_ROUNDS);
-                    document.getElementById('currentScoreSum').innerHTML = String(Game.scoreSum) + '/' + String(Game.rounds.length * Game.MAX_SCORE);
+                for (var i = 0; i < this.response.history.length; ++i) {
+                    var round = this.response.history[i];
+                    Game.rounds.push({ position: round.position, guessPosition: round.result.guessPosition, realMarker: null, guessMarkers: [] });
+                    Game.addPositionToResultMap(true);
+                    Game.addGuessPositionToResultMap(round.result.guessPosition, null, true);
+                    Game.scoreSum += round.result.score;
                 }
 
+                document.getElementById('currentRound').innerHTML = String(Game.rounds.length) + '/' + String(Game.NUMBER_OF_ROUNDS);
+                document.getElementById('currentScoreSum').innerHTML = String(Game.scoreSum) + '/' + String(Game.rounds.length * Game.MAX_SCORE);
+
                 Game.startNewRound();
             });
         },
@@ -329,12 +329,16 @@
             scoreInfo.children[0].style.display = null;
             scoreInfo.children[1].style.display = null;
             document.getElementById('continueButton').style.display = null;
+            document.getElementById('showSummaryButton').style.display = null;
             document.getElementById('startNewGameButton').style.display = null;
 
             document.getElementById('showGuessButton').style.visibility = null;
             document.getElementById('guess').style.visibility = null;
             document.getElementById('guess').classList.remove('result');
 
+            // needs to be set visible after the show guess map hid it in mobile view
+            document.getElementById("navigation").style.visibility = 'visible';
+
             Game.initialize();
         },
 
@@ -359,7 +363,10 @@
             document.getElementById('panoCover').style.visibility = 'hidden';
             document.getElementById('showGuessButton').style.visibility = null;
             document.getElementById('guess').style.visibility = null;
-            document.getElementById('guess').classList.remove('result')
+            document.getElementById('guess').classList.remove('result');
+
+            // needs to be set visible after the show guess map hid it in mobile view
+            document.getElementById("navigation").style.visibility = 'visible';
 
             Game.map.setOptions({
                 draggableCursor: 'crosshair'
@@ -380,6 +387,10 @@
             document.getElementById('currentRound').innerHTML = String(Game.rounds.length) + '/' + String(Game.NUMBER_OF_ROUNDS);
 
             Game.loadPano(Game.panoId, Game.pov);
+
+            // update the compass
+            const heading = Game.panorama.getPov().heading;
+            document.getElementById("compass").style.transform = "translateY(-50%) rotate(" + heading + "deg)";
         },
 
         handleErrorResponse: function (error) {
@@ -415,18 +426,7 @@
             Game.panorama.setPano(panoId);
         },
 
-        showResults: function (position, guessPosition, result, allResults) {
-            if (Game.adaptGuess) {
-                document.getElementById('guess').classList.remove('adapt');
-            }
-
-            if (Game.guessMarker) {
-                Game.guessMarker.setMap(null);
-                Game.guessMarker = null;
-            }
-
-            document.getElementById('guess').classList.add('result');
-
+        receiveResult: function (position, guessPosition, result, allResults) {
             Game.scoreSum += result.score;
             document.getElementById('currentScoreSum').innerHTML = String(Game.scoreSum) + '/' + String(Game.rounds.length * Game.MAX_SCORE);
 
@@ -444,18 +444,58 @@
             if (allResults) {
                 for (var i = 0; i < allResults.length; ++i) {
                     var currentResult = allResults[i];
-                    Game.addGuessPositionToResultMap(currentResult.guessPosition, currentResult);
-                    resultBounds.extend(currentResult.guessPosition);
+                    if (currentResult.guessPosition) {
+                        Game.addGuessPositionToResultMap(currentResult.guessPosition, currentResult);
+                        resultBounds.extend(currentResult.guessPosition);
+                    }
                 }
             }
 
+            Game.showResultMap(result, resultBounds);
+        },
+
+        showResultFromHistory: function (result) {
+            var round = Game.rounds[Game.rounds.length - 1];
+            var resultBounds = new google.maps.LatLngBounds();
+
+            round.realMarker.setVisible(true);
+            resultBounds.extend(round.position);
+
+            for (var j = 0; j < round.guessMarkers.length; ++j) {
+                var guessMarker = round.guessMarkers[j];
+                guessMarker.marker.setVisible(true);
+                guessMarker.line.setVisible(true);
+
+                resultBounds.extend(guessMarker.marker.getPosition());
+            }
+
+            Game.showResultMap(result, resultBounds);
+        },
+
+        showResultMap: function (result, resultBounds) {
+            // TODO: refactor - it is necessary for mobile
+            if (window.getComputedStyle(document.getElementById('guess')).visibility === 'hidden') {
+                document.getElementById('showGuessButton').click();
+            }
+
+            if (Game.adaptGuess) {
+                document.getElementById('guess').classList.remove('adapt');
+            }
+
+            if (Game.guessMarker) {
+                Game.guessMarker.setMap(null);
+                Game.guessMarker = null;
+            }
+
+            document.getElementById('guess').classList.add('result');
+
             Game.map.setOptions({
                 draggableCursor: 'grab'
             });
             Game.map.fitBounds(resultBounds);
 
             var distanceInfo = document.getElementById('distanceInfo');
-            if (Number.isNaN(result.distance)) {
+            if (result.distance === null) {
                 distanceInfo.children[0].style.display = 'none';
                 distanceInfo.children[1].style.display = 'block';
             } else {
@@ -510,7 +550,7 @@
                     return;
                 }
 
-                Game.showResults(this.response.position, guessPosition, this.response.result, this.response.allResults);
+                Game.receiveResult(this.response.position, guessPosition, this.response.result, this.response.allResults);
 
                 if (this.response.place) {
                     Game.panoId = this.response.place.panoId;
@@ -712,15 +752,16 @@
                 clearInterval(Game.countdownHandler);
             }
 
+            Game.countdownElement = document.getElementById('countdown');
+            Game.countdownTimeElement = document.getElementById('countdownTime');
+
+            Game.setCountdownTime(Math.round(timeout / 1000));
+
             if (timeout <= 0) {
                 return;
             }
 
             Game.timeoutEnd = new Date(new Date().getTime() + timeout);
-            Game.countdownElement = document.getElementById('countdown');
-            Game.countdownTimeElement = document.getElementById('countdownTime');
-
-            Game.setCountdownTime(Math.round(timeout / 1000));
 
             Game.countdownHandler = setInterval(function () {
                 var timeLeft = Math.round((Game.timeoutEnd - new Date()) / 1000);
@@ -826,6 +867,9 @@
 
     Game.panorama.addListener('pov_changed', function () {
         Game.rewriteGoogleLink();
+
+        const heading = Game.panorama.getPov().heading;
+        document.getElementById("compass").style.transform = "translateY(-50%) rotate(" + heading + "deg)";
     });
 
     if (COOKIES_CONSENT) {
@@ -835,11 +879,13 @@
     document.getElementById('showGuessButton').onclick = function () {
         this.style.visibility = 'hidden';
         document.getElementById('guess').style.visibility = 'visible';
+        document.getElementById('navigation').style.visibility = 'hidden';
     }
 
     document.getElementById('closeGuessButton').onclick = function () {
         document.getElementById('showGuessButton').style.visibility = null;
         document.getElementById('guess').style.visibility = null;
+        document.getElementById('navigation').style.visibility = 'visible';
     }
 
     document.getElementById('guessButton').onclick = function () {
@@ -907,4 +953,12 @@
             }
         });
     }
+
+    document.getElementById('returnToStart').onclick = function () {
+        Game.loadPano(Game.panoId, Game.pov);
+    }
+
+    document.getElementById('compassContainer').onclick = function () {
+        Game.panorama.setPov({ heading: 0, pitch: Game.panorama.getPov().pitch });
+    }
 })();

public/static/js/map_editor.js

@@ -310,6 +310,21 @@
                 var placeId = addedPlaces[i].id;
                 places[tempId].id = placeId;
             }
+        },
+
+        // TODO: check whether marker is already existing on the map for the coordinates
+        //       or alternatively block saving for matching coordinates
+        placeMarker: function (latlng) {
+            var marker = L.marker(latlng, {
+                icon: IconCollection.iconBlue,
+                zIndexOffset: 2000
+            })
+                .addTo(MapEditor.map)
+                .on('click', function () {
+                    MapEditor.select(this);
+                });
+
+            MapEditor.select(marker);
         }
     };
 
@@ -340,6 +355,32 @@
             } else {
                 return { ppi: 72, tileSize: 512, zoomOffset: -1, minZoom: 2, maxZoom: 20 };
             }
+        },
+
+        extractCoordinates: function (coordinatesStr) {
+            var coordinates = { valid: false, latlng: { lat: 0., lng: 0. } };
+            var delimiters = [',', ' ', ';'];
+
+            coordinatesStr = coordinatesStr.trim();
+            if (coordinatesStr.length == 0) {
+                return coordinates;
+            }
+
+            for (var delimiter of delimiters) {
+                if (coordinatesStr.indexOf(delimiter) != -1) {
+
+                    var coordinatesArr = coordinatesStr.split(delimiter);
+                    coordinates.latlng.lat = parseFloat(coordinatesArr[0]);
+                    coordinates.latlng.lng = parseFloat(coordinatesArr[1]);
+
+                    if (!isNaN(coordinates.latlng.lat) && !isNaN(coordinates.latlng.lng)) {
+                        coordinates.valid = true;
+                        return coordinates;
+                    }
+                }
+            }
+
+            return coordinates;
         }
     };
 
@@ -348,16 +389,7 @@
     });
 
     MapEditor.map.on('click', function (e) {
-        var marker = L.marker(e.latlng, {
-            icon: IconCollection.iconBlue,
-            zIndexOffset: 2000
-        })
-            .addTo(MapEditor.map)
-            .on('click', function () {
-                MapEditor.select(this);
-            });
-
-        MapEditor.select(marker);
+        MapEditor.placeMarker(e.latlng);
     });
 
     var highResData = Util.getHighResData();
@@ -440,4 +472,31 @@
     document.getElementById('deleteButton').onclick = function () {
         MapEditor.deletePlace();
     };
+
+    document.getElementById('jumpButton').onclick = function (e) {
+        var coordinatesStr = document.getElementById("jumpCoordinates").value;
+        var coordinates = Util.extractCoordinates(coordinatesStr);
+
+        if (coordinates.valid) {
+            MapEditor.placeMarker(coordinates.latlng);
+        }
+    };
+
+    document.getElementById('jumpCoordinates').onkeyup = function (e) {
+        var coordinatesStr = document.getElementById("jumpCoordinates").value;
+        var coordinates = Util.extractCoordinates(coordinatesStr);
+        var jumpButton = document.getElementById("jumpButton");
+
+        if (coordinates.valid) {
+            jumpButton.disabled = false;
+
+            if (e.key == 'Enter') {
+                MapEditor.placeMarker(coordinates.latlng);
+            }
+        }
+        else {
+            jumpButton.disabled = true;
+        }
+    };
+
 })();

scripts/deploy-to-multiple-worktrees.py

@@ -59,10 +59,25 @@ def getRevisionForRef(ref):
     return subprocess.check_output(["git", "rev-list", "-1", ref], cwd=REPO).decode().strip()
 
 def getLatestReleaseTag():
-    return subprocess.check_output(["git", "for-each-ref", "refs/tags/Release*", "--count=1", "--sort=-creatordate", "--format=%(refname:short)"], cwd=REPO).decode().strip()
+    process = subprocess.Popen(["git", "for-each-ref", "refs/tags/Release*", "--sort=-creatordate", "--format=%(refname:short)"], stdout=subprocess.PIPE, cwd=REPO)
+
+    for line in process.stdout:
+        tag = line.decode().rstrip()
+
+        if isTagVerified(tag):
+            return tag
+
+        print(f"[WARNING] Tag '{tag}' is not verified, skipping.")
+
+    raise Exception("No verified 'Release*' tag found!")
+
+def isTagVerified(tag):
+    process = subprocess.run(["git", "tag", "--verify", tag], stdout=subprocess.PIPE, stderr=subprocess.STDOUT, cwd=REPO)
+
+    return process.returncode == 0
 
 def updateRepoFromRemote():
-    subprocess.call(["git", "fetch", "origin", "--prune"], cwd=REPO)
+    subprocess.call(["git", "fetch", "origin", "--prune", "--prune-tags"], cwd=REPO)
 
 def checkoutWorktree(worktreePath, ref):
     subprocess.call(["git", "checkout", "-f", ref], cwd=worktreePath)

scripts/install.sh

@@ -16,7 +16,7 @@ echo "Installing Yarn packages..."
 (cd ${ROOT_DIR}/public/static && yarn install)
 
 echo "Installing MapGuesser DB..."
-mysql --host=${DB_HOST} --user=${DB_USER} --password=${DB_PASSWORD} ${DB_NAME} < ${ROOT_DIR}/db/mapguesser.sql
+mysql --host=${DB_HOST} --user=${DB_USER} --password=${DB_PASSWORD} ${DB_NAME} < ${ROOT_DIR}/database/mapguesser.sql
 
 echo "Migrating DB..."
 (cd ${ROOT_DIR} && ./mapg db:migrate)

src/Controller/GameController.php

@@ -92,6 +92,9 @@ class GameController
                 'rounds' => [],
                 'currentRound' => -1
             ]);
+        } else { // update the area of the map in the session in any case
+            $state['area'] = $map->getArea();
+            $session->set('state', $state);
         }
 
         return new JsonContent([

src/Controller/GameFlowController.php

@@ -164,7 +164,7 @@ class GameFlowController
         $guessPosition = new Position((float) $this->request->post('lat'), (float) $this->request->post('lng'));
         $result = $this->evalueteGuess($last['position'], $guessPosition, $state['area']);
 
-        $allResults = $this->multiConnector->sendMessage('guess', [
+        $responseFromMulti = $this->multiConnector->sendMessage('guess', [
             'roomId' => $roomId,
             'token' => $multiState['token'],
             'guessPosition' => $guessPosition->toArray(),
@@ -172,10 +172,14 @@ class GameFlowController
             'score' => $result['score']
         ]);
 
+        if (isset($responseFromMulti['error'])) {
+            return new JsonContent(['error' => $responseFromMulti['error']]);
+        }
+
         $response = [
             'position' => $last['position']->toArray(),
             'result' => $result,
-            'allResults' => $allResults
+            'allResults' => $responseFromMulti['allResults']
         ];
 
         return new JsonContent($response);

src/Multi/MultiConnector.php

@@ -17,10 +17,6 @@ class MultiConnector
         }
         fclose($connection);
 
-        $response = json_decode($response, true);
-
-        if (isset($response['data'])) {
-            return $response['data'];
-        }
+        return json_decode($response, true);
     }
 }

views/admin/map_editor.php

@@ -10,8 +10,12 @@
 
 @extends(templates/layout_full)
 
-@section(subheader)
+@section(subheader) 
            <span><a href="javascript:;" id="mapName" title="Edit map data"><?= $mapName ?></a></span><!--
+        --><span>
+               <input type="text" id="jumpCoordinates" placeholder="Insert coordinates here" />
+               <button id="jumpButton" disabled >Jump</button>
+           </span><!--
         --><span><!--
             <?php /* Copyright (c) 2019 The Bootstrap Authors. License can be found in 'USED_SOFTWARE' in section 'Bootstrap Icons'. */ ?>
             --><svg class="inline" width="1em" height="1em" viewBox="0 0 16 16" fill="currentColor" xmlns="http://www.w3.org/2000/svg">

views/game.php

@@ -59,6 +59,24 @@
             <button id="startNewGameButton" class="fullWidth">Play this map again</button>
         </div>
     </div>
+    <div id="navigation">
+        <div id="compassContainer" class="navigationItem">
+            <div>
+                <img src="<?= $_ENV['STATIC_ROOT'] ?>/img/circle_background.svg?rev=<?= REVISION ?>" alt="Circle Background" class="circleBackground" />
+            </div>
+            <div>
+                <img id="compass" src="<?= $_ENV['STATIC_ROOT'] ?>/img/compass.svg?rev=<?= REVISION ?>" alt="compass icon" class="navigationIcon" />
+            </div>
+        </div>
+        <div id="returnToStart" class="navigationItem">
+            <div>
+                <img src="<?= $_ENV['STATIC_ROOT'] ?>/img/circle_background.svg?rev=<?= REVISION ?>" alt="Circle Background" class="circleBackground" />
+            </div>
+            <div>
+                <img src="<?= $_ENV['STATIC_ROOT'] ?>/img/house-fill.svg?rev=<?= REVISION ?>" alt="Return to Start icon" class="navigationIcon" />
+            </div>
+        </div>
+    </div>
 @endsection
 
 @section(pageScript)

views/templates/layout_normal.php

@@ -29,6 +29,6 @@
 </main>
 <footer>
     <p><span class="bold"><?= $_ENV['APP_NAME'] ?></span> <?= str_replace('Release_', '', VERSION) ?></p><!--
- --><p>&copy; Pőcze Bence <?= (new DateTime(REVISION_DATE))->format('Y') ?></p>
+ --><p>&copy; The MapGuesser Contributors <?= (new DateTime(REVISION_DATE))->format('Y') ?></p>
 </footer>
 @endsection