panzoom - npm Package Compare versions

Comparing version 1.2.3 to 1.2.4

dist/panzoom.js

@@ -14,3 +14,3 @@ (function(f){if(typeof exports==="object"&&typeof module!=="undefined"){module.exports=f()}else if(typeof define==="function"&&define.amd){define([],f)}else{var g;if(typeof window!=="undefined"){g=window}else if(typeof global!=="undefined"){g=global}else if(typeof self!=="undefined"){g=self}else{g=this}g.panzoom = f()}})(function(){var define,module,exports;return (function e(t,n,r){function s(o,u){if(!n[o]){if(!t[o]){var a=typeof require=="function"&&require;if(!u&&a)return a(o,!0);if(i)return i(o,!0);var f=new Error("Cannot find module '"+o+"'");throw f.code="MODULE_NOT_FOUND",f}var l=n[o]={exports:{}};t[o][0].call(l.exports,function(e){var n=t[o][1][e];return s(n?n:e)},l,l.exports,e,t,n,r)}return n[o].exports}var i=typeof require=="function"&&require;for(var o=0;o<r.length;o++)s(r[o]);return s})({1:[function(require,module,exports){
 
-var speed = 0.065
+var defaultZoomSpeed = 0.065
 
@@ -37,2 +37,3 @@ module.exports = createPanZoom;
   var beforeWheel = options.beforeWheel || noop
+  var speed = typeof options.zoomSpeed === 'number' ? options.zoomSpeed : defaultZoomSpeed
 
@@ -57,2 +58,4 @@ var touchInProgress = false
 
+  var multitouch
+
   listenForEvents()
@@ -63,3 +66,4 @@
     moveBy: internalMoveBy,
-    centerOn: centerOn
+    centerOn: centerOn,
+    zoomTo: publicZoomTo
   }
@@ -135,3 +139,5 @@
 
-      pinchZoomLength = getPinchZoomLength(e.touches[1], e.touches[1])
+      pinchZoomLength = getPinchZoomLength(e.touches[0], e.touches[1])
+      multitouch  = true;
+      startTouchListenerIfNeeded()
     }
@@ -148,2 +154,6 @@ }
 
+    startTouchListenerIfNeeded()
+  }
+
+  function startTouchListenerIfNeeded() {
     if (!touchInProgress) {
@@ -172,2 +182,3 @@ touchInProgress = true
       // it's a zoom, let's find direction
+      multitouch = true;
       var t1 = e.touches[0]
@@ -273,6 +284,7 @@ var t2 = e.touches[1]
   function releaseTouches() {
-    document.removeEventListener('touchmove', handleTouchMove);
-    document.removeEventListener('touchend', handleTouchEnd);
-    document.removeEventListener('touchcancel', handleTouchEnd);
+    document.removeEventListener('touchmove', handleTouchMove)
+    document.removeEventListener('touchend', handleTouchEnd)
+    document.removeEventListener('touchcancel', handleTouchEnd)
     panstartFired = false
+    multitouch = false
   }
@@ -294,2 +306,6 @@
 
+  function publicZoomTo(clientX, clientY, scaleMultiplier) {
+      zoomTo(svgElement, clientX, clientY, scaleMultiplier)
+  }
+
   function getScaleMultiplier(delta) {
@@ -316,3 +332,4 @@ var scaleMultiplier = 1
     if (panstartFired) {
-      smoothScroll.stop()
+      // we should never run smooth scrolling if it was multitouch (pinch zoom animation):
+      if (!multitouch) smoothScroll.stop()
       triggerEvent('panend')
@@ -319,0 +336,0 @@ }

dist/panzoom.min.js

@@ -1,1 +0,1 @@
-(function(f){if(typeof exports==="object"&&typeof module!=="undefined"){module.exports=f()}else if(typeof define==="function"&&define.amd){define([],f)}else{var g;if(typeof window!=="undefined"){g=window}else if(typeof global!=="undefined"){g=global}else if(typeof self!=="undefined"){g=self}else{g=this}g.panzoom=f()}})(function(){var define,module,exports;return function e(t,n,r){function s(o,u){if(!n[o]){if(!t[o]){var a=typeof require=="function"&&require;if(!u&&a)return a(o,!0);if(i)return i(o,!0);var f=new Error("Cannot find module '"+o+"'");throw f.code="MODULE_NOT_FOUND",f}var l=n[o]={exports:{}};t[o][0].call(l.exports,function(e){var n=t[o][1][e];return s(n?n:e)},l,l.exports,e,t,n,r)}return n[o].exports}var i=typeof require=="function"&&require;for(var o=0;o<r.length;o++)s(r[o]);return s}({1:[function(require,module,exports){var wheel=require("wheel");var animate=require("amator");var zoomTo=require("./lib/zoomTo.js");var kinetic=require("./lib/kinetic.js");var moveBy=require("./lib/moveBy.js");var moveTo=require("./lib/moveTo.js");var createEvent=require("./lib/createEvent.js");var speed=.065;module.exports=createPanZoom;function createPanZoom(svgElement,options){var elementValid=svgElement instanceof SVGElement;if(!elementValid){throw new Error("svg element is required for svg.panzoom to work")}var owner=svgElement.ownerSVGElement;if(!owner){throw new Error("Do not apply panzoom to the root <svg> element. "+"Use its child instead (e.g. <g></g>). "+"As of March 2016 only FireFox supported transform on the root element")}options=options||{};var beforeWheel=options.beforeWheel||noop;var touchInProgress=false;var panstartFired=false;var mouseX;var mouseY;var pinchZoomLength;var dragObject;var prevSelectStart;var prevDragStart;var smoothScroll=kinetic(svgElement,scroll);var previousAnimation;listenForEvents();return{dispose:dispose,moveBy:internalMoveBy,centerOn:centerOn};function centerOn(ui){var parent=ui.ownerSVGElement;if(!parent)throw new Error("ui element is required to be within the scene");var clientRect=ui.getBoundingClientRect();var cx=clientRect.left+clientRect.width/2;var cy=clientRect.top+clientRect.height/2;var container=parent.getBoundingClientRect();var dx=container.width/2-cx;var dy=container.height/2-cy;internalMoveBy(dx,dy,true)}function internalMoveBy(dx,dy,smooth){if(!smooth){moveBy(svgElement,dx,dy);return}if(previousAnimation)previousAnimation.cancel();var from={x:0,y:0};var to={x:dx,y:dy};var lastX=0;var lastY=0;previousAnimation=animate(from,to,{step:function(v){moveBy(svgElement,v.x-lastX,v.y-lastY);lastX=v.x;lastY=v.y}})}function scroll(x,y){moveTo(svgElement,x,y)}function dispose(){wheel.removeWheelListener(svgElement,onMouseWheel);owner.removeEventListener("mousedown",onMouseDown);smoothScroll.cancel();releaseDocumentMouse();releaseTouches();triggerPanEnd()}function listenForEvents(){owner.addEventListener("mousedown",onMouseDown);owner.addEventListener("touchstart",onTouch);wheel.addWheelListener(owner,onMouseWheel)}function onTouch(e){if(e.touches.length===1){return handleSignleFingerTouch(e,e.touches[0])}else if(e.touches.length===2){e.stopPropagation();e.preventDefault();pinchZoomLength=getPinchZoomLength(e.touches[1],e.touches[1])}}function handleSignleFingerTouch(e){e.stopPropagation();e.preventDefault();var touch=e.touches[0];mouseX=touch.clientX;mouseY=touch.clientY;if(!touchInProgress){touchInProgress=true;document.addEventListener("touchmove",handleTouchMove);document.addEventListener("touchend",handleTouchEnd);document.addEventListener("touchcancel",handleTouchEnd)}}function handleTouchMove(e){triggerPanStart();if(e.touches.length===1){e.stopPropagation();var touch=e.touches[0];var dx=touch.clientX-mouseX;var dy=touch.clientY-mouseY;mouseX=touch.clientX;mouseY=touch.clientY;internalMoveBy(dx,dy)}else if(e.touches.length===2){var t1=e.touches[0];var t2=e.touches[1];var currentPinchLength=getPinchZoomLength(t1,t2);var delta=0;if(currentPinchLength<pinchZoomLength){delta=1}else if(currentPinchLength>pinchZoomLength){delta=-1}var scaleMultiplier=getScaleMultiplier(delta);mouseX=(t1.clientX+t2.clientX)/2;mouseY=(t1.clientY+t2.clientY)/2;zoomTo(svgElement,mouseX,mouseY,scaleMultiplier);pinchZoomLength=currentPinchLength;e.stopPropagation();e.preventDefault()}}function handleTouchEnd(e){if(e.touches.length>0){mouseX=e.touches[0].clientX;mouseY=e.touches[0].clientY}else{touchInProgress=false;triggerPanEnd();releaseTouches()}}function getPinchZoomLength(finger1,finger2){return(finger1.clientX-finger2.clientX)*(finger1.clientX-finger2.clientX)+(finger1.clientY-finger2.clientY)*(finger1.clientY-finger2.clientY)}function onMouseDown(e){if(touchInProgress){e.stopPropagation();return false}var isLeftButton=e.button===1&&window.event!==null||e.button===0;if(!isLeftButton)return;mouseX=e.clientX;mouseY=e.clientY;document.addEventListener("mousemove",onMouseMove);document.addEventListener("mouseup",onMouseUp);dragObject=e.target||e.srcElement;prevSelectStart=window.document.onselectstart;prevDragStart=window.document.ondragstart;window.document.onselectstart=disabled;dragObject.ondragstart=disabled;return false}function onMouseMove(e){if(touchInProgress)return;triggerPanStart();var dx=e.clientX-mouseX;var dy=e.clientY-mouseY;mouseX=e.clientX;mouseY=e.clientY;internalMoveBy(dx,dy)}function onMouseUp(){window.document.onselectstart=prevSelectStart;if(dragObject)dragObject.ondragstart=prevDragStart;triggerPanEnd();releaseDocumentMouse()}function releaseDocumentMouse(){document.removeEventListener("mousemove",onMouseMove);document.removeEventListener("mouseup",onMouseUp);panstartFired=false}function releaseTouches(){document.removeEventListener("touchmove",handleTouchMove);document.removeEventListener("touchend",handleTouchEnd);document.removeEventListener("touchcancel",handleTouchEnd);panstartFired=false}function onMouseWheel(e){if(beforeWheel(e))return;smoothScroll.cancel();var scaleMultiplier=getScaleMultiplier(e.deltaY);if(scaleMultiplier!==1){zoomTo(svgElement,e.clientX,e.clientY,scaleMultiplier);e.preventDefault()}}function getScaleMultiplier(delta){var scaleMultiplier=1;if(delta>0){scaleMultiplier=1-speed}else if(delta<0){scaleMultiplier=1+speed}return scaleMultiplier}function triggerPanStart(){if(!panstartFired){triggerEvent("panstart");panstartFired=true;smoothScroll.start()}}function triggerPanEnd(){if(panstartFired){smoothScroll.stop();triggerEvent("panend")}}function triggerEvent(name){var event=createEvent(name);svgElement.dispatchEvent(event)}}function disabled(e){e.stopPropagation();return false}function noop(){}},{"./lib/createEvent.js":2,"./lib/kinetic.js":4,"./lib/moveBy.js":5,"./lib/moveTo.js":6,"./lib/zoomTo.js":7,amator:8,wheel:10}],2:[function(require,module,exports){module.exports=createEvent;var isIE=typeof Event!=="function";function createEvent(name){if(isIE){var evt=document.createEvent("CustomEvent");evt.initCustomEvent(name,true,true,undefined);return evt}else{return new Event(name)}}},{}],3:[function(require,module,exports){module.exports=getTransform;function getTransform(svgElement){var baseVal=svgElement.transform.baseVal;if(baseVal.numberOfItems)return baseVal.getItem(0);var owner=svgElement.ownerSVGElement||svgElement;var transform=owner.createSVGTransform();svgElement.transform.baseVal.appendItem(transform);return transform}},{}],4:[function(require,module,exports){var getTransform=require("./getTransform.js");module.exports=kinetic;var minVelocity=10;var amplitude=.42;function kinetic(element,scroll){var lastRect;var timestamp;var timeConstant=342;var ticker;var vx,targetX,ax;var vy,targetY,ay;var raf;return{start:start,stop:stop,cancel:dispose};function dispose(){window.clearInterval(ticker);window.cancelAnimationFrame(raf)}function start(){lastRect=getRect();ax=ay=vx=vy=0;timestamp=new Date;window.clearInterval(ticker);window.cancelAnimationFrame(raf);ticker=window.setInterval(track,100)}function track(){var now=Date.now();var elapsed=now-timestamp;timestamp=now;var rect=getRect();var dx=rect.x-lastRect.x;var dy=rect.y-lastRect.y;lastRect=rect;var dt=1e3/(1+elapsed);vx=.8*dx*dt+.2*vx;vy=.8*dy*dt+.2*vy}function stop(){window.clearInterval(ticker);window.cancelAnimationFrame(raf);var rect=getRect();targetX=rect.x;targetY=rect.y;timestamp=Date.now();if(vx<-minVelocity||vx>minVelocity){ax=amplitude*vx;targetX+=ax}if(vy<-minVelocity||vy>minVelocity){ay=amplitude*vy;targetY+=ay}raf=window.requestAnimationFrame(autoScroll)}function autoScroll(){var elapsed=Date.now()-timestamp;var moving=false;var dx=0;var dy=0;if(ax){dx=-ax*Math.exp(-elapsed/timeConstant);if(dx>.5||dx<-.5)moving=true;else dx=ax=0}if(ay){dy=-ay*Math.exp(-elapsed/timeConstant);if(dy>.5||dy<-.5)moving=true;else dy=ay=0}if(moving){scroll(targetX+dx,targetY+dy);raf=window.requestAnimationFrame(autoScroll)}}function getRect(){var matrix=getTransform(element).matrix;return{x:matrix.e,y:matrix.f}}}},{"./getTransform.js":3}],5:[function(require,module,exports){var getTransform=require("./getTransform.js");module.exports=moveBy;function moveBy(svgElement,dx,dy){var transform=getTransform(svgElement);svgElement.setAttribute("transform","matrix("+[transform.matrix.a,transform.matrix.b,transform.matrix.c,transform.matrix.d,transform.matrix.e+dx,transform.matrix.f+dy].join(" ")+")")}},{"./getTransform.js":3}],6:[function(require,module,exports){var getTransform=require("./getTransform.js");module.exports=moveTo;function moveTo(svgElement,x,y){var transform=getTransform(svgElement);svgElement.setAttribute("transform","matrix("+[transform.matrix.a,transform.matrix.b,transform.matrix.c,transform.matrix.d,x,y].join(" ")+")")}},{"./getTransform.js":3}],7:[function(require,module,exports){var getTransform=require("./getTransform.js");module.exports=zoomTo;function zoomTo(svgElement,clientX,clientY,scaleMultiplier){var transform=getTransform(svgElement);var parent=svgElement.ownerSVGElement;var parentCTM=parent.getScreenCTM();var scale=transform.matrix.a*scaleMultiplier;var x=clientX*parentCTM.a-parentCTM.e;var y=clientY*parentCTM.a-parentCTM.f;svgElement.setAttribute("transform","matrix("+[scale,transform.matrix.b,transform.matrix.c,scale,x-scaleMultiplier*(x-transform.matrix.e),y-scaleMultiplier*(y-transform.matrix.f)].join(" ")+")")}},{"./getTransform.js":3}],8:[function(require,module,exports){var BezierEasing=require("bezier-easing");var animations={ease:BezierEasing(.25,.1,.25,1),easeIn:BezierEasing(.42,0,1,1),easeOut:BezierEasing(0,0,.58,1),easeInOut:BezierEasing(.42,0,.58,1),linear:BezierEasing(0,0,1,1)};module.exports=animate;function animate(source,target,options){var start=Object.create(null);var diff=Object.create(null);options=options||{};var easing=typeof options.easing==="function"?options.easing:animations[options.easing];if(!easing){if(options.easing){console.warn("Unknown easing function in amator: "+options.easing)}easing=animations.ease}var step=typeof options.step==="function"?options.step:noop;var done=typeof options.done==="function"?options.done:noop;var scheduler=getScheduler(options.scheduler);var keys=Object.keys(target);keys.forEach(function(key){start[key]=source[key];diff[key]=target[key]-source[key]});var durationInMs=options.duration||400;var durationInFrames=Math.max(1,durationInMs*.06);var previousAnimationId;var frame=0;previousAnimationId=scheduler.next(loop);return{cancel:cancel};function cancel(){scheduler.cancel(previousAnimationId);previousAnimationId=0}function loop(){var t=easing(frame/durationInFrames);frame+=1;setValues(t);if(frame<=durationInFrames){previousAnimationId=scheduler.next(loop);step(source)}else{previousAnimationId=0;setTimeout(function(){done(source)},0)}}function setValues(t){keys.forEach(function(key){source[key]=diff[key]*t+start[key]})}}function noop(){}function getScheduler(scheduler){if(!scheduler){var canRaf=typeof window!=="undefined"&&window.requestAnimationFrame;return canRaf?rafScheduler():timeoutScheduler()}if(typeof scheduler.next!=="function")throw new Error("Scheduler is supposed to have next(cb) function");if(typeof scheduler.cancel!=="function")throw new Error("Scheduler is supposed to have cancel(handle) function");return scheduler}function rafScheduler(){return{next:window.requestAnimationFrame.bind(window),cancel:window.cancelAnimationFrame.bind(window)}}function timeoutScheduler(){return{next:function(cb){return setTimeout(cb,1e3/60)},cancel:function(id){return clearTimeout(id)}}}},{"bezier-easing":9}],9:[function(require,module,exports){var NEWTON_ITERATIONS=4;var NEWTON_MIN_SLOPE=.001;var SUBDIVISION_PRECISION=1e-7;var SUBDIVISION_MAX_ITERATIONS=10;var kSplineTableSize=11;var kSampleStepSize=1/(kSplineTableSize-1);var float32ArraySupported=typeof Float32Array==="function";function A(aA1,aA2){return 1-3*aA2+3*aA1}function B(aA1,aA2){return 3*aA2-6*aA1}function C(aA1){return 3*aA1}function calcBezier(aT,aA1,aA2){return((A(aA1,aA2)*aT+B(aA1,aA2))*aT+C(aA1))*aT}function getSlope(aT,aA1,aA2){return 3*A(aA1,aA2)*aT*aT+2*B(aA1,aA2)*aT+C(aA1)}function binarySubdivide(aX,aA,aB,mX1,mX2){var currentX,currentT,i=0;do{currentT=aA+(aB-aA)/2;currentX=calcBezier(currentT,mX1,mX2)-aX;if(currentX>0){aB=currentT}else{aA=currentT}}while(Math.abs(currentX)>SUBDIVISION_PRECISION&&++i<SUBDIVISION_MAX_ITERATIONS);return currentT}function newtonRaphsonIterate(aX,aGuessT,mX1,mX2){for(var i=0;i<NEWTON_ITERATIONS;++i){var currentSlope=getSlope(aGuessT,mX1,mX2);if(currentSlope===0){return aGuessT}var currentX=calcBezier(aGuessT,mX1,mX2)-aX;aGuessT-=currentX/currentSlope}return aGuessT}module.exports=function bezier(mX1,mY1,mX2,mY2){if(!(0<=mX1&&mX1<=1&&0<=mX2&&mX2<=1)){throw new Error("bezier x values must be in [0, 1] range")}var sampleValues=float32ArraySupported?new Float32Array(kSplineTableSize):new Array(kSplineTableSize);if(mX1!==mY1||mX2!==mY2){for(var i=0;i<kSplineTableSize;++i){sampleValues[i]=calcBezier(i*kSampleStepSize,mX1,mX2)}}function getTForX(aX){var intervalStart=0;var currentSample=1;var lastSample=kSplineTableSize-1;for(;currentSample!==lastSample&&sampleValues[currentSample]<=aX;++currentSample){intervalStart+=kSampleStepSize}--currentSample;var dist=(aX-sampleValues[currentSample])/(sampleValues[currentSample+1]-sampleValues[currentSample]);var guessForT=intervalStart+dist*kSampleStepSize;var initialSlope=getSlope(guessForT,mX1,mX2);if(initialSlope>=NEWTON_MIN_SLOPE){return newtonRaphsonIterate(aX,guessForT,mX1,mX2)}else if(initialSlope===0){return guessForT}else{return binarySubdivide(aX,intervalStart,intervalStart+kSampleStepSize,mX1,mX2)}}return function BezierEasing(x){if(mX1===mY1&&mX2===mY2){return x}if(x===0){return 0}if(x===1){return 1}return calcBezier(getTForX(x),mY1,mY2)}}},{}],10:[function(require,module,exports){module.exports=addWheelListener;module.exports.addWheelListener=addWheelListener;module.exports.removeWheelListener=removeWheelListener;var prefix="",_addEventListener,_removeEventListener,onwheel,support;detectEventModel(typeof window!=="undefined"&&window,typeof document!=="undefined"&&document);function addWheelListener(elem,callback,useCapture){_addWheelListener(elem,support,callback,useCapture);if(support=="DOMMouseScroll"){_addWheelListener(elem,"MozMousePixelScroll",callback,useCapture)}}function removeWheelListener(elem,callback,useCapture){_removeWheelListener(elem,support,callback,useCapture);if(support=="DOMMouseScroll"){_removeWheelListener(elem,"MozMousePixelScroll",callback,useCapture)}}function _addWheelListener(elem,eventName,callback,useCapture){elem[_addEventListener](prefix+eventName,support=="wheel"?callback:function(originalEvent){!originalEvent&&(originalEvent=window.event);var event={originalEvent:originalEvent,target:originalEvent.target||originalEvent.srcElement,type:"wheel",deltaMode:originalEvent.type=="MozMousePixelScroll"?0:1,deltaX:0,delatZ:0,clientX:originalEvent.clientX,clientY:originalEvent.clientY,preventDefault:function(){originalEvent.preventDefault?originalEvent.preventDefault():originalEvent.returnValue=false},stopPropagation:function(){if(originalEvent.stopPropagation)originalEvent.stopPropagation()},stopImmediatePropagation:function(){if(originalEvent.stopImmediatePropagation)originalEvent.stopImmediatePropagation()}};if(support=="mousewheel"){event.deltaY=-1/40*originalEvent.wheelDelta;originalEvent.wheelDeltaX&&(event.deltaX=-1/40*originalEvent.wheelDeltaX)}else{event.deltaY=originalEvent.detail}return callback(event)},useCapture||false)}function _removeWheelListener(elem,eventName,callback,useCapture){elem[_removeEventListener](prefix+eventName,callback,useCapture||false)}function detectEventModel(window,document){if(window&&window.addEventListener){_addEventListener="addEventListener";_removeEventListener="removeEventListener"}else{_addEventListener="attachEvent";_removeEventListener="detachEvent";prefix="on"}if(document){support="onwheel"in document.createElement("div")?"wheel":document.onmousewheel!==undefined?"mousewheel":"DOMMouseScroll"}else{support="wheel"}}},{}]},{},[1])(1)});
+(function(f){if(typeof exports==="object"&&typeof module!=="undefined"){module.exports=f()}else if(typeof define==="function"&&define.amd){define([],f)}else{var g;if(typeof window!=="undefined"){g=window}else if(typeof global!=="undefined"){g=global}else if(typeof self!=="undefined"){g=self}else{g=this}g.panzoom=f()}})(function(){var define,module,exports;return function e(t,n,r){function s(o,u){if(!n[o]){if(!t[o]){var a=typeof require=="function"&&require;if(!u&&a)return a(o,!0);if(i)return i(o,!0);var f=new Error("Cannot find module '"+o+"'");throw f.code="MODULE_NOT_FOUND",f}var l=n[o]={exports:{}};t[o][0].call(l.exports,function(e){var n=t[o][1][e];return s(n?n:e)},l,l.exports,e,t,n,r)}return n[o].exports}var i=typeof require=="function"&&require;for(var o=0;o<r.length;o++)s(r[o]);return s}({1:[function(require,module,exports){var wheel=require("wheel");var animate=require("amator");var zoomTo=require("./lib/zoomTo.js");var kinetic=require("./lib/kinetic.js");var moveBy=require("./lib/moveBy.js");var moveTo=require("./lib/moveTo.js");var createEvent=require("./lib/createEvent.js");var defaultZoomSpeed=.065;module.exports=createPanZoom;function createPanZoom(svgElement,options){var elementValid=svgElement instanceof SVGElement;if(!elementValid){throw new Error("svg element is required for svg.panzoom to work")}var owner=svgElement.ownerSVGElement;if(!owner){throw new Error("Do not apply panzoom to the root <svg> element. "+"Use its child instead (e.g. <g></g>). "+"As of March 2016 only FireFox supported transform on the root element")}options=options||{};var beforeWheel=options.beforeWheel||noop;var speed=typeof options.zoomSpeed==="number"?options.zoomSpeed:defaultZoomSpeed;var touchInProgress=false;var panstartFired=false;var mouseX;var mouseY;var pinchZoomLength;var dragObject;var prevSelectStart;var prevDragStart;var smoothScroll=kinetic(svgElement,scroll);var previousAnimation;var multitouch;listenForEvents();return{dispose:dispose,moveBy:internalMoveBy,centerOn:centerOn,zoomTo:publicZoomTo};function centerOn(ui){var parent=ui.ownerSVGElement;if(!parent)throw new Error("ui element is required to be within the scene");var clientRect=ui.getBoundingClientRect();var cx=clientRect.left+clientRect.width/2;var cy=clientRect.top+clientRect.height/2;var container=parent.getBoundingClientRect();var dx=container.width/2-cx;var dy=container.height/2-cy;internalMoveBy(dx,dy,true)}function internalMoveBy(dx,dy,smooth){if(!smooth){moveBy(svgElement,dx,dy);return}if(previousAnimation)previousAnimation.cancel();var from={x:0,y:0};var to={x:dx,y:dy};var lastX=0;var lastY=0;previousAnimation=animate(from,to,{step:function(v){moveBy(svgElement,v.x-lastX,v.y-lastY);lastX=v.x;lastY=v.y}})}function scroll(x,y){moveTo(svgElement,x,y)}function dispose(){wheel.removeWheelListener(svgElement,onMouseWheel);owner.removeEventListener("mousedown",onMouseDown);smoothScroll.cancel();releaseDocumentMouse();releaseTouches();triggerPanEnd()}function listenForEvents(){owner.addEventListener("mousedown",onMouseDown);owner.addEventListener("touchstart",onTouch);wheel.addWheelListener(owner,onMouseWheel)}function onTouch(e){if(e.touches.length===1){return handleSignleFingerTouch(e,e.touches[0])}else if(e.touches.length===2){e.stopPropagation();e.preventDefault();pinchZoomLength=getPinchZoomLength(e.touches[0],e.touches[1]);multitouch=true;startTouchListenerIfNeeded()}}function handleSignleFingerTouch(e){e.stopPropagation();e.preventDefault();var touch=e.touches[0];mouseX=touch.clientX;mouseY=touch.clientY;startTouchListenerIfNeeded()}function startTouchListenerIfNeeded(){if(!touchInProgress){touchInProgress=true;document.addEventListener("touchmove",handleTouchMove);document.addEventListener("touchend",handleTouchEnd);document.addEventListener("touchcancel",handleTouchEnd)}}function handleTouchMove(e){triggerPanStart();if(e.touches.length===1){e.stopPropagation();var touch=e.touches[0];var dx=touch.clientX-mouseX;var dy=touch.clientY-mouseY;mouseX=touch.clientX;mouseY=touch.clientY;internalMoveBy(dx,dy)}else if(e.touches.length===2){multitouch=true;var t1=e.touches[0];var t2=e.touches[1];var currentPinchLength=getPinchZoomLength(t1,t2);var delta=0;if(currentPinchLength<pinchZoomLength){delta=1}else if(currentPinchLength>pinchZoomLength){delta=-1}var scaleMultiplier=getScaleMultiplier(delta);mouseX=(t1.clientX+t2.clientX)/2;mouseY=(t1.clientY+t2.clientY)/2;zoomTo(svgElement,mouseX,mouseY,scaleMultiplier);pinchZoomLength=currentPinchLength;e.stopPropagation();e.preventDefault()}}function handleTouchEnd(e){if(e.touches.length>0){mouseX=e.touches[0].clientX;mouseY=e.touches[0].clientY}else{touchInProgress=false;triggerPanEnd();releaseTouches()}}function getPinchZoomLength(finger1,finger2){return(finger1.clientX-finger2.clientX)*(finger1.clientX-finger2.clientX)+(finger1.clientY-finger2.clientY)*(finger1.clientY-finger2.clientY)}function onMouseDown(e){if(touchInProgress){e.stopPropagation();return false}var isLeftButton=e.button===1&&window.event!==null||e.button===0;if(!isLeftButton)return;mouseX=e.clientX;mouseY=e.clientY;document.addEventListener("mousemove",onMouseMove);document.addEventListener("mouseup",onMouseUp);dragObject=e.target||e.srcElement;prevSelectStart=window.document.onselectstart;prevDragStart=window.document.ondragstart;window.document.onselectstart=disabled;dragObject.ondragstart=disabled;return false}function onMouseMove(e){if(touchInProgress)return;triggerPanStart();var dx=e.clientX-mouseX;var dy=e.clientY-mouseY;mouseX=e.clientX;mouseY=e.clientY;internalMoveBy(dx,dy)}function onMouseUp(){window.document.onselectstart=prevSelectStart;if(dragObject)dragObject.ondragstart=prevDragStart;triggerPanEnd();releaseDocumentMouse()}function releaseDocumentMouse(){document.removeEventListener("mousemove",onMouseMove);document.removeEventListener("mouseup",onMouseUp);panstartFired=false}function releaseTouches(){document.removeEventListener("touchmove",handleTouchMove);document.removeEventListener("touchend",handleTouchEnd);document.removeEventListener("touchcancel",handleTouchEnd);panstartFired=false;multitouch=false}function onMouseWheel(e){if(beforeWheel(e))return;smoothScroll.cancel();var scaleMultiplier=getScaleMultiplier(e.deltaY);if(scaleMultiplier!==1){zoomTo(svgElement,e.clientX,e.clientY,scaleMultiplier);e.preventDefault()}}function publicZoomTo(clientX,clientY,scaleMultiplier){zoomTo(svgElement,clientX,clientY,scaleMultiplier)}function getScaleMultiplier(delta){var scaleMultiplier=1;if(delta>0){scaleMultiplier=1-speed}else if(delta<0){scaleMultiplier=1+speed}return scaleMultiplier}function triggerPanStart(){if(!panstartFired){triggerEvent("panstart");panstartFired=true;smoothScroll.start()}}function triggerPanEnd(){if(panstartFired){if(!multitouch)smoothScroll.stop();triggerEvent("panend")}}function triggerEvent(name){var event=createEvent(name);svgElement.dispatchEvent(event)}}function disabled(e){e.stopPropagation();return false}function noop(){}},{"./lib/createEvent.js":2,"./lib/kinetic.js":4,"./lib/moveBy.js":5,"./lib/moveTo.js":6,"./lib/zoomTo.js":7,amator:8,wheel:10}],2:[function(require,module,exports){module.exports=createEvent;var isIE=typeof Event!=="function";function createEvent(name){if(isIE){var evt=document.createEvent("CustomEvent");evt.initCustomEvent(name,true,true,undefined);return evt}else{return new Event(name)}}},{}],3:[function(require,module,exports){module.exports=getTransform;function getTransform(svgElement){var baseVal=svgElement.transform.baseVal;if(baseVal.numberOfItems)return baseVal.getItem(0);var owner=svgElement.ownerSVGElement||svgElement;var transform=owner.createSVGTransform();svgElement.transform.baseVal.appendItem(transform);return transform}},{}],4:[function(require,module,exports){var getTransform=require("./getTransform.js");module.exports=kinetic;var minVelocity=10;var amplitude=.42;function kinetic(element,scroll){var lastRect;var timestamp;var timeConstant=342;var ticker;var vx,targetX,ax;var vy,targetY,ay;var raf;return{start:start,stop:stop,cancel:dispose};function dispose(){window.clearInterval(ticker);window.cancelAnimationFrame(raf)}function start(){lastRect=getRect();ax=ay=vx=vy=0;timestamp=new Date;window.clearInterval(ticker);window.cancelAnimationFrame(raf);ticker=window.setInterval(track,100)}function track(){var now=Date.now();var elapsed=now-timestamp;timestamp=now;var rect=getRect();var dx=rect.x-lastRect.x;var dy=rect.y-lastRect.y;lastRect=rect;var dt=1e3/(1+elapsed);vx=.8*dx*dt+.2*vx;vy=.8*dy*dt+.2*vy}function stop(){window.clearInterval(ticker);window.cancelAnimationFrame(raf);var rect=getRect();targetX=rect.x;targetY=rect.y;timestamp=Date.now();if(vx<-minVelocity||vx>minVelocity){ax=amplitude*vx;targetX+=ax}if(vy<-minVelocity||vy>minVelocity){ay=amplitude*vy;targetY+=ay}raf=window.requestAnimationFrame(autoScroll)}function autoScroll(){var elapsed=Date.now()-timestamp;var moving=false;var dx=0;var dy=0;if(ax){dx=-ax*Math.exp(-elapsed/timeConstant);if(dx>.5||dx<-.5)moving=true;else dx=ax=0}if(ay){dy=-ay*Math.exp(-elapsed/timeConstant);if(dy>.5||dy<-.5)moving=true;else dy=ay=0}if(moving){scroll(targetX+dx,targetY+dy);raf=window.requestAnimationFrame(autoScroll)}}function getRect(){var matrix=getTransform(element).matrix;return{x:matrix.e,y:matrix.f}}}},{"./getTransform.js":3}],5:[function(require,module,exports){var getTransform=require("./getTransform.js");module.exports=moveBy;function moveBy(svgElement,dx,dy){var transform=getTransform(svgElement);svgElement.setAttribute("transform","matrix("+[transform.matrix.a,transform.matrix.b,transform.matrix.c,transform.matrix.d,transform.matrix.e+dx,transform.matrix.f+dy].join(" ")+")")}},{"./getTransform.js":3}],6:[function(require,module,exports){var getTransform=require("./getTransform.js");module.exports=moveTo;function moveTo(svgElement,x,y){var transform=getTransform(svgElement);svgElement.setAttribute("transform","matrix("+[transform.matrix.a,transform.matrix.b,transform.matrix.c,transform.matrix.d,x,y].join(" ")+")")}},{"./getTransform.js":3}],7:[function(require,module,exports){var getTransform=require("./getTransform.js");module.exports=zoomTo;function zoomTo(svgElement,clientX,clientY,scaleMultiplier){var transform=getTransform(svgElement);var parent=svgElement.ownerSVGElement;var parentCTM=parent.getScreenCTM();var scale=transform.matrix.a*scaleMultiplier;var x=clientX*parentCTM.a-parentCTM.e;var y=clientY*parentCTM.a-parentCTM.f;svgElement.setAttribute("transform","matrix("+[scale,transform.matrix.b,transform.matrix.c,scale,x-scaleMultiplier*(x-transform.matrix.e),y-scaleMultiplier*(y-transform.matrix.f)].join(" ")+")")}},{"./getTransform.js":3}],8:[function(require,module,exports){var BezierEasing=require("bezier-easing");var animations={ease:BezierEasing(.25,.1,.25,1),easeIn:BezierEasing(.42,0,1,1),easeOut:BezierEasing(0,0,.58,1),easeInOut:BezierEasing(.42,0,.58,1),linear:BezierEasing(0,0,1,1)};module.exports=animate;function animate(source,target,options){var start=Object.create(null);var diff=Object.create(null);options=options||{};var easing=typeof options.easing==="function"?options.easing:animations[options.easing];if(!easing){if(options.easing){console.warn("Unknown easing function in amator: "+options.easing)}easing=animations.ease}var step=typeof options.step==="function"?options.step:noop;var done=typeof options.done==="function"?options.done:noop;var scheduler=getScheduler(options.scheduler);var keys=Object.keys(target);keys.forEach(function(key){start[key]=source[key];diff[key]=target[key]-source[key]});var durationInMs=options.duration||400;var durationInFrames=Math.max(1,durationInMs*.06);var previousAnimationId;var frame=0;previousAnimationId=scheduler.next(loop);return{cancel:cancel};function cancel(){scheduler.cancel(previousAnimationId);previousAnimationId=0}function loop(){var t=easing(frame/durationInFrames);frame+=1;setValues(t);if(frame<=durationInFrames){previousAnimationId=scheduler.next(loop);step(source)}else{previousAnimationId=0;setTimeout(function(){done(source)},0)}}function setValues(t){keys.forEach(function(key){source[key]=diff[key]*t+start[key]})}}function noop(){}function getScheduler(scheduler){if(!scheduler){var canRaf=typeof window!=="undefined"&&window.requestAnimationFrame;return canRaf?rafScheduler():timeoutScheduler()}if(typeof scheduler.next!=="function")throw new Error("Scheduler is supposed to have next(cb) function");if(typeof scheduler.cancel!=="function")throw new Error("Scheduler is supposed to have cancel(handle) function");return scheduler}function rafScheduler(){return{next:window.requestAnimationFrame.bind(window),cancel:window.cancelAnimationFrame.bind(window)}}function timeoutScheduler(){return{next:function(cb){return setTimeout(cb,1e3/60)},cancel:function(id){return clearTimeout(id)}}}},{"bezier-easing":9}],9:[function(require,module,exports){var NEWTON_ITERATIONS=4;var NEWTON_MIN_SLOPE=.001;var SUBDIVISION_PRECISION=1e-7;var SUBDIVISION_MAX_ITERATIONS=10;var kSplineTableSize=11;var kSampleStepSize=1/(kSplineTableSize-1);var float32ArraySupported=typeof Float32Array==="function";function A(aA1,aA2){return 1-3*aA2+3*aA1}function B(aA1,aA2){return 3*aA2-6*aA1}function C(aA1){return 3*aA1}function calcBezier(aT,aA1,aA2){return((A(aA1,aA2)*aT+B(aA1,aA2))*aT+C(aA1))*aT}function getSlope(aT,aA1,aA2){return 3*A(aA1,aA2)*aT*aT+2*B(aA1,aA2)*aT+C(aA1)}function binarySubdivide(aX,aA,aB,mX1,mX2){var currentX,currentT,i=0;do{currentT=aA+(aB-aA)/2;currentX=calcBezier(currentT,mX1,mX2)-aX;if(currentX>0){aB=currentT}else{aA=currentT}}while(Math.abs(currentX)>SUBDIVISION_PRECISION&&++i<SUBDIVISION_MAX_ITERATIONS);return currentT}function newtonRaphsonIterate(aX,aGuessT,mX1,mX2){for(var i=0;i<NEWTON_ITERATIONS;++i){var currentSlope=getSlope(aGuessT,mX1,mX2);if(currentSlope===0){return aGuessT}var currentX=calcBezier(aGuessT,mX1,mX2)-aX;aGuessT-=currentX/currentSlope}return aGuessT}module.exports=function bezier(mX1,mY1,mX2,mY2){if(!(0<=mX1&&mX1<=1&&0<=mX2&&mX2<=1)){throw new Error("bezier x values must be in [0, 1] range")}var sampleValues=float32ArraySupported?new Float32Array(kSplineTableSize):new Array(kSplineTableSize);if(mX1!==mY1||mX2!==mY2){for(var i=0;i<kSplineTableSize;++i){sampleValues[i]=calcBezier(i*kSampleStepSize,mX1,mX2)}}function getTForX(aX){var intervalStart=0;var currentSample=1;var lastSample=kSplineTableSize-1;for(;currentSample!==lastSample&&sampleValues[currentSample]<=aX;++currentSample){intervalStart+=kSampleStepSize}--currentSample;var dist=(aX-sampleValues[currentSample])/(sampleValues[currentSample+1]-sampleValues[currentSample]);var guessForT=intervalStart+dist*kSampleStepSize;var initialSlope=getSlope(guessForT,mX1,mX2);if(initialSlope>=NEWTON_MIN_SLOPE){return newtonRaphsonIterate(aX,guessForT,mX1,mX2)}else if(initialSlope===0){return guessForT}else{return binarySubdivide(aX,intervalStart,intervalStart+kSampleStepSize,mX1,mX2)}}return function BezierEasing(x){if(mX1===mY1&&mX2===mY2){return x}if(x===0){return 0}if(x===1){return 1}return calcBezier(getTForX(x),mY1,mY2)}}},{}],10:[function(require,module,exports){module.exports=addWheelListener;module.exports.addWheelListener=addWheelListener;module.exports.removeWheelListener=removeWheelListener;var prefix="",_addEventListener,_removeEventListener,onwheel,support;detectEventModel(typeof window!=="undefined"&&window,typeof document!=="undefined"&&document);function addWheelListener(elem,callback,useCapture){_addWheelListener(elem,support,callback,useCapture);if(support=="DOMMouseScroll"){_addWheelListener(elem,"MozMousePixelScroll",callback,useCapture)}}function removeWheelListener(elem,callback,useCapture){_removeWheelListener(elem,support,callback,useCapture);if(support=="DOMMouseScroll"){_removeWheelListener(elem,"MozMousePixelScroll",callback,useCapture)}}function _addWheelListener(elem,eventName,callback,useCapture){elem[_addEventListener](prefix+eventName,support=="wheel"?callback:function(originalEvent){!originalEvent&&(originalEvent=window.event);var event={originalEvent:originalEvent,target:originalEvent.target||originalEvent.srcElement,type:"wheel",deltaMode:originalEvent.type=="MozMousePixelScroll"?0:1,deltaX:0,delatZ:0,clientX:originalEvent.clientX,clientY:originalEvent.clientY,preventDefault:function(){originalEvent.preventDefault?originalEvent.preventDefault():originalEvent.returnValue=false},stopPropagation:function(){if(originalEvent.stopPropagation)originalEvent.stopPropagation()},stopImmediatePropagation:function(){if(originalEvent.stopImmediatePropagation)originalEvent.stopImmediatePropagation()}};if(support=="mousewheel"){event.deltaY=-1/40*originalEvent.wheelDelta;originalEvent.wheelDeltaX&&(event.deltaX=-1/40*originalEvent.wheelDeltaX)}else{event.deltaY=originalEvent.detail}return callback(event)},useCapture||false)}function _removeWheelListener(elem,eventName,callback,useCapture){elem[_removeEventListener](prefix+eventName,callback,useCapture||false)}function detectEventModel(window,document){if(window&&window.addEventListener){_addEventListener="addEventListener";_removeEventListener="removeEventListener"}else{_addEventListener="attachEvent";_removeEventListener="detachEvent";prefix="on"}if(document){support="onwheel"in document.createElement("div")?"wheel":document.onmousewheel!==undefined?"mousewheel":"DOMMouseScroll"}else{support="wheel"}}},{}]},{},[1])(1)});

package.json

 {
   "name": "panzoom",
-  "version": "1.2.3",
+  "version": "1.2.4",
   "description": "Pan and zoom SVG elements",
@@ -5,0 +5,0 @@ "main": "index.js",

New alerts

License Policy Violation

License

This package is not allowed per your license policy. Review the package's license to ensure compliance.

Found 1 instance in 1 package

Fixed alerts

License Policy Violation

License

This package is not allowed per your license policy. Review the package's license to ensure compliance.

Found 1 instance in 1 package

Improved metrics

Total package byte prevSize

121319

increased by0.8%

Worsened metrics

Lines of code

1184

decreased by-4.13%

No dependency changes