From 54c8659368763755268dc45313cdfb24afbdd001 Mon Sep 17 00:00:00 2001
From: Ronnie Friman <L4168@student.jamk.fi>
Date: Tue, 16 Jul 2019 19:55:03 +0300
Subject: [PATCH] shows icons based on group class

---
 src/components/ReplayMap.js                   | 15 +++---
 .../src/leaflet.trackplayback/draw.js         | 48 +++++++++++--------
 2 files changed, 36 insertions(+), 27 deletions(-)

diff --git a/src/components/ReplayMap.js b/src/components/ReplayMap.js
index 213652d..b0b0816 100644
--- a/src/components/ReplayMap.js
+++ b/src/components/ReplayMap.js
@@ -27,20 +27,22 @@ export default class ReplayMap extends React.Component {
 
   async componentDidMount() {
     await this.fetchPlayerData();
-    await this.fetchDrawingData();
-    this.tickDrawings();
+    //await this.fetchDrawingData();
+    //this.tickDrawings();
     this.replay();
   }
 
   componentWillReceiveProps(nextProps) {}
 
   // cloud game a1231e2b-aa29-494d-b687-ea2d48cc23df
+  // local game wimma 15e9563b-e621-4ba1-a440-1b21c7774923
+  // local game vbox 16977b13-c419-48b4-b7d6-e7620f27bf39
   // fetch player locations from the game
   fetchPlayerData = async () => {
     await fetch(
       `${
         process.env.REACT_APP_API_URL
-      }/replay/players/15e9563b-e621-4ba1-a440-1b21c7774923`,
+      }/replay/players/16977b13-c419-48b4-b7d6-e7620f27bf39`,
       {
         method: "GET"
       }
@@ -61,9 +63,10 @@ export default class ReplayMap extends React.Component {
 
   fetchDrawingData = async () => {
     await fetch(
-      `${
-        process.env.REACT_APP_API_URL
-      }/replay/a1231e2b-aa29-494d-b687-ea2d48cc23df`,
+      `${process.env.REACT_APP_API_URL}/replay/{
+		"lng": 25.72588,
+		"lat": 62.23147
+}`,
       {
         method: "GET"
       }
diff --git a/src/track-playback/src/leaflet.trackplayback/draw.js b/src/track-playback/src/leaflet.trackplayback/draw.js
index 302df5f..f5e94e9 100644
--- a/src/track-playback/src/leaflet.trackplayback/draw.js
+++ b/src/track-playback/src/leaflet.trackplayback/draw.js
@@ -67,23 +67,15 @@ export const Draw = L.Class.extend({
 
     // 目标如果使用图片，先加载图片
     if (this.targetOptions.useImg) {
-      let img = new Image();
-      let img2 = new Image();
-      img2.onload = () => {
-        this._targetImg2 = img2;
-      };
-      img2.onerror = () => {
-        throw new Error("img load error!");
-      };
-      img2.src = this.targetOptions.imgUrl;
-
-      img.onload = () => {
-        this._targetImg = img;
-      };
-      img.onerror = () => {
-        throw new Error("img load error!");
-      };
-      img.src = this.targetOptions.imgUrl;
+      /*       let img2 = new Image();
+            img2.onload = () => {
+              this._targetImg2 = img2;
+            };
+            img2.onerror = () => {
+              throw new Error("img load error!");
+            };
+            img2.src = this.targetOptions.imgUrl; */
+      this._targetImg = [];
     }
   },
 
@@ -312,11 +304,25 @@ export const Draw = L.Class.extend({
     };
     this._ctx.save();
     this._ctx.translate(point.x, point.y);
-
+    let image;
+    this._targetImg.map(img => {
+      if (img.icon == info[0]["value"]) {
+        image = img;
+      }
+    });
+    if (!image) {
+      let img = new Image();
+      img.onload = () => {
+        this._targetImg.push(img);
+      };
+      img.onerror = () => {
+        throw new Error("img load error!");
+      };
+      img.src = info[0]["value"];
+      img.icon = info[0]["value"];
+      image = img;
+    }
     //let svg = document.createElementNS(`../${info[0]["value"]}`, "svg"); //http://www.sclance.com/pngs/random-png/random_png_1136179.png
-    let image =
-      info[0]["value"] === "infantry.svg" ? this._targetImg : this._targetImg2;
-    image.src = `../${info[0]["value"]}`;
     this._ctx.drawImage(image, 0 - offset.x, 0 - offset.y, width, height);
     this._ctx.restore();
   },
-- 
GitLab