diff --git a/frontend/src/Metamaps/Listeners.js b/frontend/src/Metamaps/Listeners.js index a5dc630f..363ec48b 100644 --- a/frontend/src/Metamaps/Listeners.js +++ b/frontend/src/Metamaps/Listeners.js @@ -141,7 +141,7 @@ const Listeners = { }) $(window).resize(function() { if (Visualize && Visualize.mGraph) { - Util.resizeCanvas(Visualize.mGraph.canvas) + Util.resizeCanvas(Visualize.mGraph.canvas, $) } if (Active.Map && Realtime.inConversation) Realtime.positionVideos() diff --git a/frontend/src/Metamaps/Util.js b/frontend/src/Metamaps/Util.js index 4a53fc7c..1ffdeb23 100644 --- a/frontend/src/Metamaps/Util.js +++ b/frontend/src/Metamaps/Util.js @@ -158,7 +158,7 @@ const Util = { centreCoords: Util.pixelsToCoords(fakeMgraph, { x: canvas.canvases[0].size.width / 2, y: canvas.canvases[0].size.height / 2 }) } }, - resizeCanvas: function(canvas) { + resizeCanvas: function(canvas, $ = window.$) { // Store the current canvas attributes, i.e. scale and map-coordinate at the centre of the user's screen const oldAttr = Util.logCanvasAttributes(canvas) diff --git a/frontend/test/Metamaps/Util.spec.js b/frontend/test/Metamaps/Util.spec.js index 3866a1ea..c35b6606 100644 --- a/frontend/test/Metamaps/Util.spec.js +++ b/frontend/test/Metamaps/Util.spec.js @@ -275,6 +275,34 @@ describe('Metamaps.Util.js', function() { }) }) describe('resizeCanvas', function() { - it.skip('TODO') + it('resizes, scales, and translates canvas', function() { + const oldAttr = { + scaleX: 1, + scaleY: 2, + centreCoords: { x: 3, y: 4 } + } + const newAttr = { + centreCoords: { x: 5, y: 6 } + } + const canvas = { + resize: sinon.spy(), + scale: sinon.spy(), + translate: sinon.spy() + } + sinon.stub(Util, 'logCanvasAttributes').withArgs(canvas) + .onFirstCall().returns(oldAttr) + .onSecondCall().returns(newAttr) + const jQueryStub = sinon.stub().returns({ + width: () => 7, + height: () => 8 + }) + + Util.resizeCanvas(canvas, jQueryStub) + + expect(canvas.resize.calledWith(7, 8)).to.equal(true) + expect(canvas.scale.calledWith(1, 2)) + .to.equal(true) + expect(canvas.scale.calledWith(5 - 3, 6 - 4)).to.equal(true) + }) }) })