Add exsisting markers to addObjective, fix map zooming on all pages

app/main/routes.py

@@ -6,7 +6,7 @@ from werkzeug.security import safe_join
 from app import db
 from app.main import bp
 from app.utils import get_game_if_owner, get_caught_bunny_photo_directory, get_bunny_photo_filename
-from app.models import User, Game, Role, GamePlayer, ObjectiveMinimalEncoder, LocationEncoder, \
+from app.models import User, Game, Role, GamePlayer, ObjectiveEncoder, LocationEncoder, \
                        PlayerCaughtPlayer, Review, Location
 
 @bp.before_app_request
@@ -30,7 +30,7 @@ def game_dashboard(game_name):
     role = current_user.role_in_game(game)
     if role == Role.owner:
         return render_template('game_owner_dashboard.html', title='Game Dashboard', game=game,
-                               json=json, objective_encoder=ObjectiveMinimalEncoder,
+                               json=json, objective_encoder=ObjectiveEncoder,
                                location_encoder=LocationEncoder)
     if role == Role.bunny:
         return render_template('game_bunny_dashboard.html', title='Game Dashboard', game=game,

app/main/routes_objective.py

@@ -1,10 +1,12 @@
+import json
+
 from flask import render_template, flash, redirect, url_for, abort
 from flask_login import current_user, login_required
 
 from app import db
 from app.main import bp
 from app.utils import generate_qr_code, serve_pil_image, get_game_if_owner
-from app.models import Objective, Role
+from app.models import Objective, Role, ObjectiveEncoder
 from app.main.forms import ObjectiveForm
 
 @bp.route('/game/<game_name>/add_objective', methods=['GET', 'POST'])
@@ -14,14 +16,16 @@ def add_objective(game_name):
     form = ObjectiveForm()
     _objective = Objective(name='', latitude=52.0932, longitude=5.12405)
     if form.validate_on_submit():
-        _objective = Objective(name=form.objective_name.data, longitude=form.longitude.data, latitude=form.latitude.data)
+        _objective = Objective(name=form.objective_name.data, longitude=form.longitude.data,
+                               latitude=form.latitude.data)
         _objective.set_hash()
         game.objectives.append(_objective)
         db.session.commit()
         flash("Objective has been added!")
         return redirect(url_for('main.game_dashboard', game_name=game.name))
     return render_template('objective.html', title=f'Add Objective for {game_name}',
-                           form=form, objective=_objective, owner=True)
+                           form=form, game=game, objective=_objective, owner=True, json=json,
+                           objective_encoder=ObjectiveEncoder)
 
 @bp.route('/objective/<objective_hash>/delete', methods=['GET'])
 @login_required
@@ -40,7 +44,8 @@ def objective_qrcode(objective_hash):
     _objective = Objective.query.filter_by(hash=objective_hash).first_or_404()
     if not _objective.owned_by(current_user):
         abort(403)
-    img = generate_qr_code(url_for('main.objective', objective_hash=_objective.hash, _external=True))
+    img = generate_qr_code(url_for('main.objective', objective_hash=_objective.hash,
+                                   _external=True))
     return serve_pil_image(img)
 
 @bp.route('/objective/<objective_hash>', methods=['GET', 'POST'])
@@ -49,7 +54,8 @@ def objective(objective_hash):
     _objective = Objective.query.filter_by(hash=objective_hash).first_or_404()
     if current_user.role_in_game(_objective.game) == Role.bunny:
         if not _objective.game.is_active():
-            flash("Its not find an objective before or after a game, or if the game is not in 'active' mode.")
+            flash("It's not possible to find an objective before or after a game, "
+                  "or if the game is not in 'active' mode.")
             return redirect(url_for('main.game_dashboard', game_name=_objective.game.name))
         player = current_user.player_in(_objective.game)
         if not _objective in player.found_objectives:
@@ -78,4 +84,5 @@ def objective(objective_hash):
         db.session.commit()
         return redirect(url_for('main.game_dashboard', game_name=_objective.game.name))
     return render_template('objective.html', title='Objective view',
-                           objective=_objective, owner=True, form=form, qrcode=qrcode)
+                           form=form, game=_objective.game, objective=_objective, owner=True,
+                           qrcode=qrcode, json=json, objective_encoder=ObjectiveEncoder)

app/main/tests/test_routes.py

@@ -1,7 +1,7 @@
 
 import unittest
 from app import create_app, db
-from app.models import User, Game, Role, GamePlayer, Objective, ObjectiveMinimalEncoder, LocationEncoder
+from app.models import User, Game, Role, GamePlayer, Objective, ObjectiveEncoder, LocationEncoder
 import app.main.routes as routes
 from config import Config
 

app/models/__init__.py

@@ -4,7 +4,7 @@ from .game_state import GameState
 from .location import Location, LocationEncoder
 from .notification import Notification
 from .notification_player import NotificationPlayer
-from .objective import Objective, ObjectiveMinimalEncoder
+from .objective import Objective, ObjectiveEncoder
 from .player_caught_player import PlayerCaughtPlayer
 from .player_found_objective import PlayerFoundObjective
 from .review import Review

app/models/objective.py

@@ -29,7 +29,7 @@ class Objective(db.Model):
         '''Returns True if given user is an owner of a game object is part of'''
         return user in [gameplayer.user for gameplayer in self.game.players if gameplayer.role == Role.owner]
 
