From f7d37b85138ff4bb32d4c6d0645abc4b20a85ddb Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?P=C5=91cze=20Bence?= <bence@pocze.ch>
Date: Mon, 1 Jun 2020 20:41:46 +0200
Subject: [PATCH] MAPG-97 add and use new markers

---
 public/static/img/markers/marker-blue.svg     | 16 +++++++++
 .../static/img/markers/marker-gray-empty.svg  | 10 ++++++
 public/static/img/markers/marker-gray.svg     | 16 +++++++++
 .../static/img/markers/marker-green-empty.svg | 10 ++++++
 public/static/img/markers/marker-green.svg    | 16 +++++++++
 public/static/img/markers/marker-red.svg      | 16 +++++++++
 public/static/js/game.js                      | 35 ++++++++++++++++---
 7 files changed, 115 insertions(+), 4 deletions(-)
 create mode 100644 public/static/img/markers/marker-blue.svg
 create mode 100644 public/static/img/markers/marker-gray-empty.svg
 create mode 100644 public/static/img/markers/marker-gray.svg
 create mode 100644 public/static/img/markers/marker-green-empty.svg
 create mode 100644 public/static/img/markers/marker-green.svg
 create mode 100644 public/static/img/markers/marker-red.svg

diff --git a/public/static/img/markers/marker-blue.svg b/public/static/img/markers/marker-blue.svg
new file mode 100644
index 0000000..d49029e
--- /dev/null
+++ b/public/static/img/markers/marker-blue.svg
@@ -0,0 +1,16 @@
+<!-- Original image: Copyright (c) 2019 The Bootstrap Authors. License can be found in 'USED_SOFTWARE' in section 'Bootstrap Icons'. -->
+<svg viewBox="0 0 12 16" xmlns="http://www.w3.org/2000/svg">
+    <path
+        fill="#3183ce"
+        fill-rule="evenodd"
+        stroke="#19456d"
+        stroke-width="0.3"
+        stroke-linecap="round"
+        d="m 5.9999998,15.849652 c 0,0 5.8511182,-5.579947 5.8511182,-9.8134832 a 5.8511179,5.8880898 0 0 0 -11.7022358,0 c 0,4.2335362 5.8511176,9.8134832 5.8511176,9.8134832" />
+    <circle
+        fill="#19456d"
+        fill-rule="evenodd"
+        cx="6"
+        cy="6"
+        r="3" />
+</svg>
diff --git a/public/static/img/markers/marker-gray-empty.svg b/public/static/img/markers/marker-gray-empty.svg
new file mode 100644
index 0000000..8a3d446
--- /dev/null
+++ b/public/static/img/markers/marker-gray-empty.svg
@@ -0,0 +1,10 @@
+<!-- Original image: Copyright (c) 2019 The Bootstrap Authors. License can be found in 'USED_SOFTWARE' in section 'Bootstrap Icons'. -->
+<svg viewBox="0 0 12 16" xmlns="http://www.w3.org/2000/svg">
+    <path
+        fill="#828282"
+        fill-rule="evenodd"
+        stroke="#383838"
+        stroke-width="0.3"
+        stroke-linecap="round"
+        d="m 5.9999998,15.849652 c 0,0 5.8511182,-5.579947 5.8511182,-9.8134832 a 5.8511179,5.8880898 0 0 0 -11.7022358,0 c 0,4.2335362 5.8511176,9.8134832 5.8511176,9.8134832" />
+</svg>
diff --git a/public/static/img/markers/marker-gray.svg b/public/static/img/markers/marker-gray.svg
new file mode 100644
index 0000000..780715f
--- /dev/null
+++ b/public/static/img/markers/marker-gray.svg
@@ -0,0 +1,16 @@
+<!-- Original image: Copyright (c) 2019 The Bootstrap Authors. License can be found in 'USED_SOFTWARE' in section 'Bootstrap Icons'. -->
+<svg viewBox="0 0 12 16" xmlns="http://www.w3.org/2000/svg">
+    <path
+        fill="#828282"
+        fill-rule="evenodd"
+        stroke="#383838"
+        stroke-width="0.3"
+        stroke-linecap="round"
+        d="m 5.9999998,15.849652 c 0,0 5.8511182,-5.579947 5.8511182,-9.8134832 a 5.8511179,5.8880898 0 0 0 -11.7022358,0 c 0,4.2335362 5.8511176,9.8134832 5.8511176,9.8134832" />
+    <circle
+        fill="#383838"
+        fill-rule="evenodd"
+        cx="6"
+        cy="6"
+        r="3" />
+</svg>
diff --git a/public/static/img/markers/marker-green-empty.svg b/public/static/img/markers/marker-green-empty.svg
new file mode 100644
index 0000000..ed948fd
--- /dev/null
+++ b/public/static/img/markers/marker-green-empty.svg
@@ -0,0 +1,10 @@
+<!-- Original image: Copyright (c) 2019 The Bootstrap Authors. License can be found in 'USED_SOFTWARE' in section 'Bootstrap Icons'. -->
+<svg viewBox="0 0 12 16" xmlns="http://www.w3.org/2000/svg">
+    <path
+        fill="#28a745"
+        fill-rule="evenodd"
+        stroke="#285624"
+        stroke-width="0.3"
+        stroke-linecap="round"
+        d="m 5.9999998,15.849652 c 0,0 5.8511182,-5.579947 5.8511182,-9.8134832 a 5.8511179,5.8880898 0 0 0 -11.7022358,0 c 0,4.2335362 5.8511176,9.8134832 5.8511176,9.8134832" />
+</svg>
diff --git a/public/static/img/markers/marker-green.svg b/public/static/img/markers/marker-green.svg
new file mode 100644
index 0000000..bb90e28
--- /dev/null
+++ b/public/static/img/markers/marker-green.svg
@@ -0,0 +1,16 @@
+<!-- Original image: Copyright (c) 2019 The Bootstrap Authors. License can be found in 'USED_SOFTWARE' in section 'Bootstrap Icons'. -->
+<svg viewBox="0 0 12 16" xmlns="http://www.w3.org/2000/svg">
+    <path
+        fill="#28a745"
+        fill-rule="evenodd"
+        stroke="#285624"
+        stroke-width="0.3"
+        stroke-linecap="round"
+        d="m 5.9999998,15.849652 c 0,0 5.8511182,-5.579947 5.8511182,-9.8134832 a 5.8511179,5.8880898 0 0 0 -11.7022358,0 c 0,4.2335362 5.8511176,9.8134832 5.8511176,9.8134832" />
+    <circle
+        fill="#285624"
+        fill-rule="evenodd"
+        cx="6"
+        cy="6"
+        r="3" />
+</svg>
diff --git a/public/static/img/markers/marker-red.svg b/public/static/img/markers/marker-red.svg
new file mode 100644
index 0000000..fb20dbf
--- /dev/null
+++ b/public/static/img/markers/marker-red.svg
@@ -0,0 +1,16 @@
+<!-- Original image: Copyright (c) 2019 The Bootstrap Authors. License can be found in 'USED_SOFTWARE' in section 'Bootstrap Icons'. -->
+<svg viewBox="0 0 12 16" xmlns="http://www.w3.org/2000/svg">
+    <path
+        fill="#d24d4d"
+        fill-rule="evenodd"
+        stroke="#752929"
+        stroke-width="0.3"
+        stroke-linecap="round"
+        d="m 5.9999998,15.849652 c 0,0 5.8511182,-5.579947 5.8511182,-9.8134832 a 5.8511179,5.8880898 0 0 0 -11.7022358,0 c 0,4.2335362 5.8511176,9.8134832 5.8511176,9.8134832" />
+    <circle
+        fill="#752929"
+        fill-rule="evenodd"
+        cx="6"
+        cy="6"
+        r="3" />
+</svg>
diff --git a/public/static/js/game.js b/public/static/js/game.js
index 00f0489..e302a86 100644
--- a/public/static/js/game.js
+++ b/public/static/js/game.js
@@ -222,7 +222,13 @@
                 title: 'Open in Google Maps',
                 zIndex: Core.rounds.length * 2,
                 clickable: true,
