enable specifying scale/translate in query params for a map

e.g. https://metamaps.cc/maps/12?scale=0.5&translate=-350,300

frontend/src/Metamaps/Util.js

@@ -172,7 +172,7 @@ const Util = {
     canvas.resize($(window).width(), $(window).height())
 
     // Return the map to the original scale, and then put the previous central map-coordinate back to the centre of user's newly resized screen
-    canvas.scale(oldAttr.scaleX, oldAttr.scaleY)
+    canvas.scale(oldAttr.scaleX, oldAttr.scaleY) // should be equal
     const newAttr = Util.logCanvasAttributes(canvas)
     canvas.translate(newAttr.centreCoords.x - oldAttr.centreCoords.x, newAttr.centreCoords.y - oldAttr.centreCoords.y)
   },
@@ -229,6 +229,13 @@ const Util = {
 
       // Translate the canvas to put the pointer back over top the same coordinate it was over before
     graph.canvas.translate(newX - pointerCoordX, newY - pointerCoordY)
+  },
+  queryParams: function() {
+    return window.location.search.replace(/(^\?)/, '').split('&').reduce((obj, item) => {
+      item = item.split('=')
+      obj[item[0]] = item[1]
+      return obj
+    }, {})
   }
 }
 

frontend/src/Metamaps/Visualize.js

@@ -9,6 +9,7 @@ import DataModel from './DataModel'
 import JIT from './JIT'
 import Loading from './Loading'
 import TopicCard from './Views/TopicCard'
+import Util from './Util'
 
 const Visualize = {
   mGraph: null, // a reference to the graph object.
@@ -148,6 +149,16 @@ const Visualize = {
       self.mGraph.graph.empty()
     }
 
+    const queryParams = Util.queryParams()
+    if (typeof queryParams.scale === 'string') {
+      const scale = parseFloat(queryParams.scale) || 0
+      self.mGraph.canvas.scale(scale, scale)
+    }
+    if (typeof queryParams.translate === 'string') {
+      const [x, y] = queryParams.translate.split(',').map(n => parseFloat(n) || 0)
+      self.mGraph.canvas.translate(x, y)
+    }
+
     function runAnimation() {
       Loading.hide()
       // load JSON data, if it's not empty

frontend/src/patched/JIT.js

@@ -2581,10 +2581,7 @@ Extras.Classes.Navigation = new Class({
     
     // START METAMAPS CODE
     if (Metamaps.Mouse.didPan) Metamaps.JIT.SmoothPanning();
-    
-    
     // END METAMAPS CODE
-    
   },
   
   // START METAMAPS CODE

frontend/test/Metamaps/Util.spec.js

@@ -129,4 +129,7 @@ describe('Metamaps.Util.js', function() {
   describe('resizeCanvas', function() {
     it.skip('TODO need a canvas')
   })
+  describe('queryParams', function() {
+    it.skip('TODO need window')
+  })
 })