-class ObjectiveMinimalEncoder(JSONEncoder):
+class ObjectiveEncoder(JSONEncoder):
     def default(self, objective):
         return {
             'name' : objective.name,

app/static/assets/leaflet/utils.js

@@ -1,3 +1,12 @@
+var greyIcon = new L.Icon({
+    iconUrl: '/static/assets/leaflet/images/marker-icon-2x-grey.png',
+    shadowUrl: '/static/assets/leaflet/images/marker-shadow.png',
+    iconSize: [25, 41],
+    iconAnchor: [12, 41],
+    popupAnchor: [1, -34],
+    shadowSize: [41, 41]
+});
+
 var greenIcon = new L.Icon({
     iconUrl: '/static/assets/leaflet/images/marker-icon-2x-green.png',
     shadowUrl: '/static/assets/leaflet/images/marker-shadow.png',
@@ -43,11 +52,11 @@ var greenPlayerIcon = new L.Icon({
     shadowSize: [41, 41]
 });
 
-function addObjectiveMarker(map, objective){
+function addObjectiveMarker(map, objective, icon=greenIcon){
     var objectiveMarker = L.marker([
         objective['latitude'],
         objective['longitude']
-    ], {icon: greenIcon})
+    ], {icon: icon})
     if(objective['found']){
         objectiveMarker.setIcon(goldIcon)
     }

app/templates/game_bunny_dashboard.html

@@ -63,8 +63,7 @@
     markers = []
     var objectives = JSON.parse('{{ current_user.player_in(game).encode_objectives() |safe }}')
     for (var i = 0; i < objectives.length; i++){
-        addObjectiveMarker(map, objectives[i])
+        markers.push(addObjectiveMarker(map, objectives[i]))
-        markers.push([objectives[i].latitude, objectives[i].longitude])
     }
     
     function updateSelf() {
@@ -73,8 +72,10 @@
     setInterval(updateSelf, 10 * 1000);
     updateSelf()
 
-    if (markers.length > 0) {
+    if (markers.length > 1) {
-        map.fitBounds(markers);
+        map.fitBounds(markers.map(m => m.getLatLng()));
+    } else if (markers.length == 1){
+        map.setView(markers[0].getLatLng(), 10);
     }
 
 </script>

app/templates/game_hunter_dashboard.html

@@ -88,7 +88,9 @@
     updateBunnieMarkers()
     
     if (bunnieMarkers.length > 1) {
-        map.fitBounds(bunnieMarkers);
+        map.fitBounds(bunnieMarkers.map(m => m.getLatLng()));
+    } else if (bunnieMarkers.length == 1){
+        map.setView(bunnieMarkers[0].getLatLng(), 10);
     }
 
     function updateBunnieMarkers(){

app/templates/game_owner_dashboard.html

@@ -106,21 +106,20 @@
 <script type="text/javascript", crossorigin="anonymous">
     // Leaflet Map
     var map = getMap()
-    var objectMarkers = []
+    var objectiveMarkers = []
     var playerMarkers = []
     
     var objectives = JSON.parse('{{ json.dumps(game.objectives, cls=objective_encoder)|safe }}')
 
     for (var i = 0; i < objectives.length; i++){
-        addObjectiveMarker(map, objectives[i])
+        objectiveMarkers.push(addObjectiveMarker(map, objectives[i]))
-        objectMarkers.push([objectives[i].latitude, objectives[i].longitude])
     }
 
     var players = JSON.parse('{{ json.dumps(game.last_player_locations(), cls=location_encoder)|safe }}')
     updatePlayerMarkers()
 
-    if (objectMarkers.length + playerMarkers.length > 0) {
+    if (objectiveMarkers.length + playerMarkers.length > 1) {
-        map.fitBounds(objectMarkers.concat(playerMarkers));
+        map.fitBounds(objectiveMarkers.concat(playerMarkers).map(m => m.getLatLng()));
     }
 
     getPosition(updateMyLocation);

app/templates/objective.html

@@ -66,6 +66,17 @@
     // Leaflet Map
     map = getMap()
 
+    var otherObjectiveMarkers = []
+    
+    var otherObjectives = JSON.parse('{{ json.dumps(game.objectives, cls=objective_encoder)|safe }}')
+
+    for (var i = 0; i < otherObjectives.length; i++){
+        objective = otherObjectives[i]
+        if(objective.hash == '{{ objective.hash }}'){continue;}
+        
+        otherObjectiveMarkers.push(addObjectiveMarker(map, objective, greyIcon))
+    }
+
     if ('{{ owner }}' == 'True'){
         var objectiveMarker = L.marker([
         $("#latitude")[0].value,
@@ -81,8 +92,11 @@
     }
     objectiveMarker.addTo(map);
 
-    map.setView(objectiveMarker._latlng, 10);
+    if (otherObjectiveMarkers.length + 1 > 0) {
-    
+        map.fitBounds(otherObjectiveMarkers.concat([objectiveMarker]).map(m => m.getLatLng()));
+    } else{
+        map.setView(objectiveMarker.getLatLng(), 10);
+    }
 
     var round = function(value){
         return (Math.round(value * 100000) / 100000).toFixed(5);