diff --git a/src/drawer.js b/src/drawer.js index cf86b61b..614e6cbe 100644 --- a/src/drawer.js +++ b/src/drawer.js @@ -508,9 +508,9 @@ $.Drawer.prototype = { tiledImage._getRotationPoint(true), true) }); } - if (tiledImage.viewport.degrees == 0 && tiledImage.getRotation(true) % 360 == 0){ - if((tiledImage._drawer.viewer.viewport.getFlip() && !tiledImage.getFlip()) || (!tiledImage._drawer.viewer.viewport.getFlip() && tiledImage.getFlip()) ) { - tiledImage._drawer._flip({}); + if (tiledImage.viewport.degrees === 0 && tiledImage.getRotation(true) % 360 === 0){ + if(tiledImage._drawer.viewer.viewport.getFlip()) { + tiledImage._drawer._flip(); } } @@ -579,9 +579,9 @@ $.Drawer.prototype = { this._restoreRotationChanges(); } - if (tiledImage.viewport.degrees == 0 && tiledImage.getRotation(true) % 360 == 0){ - if((tiledImage._drawer.viewer.viewport.getFlip() && !tiledImage.getFlip()) || (!tiledImage._drawer.viewer.viewport.getFlip() && tiledImage.getFlip()) ) { - tiledImage._drawer._flip({}); + if (tiledImage.viewport.degrees === 0 && tiledImage.getRotation(true) % 360 === 0){ + if(tiledImage._drawer.viewer.viewport.getFlip()) { + tiledImage._drawer._flip(); } } @@ -653,9 +653,7 @@ $.Drawer.prototype = { context.save(); context.translate(point.x, point.y); - // If viewport and tiledImage are flipped, it would draw the image without flipping - // This if sentence is intended to represent a logical XOR - if((!this.viewer.viewport.getFlip() && this.viewer.world._items[0].getFlip()) || (this.viewer.viewport.getFlip() && !this.viewer.world._items[0].getFlip())){ + if(this.viewer.viewport.flipped){ context.rotate(Math.PI / 180 * -options.degrees); context.scale(-1, 1); } else{ diff --git a/src/navigator.js b/src/navigator.js index 4b2018fb..115d052d 100644 --- a/src/navigator.js +++ b/src/navigator.js @@ -284,8 +284,7 @@ $.extend( $.Navigator.prototype, $.EventSource.prototype, $.Viewer.prototype, /* setFlip: function(state) { this.viewport.setFlip(state); - var flip = ((this.viewport.getFlip() && this.viewer.world._items[0] && !this.viewer.world._items[0].getFlip()) || (!this.viewport.getFlip() && this.viewer.world._items[0] && this.viewer.world._items[0].getFlip())); - this.setDisplayTransform(flip ? "scale(-1,1)" : "scale(1,1)"); + this.setDisplayTransform(this.viewer.viewport.getFlip() ? "scale(-1,1)" : "scale(1,1)"); return this; }, @@ -456,7 +455,7 @@ function onCanvasClick( event ) { this.viewer.raiseEvent('navigator-click', canvasClickEventArgs); if ( !canvasClickEventArgs.preventDefaultAction && event.quick && this.viewer.viewport && (this.panVertical || this.panHorizontal)) { - if((this.viewer.viewport.getFlip() && !this.world._items[0].getFlip()) || (!this.viewer.viewport.getFlip() && this.world._items[0].getFlip())) { + if(this.viewer.viewport.flipped) { event.position.x = this.viewport.getContainerSize().x - event.position.x; } var target = this.viewport.pointFromPixel(event.position); @@ -516,7 +515,7 @@ function onCanvasDrag( event ) { event.delta.y = 0; } - if((this.viewer.viewport.getFlip() && !this.world._items[0].getFlip()) || (!this.viewer.viewport.getFlip() && this.world._items[0].getFlip())) { + if(this.viewer.viewport.flipped){ event.delta.x = -event.delta.x; } diff --git a/src/tiledimage.js b/src/tiledimage.js index 6501751a..abe8c2da 100644 --- a/src/tiledimage.js +++ b/src/tiledimage.js @@ -52,7 +52,6 @@ * @param {Number} [options.y=0] - Top position, in viewport coordinates. * @param {Number} [options.width=1] - Width, in viewport coordinates. * @param {Number} [options.height] - Height, in viewport coordinates. - * @param {Boolean} [options.flipped=false] - Whether to draw tiled image flipped. * @param {OpenSeadragon.Rect} [options.fitBounds] The bounds in viewport coordinates * to fit the image into. If specified, x, y, width and height get ignored. * @param {OpenSeadragon.Placement} [options.fitBoundsPlacement=OpenSeadragon.Placement.CENTER] @@ -210,9 +209,6 @@ $.TiledImage = function( options ) { animationTime: this.animationTime }); - this.flipped = options.flipped; - delete options.flipped; - this._updateForScale(); if (fitBounds) { @@ -860,16 +856,6 @@ $.extend($.TiledImage.prototype, $.EventSource.prototype, /** @lends OpenSeadrag this._raiseBoundsChange(); }, - /** - * Get flip state stored on tiledImage. - * @function - * @return {Boolean} Flip state. - */ - getFlip: function() { - return this.flipped; - }, - - /** * Get the point around which this tiled image is rotated * @private @@ -1689,7 +1675,7 @@ function blendTile( tiledImage, tile, x, y, level, levelOpacity, currentTime ){ tiledImage.lastDrawn.push( tile ); - if ( opacity == 1 ) { + if ( opacity === 1 ) { setCoverage( tiledImage.coverage, level, x, y, true ); tiledImage._hasOpaqueTile = true; } else if ( deltaTime < blendTimeMillis ) { @@ -1894,7 +1880,7 @@ function drawTiles( tiledImage, lastDrawn ) { .getIntegerBoundingBox() .times($.pixelDensityRatio); - if((tiledImage._drawer.viewer.viewport.getFlip() && !tiledImage.getFlip()) || (!tiledImage._drawer.viewer.viewport.getFlip() && tiledImage.getFlip()) ) { + if(tiledImage._drawer.viewer.viewport.getFlip()) { if (tiledImage.viewport.degrees !== 0 || tiledImage.getRotation(true) % 360 !== 0){ bounds.x = tiledImage._drawer.viewer.container.clientWidth - (bounds.x + bounds.width); } @@ -1921,9 +1907,9 @@ function drawTiles( tiledImage, lastDrawn ) { }); } - if (tiledImage.viewport.degrees == 0 && tiledImage.getRotation(true) % 360 == 0){ - if((tiledImage._drawer.viewer.viewport.getFlip() && !tiledImage.getFlip()) || (!tiledImage._drawer.viewer.viewport.getFlip() && tiledImage.getFlip()) ) { - tiledImage._drawer._flip({}); + if (tiledImage.viewport.degrees === 0 && tiledImage.getRotation(true) % 360 === 0){ + if(tiledImage._drawer.viewer.viewport.getFlip()) { + tiledImage._drawer._flip(); } } } @@ -2038,9 +2024,9 @@ function drawTiles( tiledImage, lastDrawn ) { } if (!sketchScale) { - if (tiledImage.viewport.degrees == 0 && tiledImage.getRotation(true) % 360 == 0){ - if((tiledImage._drawer.viewer.viewport.getFlip() && !tiledImage.getFlip()) || (!tiledImage._drawer.viewer.viewport.getFlip() && tiledImage.getFlip()) ) { - tiledImage._drawer._flip({}); + if (tiledImage.viewport.degrees === 0 && tiledImage.getRotation(true) % 360 === 0){ + if(tiledImage._drawer.viewer.viewport.getFlip()) { + tiledImage._drawer._flip(); } } } diff --git a/src/viewer.js b/src/viewer.js index ac3701b4..9be3e7fa 100644 --- a/src/viewer.js +++ b/src/viewer.js @@ -1435,7 +1435,6 @@ $.extend( $.Viewer.prototype, $.EventSource.prototype, $.ControlDock.prototype, opacity: queueItem.options.opacity, preload: queueItem.options.preload, degrees: queueItem.options.degrees, - flipped: queueItem.options.flipped, compositeOperation: queueItem.options.compositeOperation, springStiffness: _this.springStiffness, animationTime: _this.animationTime, @@ -2642,7 +2641,7 @@ function onCanvasKeyPress( event ) { } return false; case 114: //r - clockwise rotation - if((this.viewport.getFlip() && !this.world._items[0].getFlip()) || (!this.viewport.getFlip() && this.world._items[0].getFlip())){ + if(this.viewport.flipped){ this.viewport.setRotation($.positiveModulo(this.viewport.degrees - this.rotationIncrement, 360)); } else{ this.viewport.setRotation($.positiveModulo(this.viewport.degrees + this.rotationIncrement, 360)); @@ -2650,7 +2649,7 @@ function onCanvasKeyPress( event ) { this.viewport.applyConstraints(); return false; case 82: //R - counterclockwise rotation - if((this.viewport.getFlip() && !this.world._items[0].getFlip()) || (!this.viewport.getFlip() && this.world._items[0].getFlip())){ + if(this.viewport.flipped){ this.viewport.setRotation($.positiveModulo(this.viewport.degrees + this.rotationIncrement, 360)); } else{ this.viewport.setRotation($.positiveModulo(this.viewport.degrees - this.rotationIncrement, 360)); @@ -2678,7 +2677,7 @@ function onCanvasClick( event ) { if ( !haveKeyboardFocus ) { this.canvas.focus(); } - if((this.viewport.getFlip() && !this.world._items[0].getFlip()) || (!this.viewport.getFlip() && this.world._items[0].getFlip())){ + if(this.viewport.flipped){ event.position.x = this.viewport.getContainerSize().x - event.position.x; } @@ -2800,7 +2799,7 @@ function onCanvasDrag( event ) { if( !this.panVertical ){ event.delta.y = 0; } - if((this.viewport.getFlip() && !this.world._items[0].getFlip()) || (!this.viewport.getFlip() && this.world._items[0].getFlip())){ + if(this.viewport.flipped){ event.delta.x = -event.delta.x; } @@ -3128,7 +3127,7 @@ function onCanvasScroll( event ) { if (deltaScrollTime > this.minScrollDeltaTime) { this._lastScrollTime = thisScrollTime; - if((this.viewport.getFlip() && !this.world._items[0].getFlip()) || (!this.viewport.getFlip() && this.world._items[0].getFlip())){ + if(this.viewport.flipped){ event.position.x = this.viewport.getContainerSize().x - event.position.x; } @@ -3366,10 +3365,6 @@ function updateOnce( viewer ) { THIS[ viewer.hash ].animating = animated; - // Update navigator flip transformation - if (viewer.navigator && viewer.viewport != undefined){ - viewer.navigator.setFlip(viewer.viewport.getFlip()); - } //viewer.profiler.endUpdate(); } @@ -3499,7 +3494,7 @@ function onRotateLeft() { if ( this.viewport ) { var currRotation = this.viewport.getRotation(); - if((this.viewport.getFlip() && !this.world._items[0].getFlip()) || (!this.viewport.getFlip() && this.world._items[0].getFlip())){ + if ( this.viewport.flipped ){ currRotation = $.positiveModulo(currRotation + this.rotationIncrement, 360); } else { currRotation = $.positiveModulo(currRotation - this.rotationIncrement, 360); @@ -3512,7 +3507,7 @@ function onRotateRight() { if ( this.viewport ) { var currRotation = this.viewport.getRotation(); - if((this.viewport.getFlip() && !this.world._items[0].getFlip()) || (!this.viewport.getFlip() && this.world._items[0].getFlip())){ + if ( this.viewport.flipped ){ currRotation = $.positiveModulo(currRotation - this.rotationIncrement, 360); } else { currRotation = $.positiveModulo(currRotation + this.rotationIncrement, 360); diff --git a/src/viewport.js b/src/viewport.js index 61cee041..07c941c6 100644 --- a/src/viewport.js +++ b/src/viewport.js @@ -1552,8 +1552,7 @@ $.Viewport.prototype = { this.flipped = state; if(this.viewer.navigator){ - var flip = ((this.getFlip() || !this.viewer.world._items[0].getFlip()) || (!this.getFlip() || this.viewer.world._items[0].getFlip())); - this.viewer.navigator.setFlip(flip); + this.viewer.navigator.setFlip(this.getFlip()); } this.viewer.forceRedraw();