Merge remote-tracking branch 'refs/remotes/openseadragon/master'

changelog.txt

@@ -1,7 +1,18 @@
 OPENSEADRAGON CHANGELOG
 =======================
 
-2.3.1: (In Progress)
+2.4.0: (In Progress)
+
+* BREAKING CHANGE: Viewer's canvas-double-click event is now fired before it initiates the zoom (#1288)
+* You can now prevent canvas-double-click events from zooming on a per-event basis (#1288)
+
+2.3.1:
+
+* Debug mode now uses different colors for different tiled images (customizable via debugGridColor) (#1271)
+* Fixed a problem with preventDefaultAction for the canvas-drag event (#1278)
+* Fixed an issue causing double images with certain aspect ratios (#1280)
+* Fixed: placeholderFillStyle had no effect (#1286)
+* Fixed seams that appear in wrap mode on Safari and Firefox (#1305)
 
 2.3.0:
 

package.json

@@ -1,6 +1,6 @@
 {
   "name": "openseadragon",
-  "version": "2.3.0",
+  "version": "2.3.1",
   "description": "Provides a smooth, zoomable user interface for HTML/Javascript.",
   "keywords": ["image", "zoom", "pan", "openseadragon", "seadragon", "deepzoom", "dzi", "iiif", "osm", "tms"],
   "homepage": "http://openseadragon.github.io/",

src/tile.js

@@ -199,12 +199,27 @@ $.Tile = function(level, x, y, bounds, exists, url, context2D, loadWithAjax, aja
      * @memberof OpenSeadragon.Tile#
      */
     this.beingDrawn     = false;
+
     /**
      * Timestamp the tile was last touched.
      * @member {Number} lastTouchTime
      * @memberof OpenSeadragon.Tile#
      */
     this.lastTouchTime  = 0;
+
+    /**
+     * Whether this tile is in the right-most column for its level.
+     * @member {Boolean} isRightMost
+     * @memberof OpenSeadragon.Tile#
+     */
+    this.isRightMost = false;
+
+    /**
+     * Whether this tile is in the bottom-most row for its level.
+     * @member {Boolean} isBottomMost
+     * @memberof OpenSeadragon.Tile#
+     */
+    this.isBottomMost = false;
 };
 
 /** @lends OpenSeadragon.Tile.prototype */

src/tiledimage.js

@@ -1405,7 +1405,7 @@ function getTile(
         bounds.x += ( x - xMod ) / numTiles.x;
         bounds.y += (worldHeight / worldWidth) * (( y - yMod ) / numTiles.y);
 
-        tilesMatrix[ level ][ x ][ y ] = new $.Tile(
+        tile = new $.Tile(
             level,
             x,
             y,
@@ -1416,6 +1416,16 @@ function getTile(
             tiledImage.loadTilesWithAjax,
             ajaxHeaders
         );
+
+        if (xMod === numTiles.x - 1) {
+            tile.isRightMost = true;
+        }
+
+        if (yMod === numTiles.y - 1) {
+            tile.isBottomMost = true;
+        }
+
+        tilesMatrix[ level ][ x ][ y ] = tile;
     }
 
     tile = tilesMatrix[ level ][ x ][ y ];
@@ -1602,6 +1612,14 @@ function positionTile( tile, overlap, viewport, viewportCenter, levelVisibility,
         sizeC = sizeC.plus( new $.Point( 1, 1 ) );
     }
 
+    if (tile.isRightMost && tiledImage.wrapHorizontal) {
+        sizeC.x += 0.75; // Otherwise Firefox and Safari show seams
+    }
+
+    if (tile.isBottomMost && tiledImage.wrapVertical) {
+        sizeC.y += 0.75; // Otherwise Firefox and Safari show seams
+    }
+
     tile.position   = positionC;
     tile.size       = sizeC;
     tile.squaredDistance   = tileSquaredDistance;
@@ -1805,15 +1823,19 @@ function compareTiles( previousBest, tile ) {
  * @param {OpenSeadragon.Tile[]} lastDrawn - An unordered list of Tiles drawn last frame.
  */
 function drawTiles( tiledImage, lastDrawn ) {
-    if (tiledImage.opacity === 0 || lastDrawn.length === 0) {
+    if (tiledImage.opacity === 0 || (lastDrawn.length === 0 && !tiledImage.placeholderFillStyle)) {
         return;
     }
-    var tile = lastDrawn[0];
 
-    var useSketch = tiledImage.opacity < 1 ||
+    var tile = lastDrawn[0];
+    var useSketch;
+
+    if (tile) {
+        useSketch = tiledImage.opacity < 1 ||
             (tiledImage.compositeOperation &&
                 tiledImage.compositeOperation !== 'source-over') ||
             (!tiledImage._isBottomItem() && tile._hasTransparencyChannel());
+    }
 
     var sketchScale;
     var sketchTranslate;

src/tilesource.js

@@ -360,7 +360,8 @@ $.TileSource.prototype = {
         if (point.x >= 1) {
             x = this.getNumTiles(level).x - 1;
         }
-        if (point.y >= 1 / this.aspectRatio) {
+        var EPSILON = 1e-16;
+        if (point.y >= 1 / this.aspectRatio - EPSILON) {
             y = this.getNumTiles(level).y - 1;
         }
 

src/viewer.js

@@ -2611,16 +2611,14 @@ function onCanvasClick( event ) {
 function onCanvasDblClick( event ) {
     var gestureSettings;
 
-    if ( !event.preventDefaultAction && this.viewport ) {
+    var canvasDblClickEventArgs = {
-        gestureSettings = this.gestureSettingsByDeviceType( event.pointerType );
+        tracker: event.eventSource,
-        if ( gestureSettings.dblClickToZoom ) {
+        position: event.position,
-            this.viewport.zoomBy(
+        shift: event.shift,
-                event.shift ? 1.0 / this.zoomPerClick : this.zoomPerClick,
+        originalEvent: event.originalEvent,
-                this.viewport.pointFromPixel( event.position, true )
+        preventDefaultAction: event.preventDefaultAction
-            );
+    };
-            this.viewport.applyConstraints();
+
-        }
-    }
     /**
      * Raised when a double mouse press/release or touch/remove occurs on the {@link OpenSeadragon.Viewer#canvas} element.
      *
@@ -2632,14 +2630,21 @@ function onCanvasDblClick( event ) {
      * @property {OpenSeadragon.Point} position - The position of the event relative to the tracked element.
      * @property {Boolean} shift - True if the shift key was pressed during this event.
      * @property {Object} originalEvent - The original DOM event.
+     * @property {Boolean} preventDefaultAction - Set to true to prevent default double tap to zoom behaviour. Default: false.
      * @property {?Object} userData - Arbitrary subscriber-defined object.
      */
-    this.raiseEvent( 'canvas-double-click', {
+    this.raiseEvent( 'canvas-double-click', canvasDblClickEventArgs);
-        tracker: event.eventSource,
+
-        position: event.position,
+    if ( !canvasDblClickEventArgs.preventDefaultAction && this.viewport ) {
-        shift: event.shift,
+        gestureSettings = this.gestureSettingsByDeviceType( event.pointerType );
-        originalEvent: event.originalEvent
+        if ( gestureSettings.dblClickToZoom ) {
-    });
+            this.viewport.zoomBy(
+                event.shift ? 1.0 / this.zoomPerClick : this.zoomPerClick,
+                this.viewport.pointFromPixel( event.position, true )
+            );
+            this.viewport.applyConstraints();
+        }
+    }
 }
 
 function onCanvasDrag( event ) {
@@ -2655,6 +2660,7 @@ function onCanvasDrag( event ) {
         originalEvent: event.originalEvent,
         preventDefaultAction: event.preventDefaultAction
     };
+
     /**
      * Raised when a mouse or touch drag operation occurs on the {@link OpenSeadragon.Viewer#canvas} element.
      *
@@ -2674,7 +2680,7 @@ function onCanvasDrag( event ) {
      */
     this.raiseEvent( 'canvas-drag', canvasDragEventArgs);
 
-    if ( !event.preventDefaultAction && this.viewport ) {
+    if ( !canvasDragEventArgs.preventDefaultAction && this.viewport ) {
         gestureSettings = this.gestureSettingsByDeviceType( event.pointerType );
         if( !this.panHorizontal ){
             event.delta.x = 0;

test/modules/events.js

@@ -833,6 +833,79 @@
         viewer.open('/test/data/testpattern.dzi');
     });
 
+    // ----------
+    asyncTest('Viewer: preventDefaultAction in dblClickHandler', function() {
+        var tracker = viewer.innerTracker;
+        var epsilon = 0.0000001;
+
+        function simulateDblTap() {
+            var touches = [];
+            TouchUtil.reset();
+
+            touches.push(TouchUtil.start([0,0]));
+            TouchUtil.end( touches[0] );
+            touches.push(TouchUtil.start([0,0]));
+            TouchUtil.end( touches[1] );
+        }
+
+        var onOpen = function() {
+            viewer.removeHandler('open', onOpen);
+
+            var originalZoom = viewer.viewport.getZoom();
+
+            var origDblClickHandler = tracker.dblClickHandler;
+            tracker.dblClickHandler = function(event) {
+                event.preventDefaultAction = true;
+                return origDblClickHandler(event);
+            };
+
+            TouchUtil.initTracker(tracker);
+            simulateDblTap();
+
+            var zoom = viewer.viewport.getZoom();
+            Util.assessNumericValue(originalZoom, zoom, epsilon,
+                "Zoom on double tap should be prevented");
+
+            // Reset event handler to original
+            tracker.dblClickHandler = origDblClickHandler;
+
+            simulateDblTap();
+            originalZoom = originalZoom * viewer.zoomPerClick;
+
+            var zoom = viewer.viewport.getZoom();
+            Util.assessNumericValue(originalZoom, zoom, epsilon,
+                "Zoom on double tap should not be prevented");
+
+
+            var dblClickHandler = function(event) {
+                event.preventDefaultAction = true;
+            }
+
+            viewer.addHandler('canvas-double-click', dblClickHandler);
+
+            var zoom = viewer.viewport.getZoom();
+            Util.assessNumericValue(originalZoom, zoom, epsilon,
+                "Zoom on double tap should be prevented");
+
+            // Remove custom event handler
+            viewer.removeHandler('canvas-double-click', dblClickHandler);
+
+            simulateDblTap();
+            originalZoom = originalZoom * viewer.zoomPerClick;
+
+            var zoom = viewer.viewport.getZoom();
+            Util.assessNumericValue(originalZoom, zoom, epsilon,
+                "Zoom on double tap should not be prevented");
+
+            TouchUtil.resetTracker(tracker);
+            viewer.close();
+            start();
+        };
+
+        viewer.addHandler('open', onOpen);
+        viewer.open('/test/data/testpattern.dzi');
+    });
+
     // ----------
     asyncTest( 'EventSource/MouseTracker/Viewer: event.originalEvent event.userData canvas-drag canvas-drag-end canvas-release canvas-click', function () {
         var $canvas = $( viewer.element ).find( '.openseadragon-canvas' ).not( '.navigator .openseadragon-canvas' ),

test/modules/tilesource.js

@@ -96,6 +96,17 @@
             maxLevel: 0,
         });
         assertTileAtPoint(0, new OpenSeadragon.Point(1, 1009 / 1006), new OpenSeadragon.Point(0, 0));
+
+        // Test for issue #1276
+        tileSource = new OpenSeadragon.TileSource({
+            width: 4036,
+            height: 1239,
+            tileWidth: 4036,
+            tileHeight: 1239,
+            tileOverlap: 0,
+            maxLevel: 0,
+        });
+        assertTileAtPoint(0, new OpenSeadragon.Point(1, 1239 / 4036), new OpenSeadragon.Point(0, 0));
     });
 
 }());