-                draggable: false
+                draggable: false,
+                icon: {
+                    url: '/static/img/markers/marker-green.svg',
+                    size: new google.maps.Size(24, 32),
+                    scaledSize: new google.maps.Size(24, 32),
+                    anchor: new google.maps.Point(12, 32)
+                },
             });
 
             round.realMarker.addListener('click', function () {
@@ -236,10 +242,17 @@
                 zIndex: Core.rounds.length,
                 clickable: false,
                 draggable: false,
+                icon: {
+                    url: '/static/img/markers/marker-gray-empty.svg',
+                    size: new google.maps.Size(24, 32),
+                    scaledSize: new google.maps.Size(24, 32),
+                    anchor: new google.maps.Point(12, 32),
+                    labelOrigin: new google.maps.Point(12, 14)
+                },
                 label: {
                     color: '#ffffff',
                     fontFamily: 'Roboto',
-                    fontSize: '18px',
+                    fontSize: '16px',
                     fontWeight: '500',
                     text: '?'
                 }
@@ -300,8 +313,15 @@
             for (var i = 0; i < Core.rounds.length; ++i) {
                 var round = Core.rounds[i];
 
+                round.realMarker.setIcon({
+                    url: '/static/img/markers/marker-green-empty.svg',
+                    size: new google.maps.Size(24, 32),
+                    scaledSize: new google.maps.Size(24, 32),
+                    anchor: new google.maps.Point(12, 32),
+                    labelOrigin: new google.maps.Point(12, 14)
+                });
                 round.realMarker.setLabel({
-                    color: '#812519',
+                    color: '#285624',
                     fontFamily: 'Roboto',
                     fontSize: '16px',
                     fontWeight: '500',
@@ -385,10 +405,17 @@
             position: e.latLng,
             clickable: false,
             draggable: true,
+            icon: {
+                url: '/static/img/markers/marker-gray-empty.svg',
+                size: new google.maps.Size(24, 32),
+                scaledSize: new google.maps.Size(24, 32),
+                anchor: new google.maps.Point(12, 32),
+                labelOrigin: new google.maps.Point(12, 14)
+            },
             label: {
                 color: '#ffffff',
                 fontFamily: 'Roboto',
-                fontSize: '18px',
+                fontSize: '16px',
                 fontWeight: '500',
                 text: '?'
             }