middle click can now open links in new tab (and close tab)

This commit is contained in:
zadam
2019-05-15 21:50:27 +02:00
parent dd1fc23fe8
commit f22cc37df7
10 changed files with 1411 additions and 956 deletions

View File

@@ -33,11 +33,11 @@ function createPanZoom(domElement, options) {
if (!panController) {
if (domElement instanceof SVGElement) {
panController = makeSvgController(domElement)
panController = makeSvgController(domElement, options)
}
if (domElement instanceof HTMLElement) {
panController = makeDomController(domElement)
panController = makeDomController(domElement, options)
}
}
@@ -57,7 +57,8 @@ function createPanZoom(domElement, options) {
}
var filterKey = typeof options.filterKey === 'function' ? options.filterKey : noop;
var realPinch = typeof options.realPinch === 'boolean' ? options.realPinch : false
// TODO: likely need to unite pinchSpeed with zoomSpeed
var pinchSpeed = typeof options.pinchSpeed === 'number' ? options.pinchSpeed : 1;
var bounds = options.bounds
var maxZoom = typeof options.maxZoom === 'number' ? options.maxZoom : Number.POSITIVE_INFINITY
var minZoom = typeof options.minZoom === 'number' ? options.minZoom : 0
@@ -101,7 +102,7 @@ function createPanZoom(domElement, options) {
var moveByAnimation
var zoomToAnimation
var multitouch
var multiTouch
var paused = false
listenForEvents()
@@ -144,7 +145,8 @@ function createPanZoom(domElement, options) {
function showRectangle(rect) {
// TODO: this duplicates autocenter. I think autocenter should go.
var size = transformToScreen(owner.clientWidth, owner.clientHeight)
var clientRect = owner.getBoundingClientRect()
var size = transformToScreen(clientRect.width, clientRect.height)
var rectWidth = rect.right - rect.left
var rectHeight = rect.bottom - rect.top
@@ -503,7 +505,7 @@ function createPanZoom(domElement, options) {
} else if (e.touches.length === 2) {
// handleTouchMove() will care about pinch zoom.
pinchZoomLength = getPinchZoomLength(e.touches[0], e.touches[1])
multitouch = true
multiTouch = true
startTouchListenerIfNeeded()
}
}
@@ -568,25 +570,14 @@ function createPanZoom(domElement, options) {
internalMoveBy(point.x, point.y)
} else if (e.touches.length === 2) {
// it's a zoom, let's find direction
multitouch = true
multiTouch = true
var t1 = e.touches[0]
var t2 = e.touches[1]
var currentPinchLength = getPinchZoomLength(t1, t2)
var scaleMultiplier = 1
if (realPinch) {
scaleMultiplier = currentPinchLength / pinchZoomLength
} else {
var delta = 0
if (currentPinchLength < pinchZoomLength) {
delta = 1
} else if (currentPinchLength > pinchZoomLength) {
delta = -1
}
scaleMultiplier = getScaleMultiplier(delta)
}
// since the zoom speed is always based on distance from 1, we need to apply
// pinch speed only on that distance from 1:
var scaleMultiplier = 1 + (currentPinchLength / pinchZoomLength - 1) * pinchSpeed
mouseX = (t1.clientX + t2.clientX)/2
mouseY = (t1.clientY + t2.clientY)/2
@@ -619,8 +610,9 @@ function createPanZoom(domElement, options) {
}
function getPinchZoomLength(finger1, finger2) {
return Math.sqrt((finger1.clientX - finger2.clientX) * (finger1.clientX - finger2.clientX) +
(finger1.clientY - finger2.clientY) * (finger1.clientY - finger2.clientY))
var dx = finger1.clientX - finger2.clientX
var dy = finger1.clientY - finger2.clientY
return Math.sqrt(dx * dx + dy * dy)
}
function onDoubleClick(e) {
@@ -630,12 +622,6 @@ function createPanZoom(domElement, options) {
}
function onMouseDown(e) {
if (options.onMouseDown && !options.onMouseDown(e)) {
// if they return `false` from onTouch, we don't want to stop
// events propagation. Fixes https://github.com/anvaka/panzoom/issues/46
return
}
if (touchInProgress) {
// modern browsers will fire mousedown for touch events too
// we do not want this: touch is handled separately.
@@ -698,7 +684,7 @@ function createPanZoom(domElement, options) {
document.removeEventListener('touchend', handleTouchEnd)
document.removeEventListener('touchcancel', handleTouchEnd)
panstartFired = false
multitouch = false
multiTouch = false
}
function onMouseWheel(e) {
@@ -775,8 +761,8 @@ function createPanZoom(domElement, options) {
function triggerPanEnd() {
if (panstartFired) {
// we should never run smooth scrolling if it was multitouch (pinch zoom animation):
if (!multitouch) smoothScroll.stop()
// we should never run smooth scrolling if it was multiTouch (pinch zoom animation):
if (!multiTouch) smoothScroll.stop()
triggerEvent('panend')
}
}
@@ -828,11 +814,13 @@ function autoRun() {
if (!scripts) return;
var panzoomScript;
Array.from(scripts).forEach(function(x) {
for (var i = 0; i < scripts.length; ++i) {
var x = scripts[i];
if (x.src && x.src.match(/\bpanzoom(\.min)?\.js/)) {
panzoomScript = x
break;
}
})
}
if (!panzoomScript) return;
@@ -894,7 +882,7 @@ autoRun();
},{"./lib/domController.js":2,"./lib/kinetic.js":3,"./lib/svgController.js":4,"./lib/textSelectionInterceptor.js":5,"./lib/transform.js":6,"amator":7,"ngraph.events":9,"wheel":10}],2:[function(require,module,exports){
module.exports = makeDomController
function makeDomController(domElement) {
function makeDomController(domElement, options) {
var elementValid = (domElement instanceof HTMLElement)
if (!elementValid) {
throw new Error('svg element is required for svg.panzoom to work')
@@ -908,7 +896,10 @@ function makeDomController(domElement) {
}
domElement.scrollTop = 0;
owner.setAttribute('tabindex', 1); // TODO: not sure if this is really polite
if (!options.disableKeyboardInteraction) {
owner.setAttribute('tabindex', 0);
}
var api = {
getBBox: getBBox,
@@ -1067,7 +1058,7 @@ function kinetic(getPoint, scroll, settings) {
},{}],4:[function(require,module,exports){
module.exports = makeSvgController
function makeSvgController(svgElement) {
function makeSvgController(svgElement, options) {
var elementValid = (svgElement instanceof SVGElement)
if (!elementValid) {
throw new Error('svg element is required for svg.panzoom to work')
@@ -1081,7 +1072,9 @@ function makeSvgController(svgElement) {
'As of March 2016 only FireFox supported transform on the root element')
}
owner.setAttribute('tabindex', 1); // TODO: not sure if this is really polite
if (!options.disableKeyboardInteraction) {
owner.setAttribute('tabindex', 0);
}
var api = {
getBBox: getBBox,
@@ -1315,7 +1308,7 @@ function makeAggregateRaf() {
var t = backBuffer;
backBuffer = frontBuffer;
frontBuffer = t;
frontBuffer = t;
frontBuffer.forEach(function(callback) {
callback();
@@ -1578,7 +1571,7 @@ function removeWheelListener( elem, callback, useCapture ) {
// unsubscription in some browsers. But in practice, I don't think we should
// worry too much about it (those browsers are on the way out)
function _addWheelListener( elem, eventName, callback, useCapture ) {
elem[ _addEventListener ]( prefix + eventName, support == "wheel" ? callback : function( originalEvent ) {
elem[ _addEventListener ]( prefix + eventName, support == "wheel" ? callback : function(originalEvent ) {
!originalEvent && ( originalEvent = window.event );
// create a normalized event object
@@ -1620,7 +1613,10 @@ function _addWheelListener( elem, eventName, callback, useCapture ) {
// it's time to fire the callback
return callback( event );
}, useCapture || false );
}, {
capture: useCapture || false ,
passive: false
});
}
function _removeWheelListener( elem, eventName, callback, useCapture ) {