diff options
Diffstat (limited to 'src/svgpan.js')
-rw-r--r-- | src/svgpan.js | 271 |
1 files changed, 271 insertions, 0 deletions
diff --git a/src/svgpan.js b/src/svgpan.js new file mode 100644 index 0000000..2f75255 --- /dev/null +++ b/src/svgpan.js @@ -0,0 +1,271 @@ +/** + * The code below is based on SVGPan Library 1.2 and was modified for doxygen + * + * This code is licensed under the following BSD license: + * + * Copyright 2009-2010 Andrea Leofreddi <a.leofreddi@itcharm.com>. All rights reserved. + * + * Redistribution and use in source and binary forms, with or without modification, are + * permitted provided that the following conditions are met: + * + * 1. Redistributions of source code must retain the above copyright notice, this list of + * conditions and the following disclaimer. + * + * 2. Redistributions in binary form must reproduce the above copyright notice, this list + * of conditions and the following disclaimer in the documentation and/or other materials + * provided with the distribution. + * + * THIS SOFTWARE IS PROVIDED BY Andrea Leofreddi ``AS IS'' AND ANY EXPRESS OR IMPLIED + * WARRANTIES, INCLUDING, BUT NOT LIMITED TO, THE IMPLIED WARRANTIES OF MERCHANTABILITY AND + * FITNESS FOR A PARTICULAR PURPOSE ARE DISCLAIMED. IN NO EVENT SHALL Andrea Leofreddi OR + * CONTRIBUTORS BE LIABLE FOR ANY DIRECT, INDIRECT, INCIDENTAL, SPECIAL, EXEMPLARY, OR + * CONSEQUENTIAL DAMAGES (INCLUDING, BUT NOT LIMITED TO, PROCUREMENT OF SUBSTITUTE GOODS OR + * SERVICES; LOSS OF USE, DATA, OR PROFITS; OR BUSINESS INTERRUPTION) HOWEVER CAUSED AND ON + * ANY THEORY OF LIABILITY, WHETHER IN CONTRACT, STRICT LIABILITY, OR TORT (INCLUDING + * NEGLIGENCE OR OTHERWISE) ARISING IN ANY WAY OUT OF THE USE OF THIS SOFTWARE, EVEN IF + * ADVISED OF THE POSSIBILITY OF SUCH DAMAGE. + * + * The views and conclusions contained in the software and documentation are those of the + * authors and should not be interpreted as representing official policies, either expressed + * or implied, of Andrea Leofreddi. + */ + +var root = document.documentElement; +var state = 'none'; +var stateOrigin; +var stateTf = root.createSVGMatrix(); +var cursorGrab = ' url("data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAA4AAAAOCAMAAAAolt3jAAAAGXRFWHRTb2Z0d2FyZQBBZG9iZSBJbWFnZVJlYWR5ccllPAAAAAlQTFRFAAAA////////c3ilYwAAAAN0Uk5T//8A18oNQQAAAD1JREFUeNp0zlEKACAIA9Bt9z90bZBZkQj29qFBEuBOzQHSnWTTyckEfqUuZgFvslH4ch3qLCO/Kr8cAgwATw4Ax6XRCcoAAAAASUVORK5CYII="), move'; +var zoomSteps = 10; +var zoomInFactor; +var zoomOutFactor; +var windowWidth; +var windowHeight; +var svgDoc; +var minZoom; +var maxZoom; +if (!window) window=this; + +/** + * Register handlers + */ +function init(evt) +{ + svgDoc = evt.target.ownerDocument; + if (window.innerHeight) // Firefox + { + windowWidth = window.innerWidth; + windowHeight = window.innerHeight; + } + else if (document.documentElement.clientWidth) // Chrome/Safari + { + windowWidth = document.documentElement.clientWidth + windowHeight = document.documentElement.clientHeight + } + else + { + windowWidth = 800; + windowHeight = 600; + } + minZoom = windowHeight/viewHeight; + maxZoom = 1.5; + zoomInFactor = Math.pow(maxZoom/minZoom,1.0/zoomSteps); + zoomOutFactor = 1.0/zoomInFactor; + + var g = svgDoc.getElementById('viewport'); + var bb = g.getBBox(); + var a = 'scale('+minZoom+') rotate(0) translate('+((innerWidth-viewWidth*minZoom)/(2*minZoom))+' '+viewHeight+')'; + + g.setAttribute('transform',a); + + setAttributes(root, { + "onmousedown" : "handleMouseDown(evt)", + "onmousemove" : "handleMouseMove(evt)", + "onmouseup" : "handleMouseUp(evt)" + }); + + if (window.addEventListener) + { + if (navigator.userAgent.toLowerCase().indexOf('webkit') >= 0 || navigator.userAgent.toLowerCase().indexOf("opera") >= 0) + window.addEventListener('mousewheel', handleMouseWheel, false); // Chrome/Safari + else + window.addEventListener('DOMMouseScroll', handleMouseWheel, false); // Others + } +} + +window.onresize=function() +{ + if (svgDoc) + { + var newWindowWidth; + if (window.innerWidth) // Firefox + { + newWindowWidth = window.innerWidth; + } + else if (document.documentElement.clientWidth) // Chrome/Safari + { + newWindowWidth = document.documentElement.clientWidth + } + if (newWindowWidth) + { + var g = svgDoc.getElementById("viewport"); + var n = g.getCTM(); + n = n.translate((newWindowWidth-windowWidth)/(2*minZoom),0); + setCTM(g, n); + stateTf = stateTf.multiply(n.inverse()); + windowWidth = newWindowWidth; + } + } +} + +/** + * Instance an SVGPoint object with given event coordinates. + */ +function getEventPoint(evt) +{ + var p = root.createSVGPoint(); + p.x = evt.clientX; + p.y = evt.clientY; + return p; +} + +/** + * Sets the current transform matrix of an element. + */ +function setCTM(element, matrix) +{ + var s = "matrix(" + matrix.a + "," + matrix.b + "," + matrix.c + "," + matrix.d + "," + matrix.e + "," + matrix.f + ")"; + element.setAttribute("transform", s); +} + +/** + * Sets attributes of an element. + */ +function setAttributes(element, attributes) +{ + for (i in attributes) + element.setAttributeNS(null, i, attributes[i]); +} + +function doZoom(g,point,zoomFactor) +{ + var p = point.matrixTransform(g.getCTM().inverse()); + var k = root.createSVGMatrix().translate(p.x, p.y).scale(zoomFactor).translate(-p.x, -p.y); + var n = g.getCTM().multiply(k); + var s = Math.max(n.a,n.d); + if (s>maxZoom) n=n.translate(p.x,p.y).scale(maxZoom/s).translate(-p.x,-p.y); + else if (s<minZoom) n=n.translate(p.x,p.y).scale(minZoom/s).translate(-p.x,-p.y); + setCTM(g, n); + stateTf = stateTf.multiply(n.inverse()); +} + +/** + * Handle mouse move event. + */ +function handleMouseWheel(evt) +{ + if (!evt) evt = window.evt; + if (evt.preventDefault) evt.preventDefault(); + evt.returnValue = false; + + if (state!='pan') + { + + var delta; + + if(evt.wheelDelta) + { + if (window.opera) + { + delta = evt.wheelDelta / 720; // Opera + } + else + { + delta = evt.wheelDelta / 7200; // Chrome/Safari/Opera + } + } + else + { + delta = evt.detail / -180; // Mozilla + } + + var svgDoc = evt.target.ownerDocument; + var g = svgDoc.getElementById("viewport"); + var p = getEventPoint(evt); + doZoom(g,p,1+delta); + } +} + +/** + * Handle mouse move event. + */ +function handleMouseMove(evt) +{ + if(evt.preventDefault) + evt.preventDefault(); + + evt.returnValue = false; + + var g = svgDoc.getElementById("viewport"); + + if (state == 'pan') + { + // Pan mode + var p = getEventPoint(evt).matrixTransform(stateTf); + setCTM(g,stateTf.inverse().translate(p.x - stateOrigin.x, p.y - stateOrigin.y)); + } +} + +/** + * Handle click event. + */ +function handleMouseDown(evt) +{ + if(evt.preventDefault) + evt.preventDefault(); + evt.returnValue = false; + var g = svgDoc.getElementById("viewport"); + state = 'pan'; + stateTf = g.getCTM().inverse(); + stateOrigin = getEventPoint(evt).matrixTransform(stateTf); + g.style.cursor = cursorGrab; +} + +/** + * Handle mouse button release event. + */ +function handleMouseUp(evt) +{ + if (evt.preventDefault) evt.preventDefault(); + evt.returnValue = false; + var g = svgDoc.getElementById("viewport"); + g.style.cursor = "default"; + // Quit pan mode + state = ''; +} + +function handlePan(x,y) +{ + var g = svgDoc.getElementById("viewport"); + setCTM(g,g.getCTM().translate(x*20/minZoom,y*20/minZoom)); +} + +/** + * Dumps a matrix to a string (useful for debug). + */ +function dumpMatrix(matrix) +{ + var s = "[ " + matrix.a + ", " + matrix.c + ", " + matrix.e + "\n " + matrix.b + ", " + matrix.d + ", " + matrix.f + "\n 0, 0, 1 ]"; + return s; +} + +function handleZoom(evt,direction) +{ + var g = svgDoc.getElementById("viewport"); + var factor = direction=='in' ? zoomInFactor : zoomOutFactor; + var m = g.getCTM(); + var p = root.createSVGPoint(); + p.x = windowWidth/2; + p.y = windowHeight/2; + doZoom(g,p,factor); +} + |