diff --git a/src/drawer.js b/src/drawer.js index f49b44c5..abc7969d 100644 --- a/src/drawer.js +++ b/src/drawer.js @@ -1203,9 +1203,13 @@ function drawTiles( drawer, lastDrawn ){ if ( USE_CANVAS ) { // TODO do this in a more performant way // specifically, don't save,rotate,restore every time we draw a tile - offsetForRotation( tile, drawer.canvas, drawer.context, drawer.viewport.degrees ); - tile.drawCanvas( drawer.context ); - restoreRotationChanges( tile, drawer.canvas, drawer.context ); + if( drawer.viewport.degrees !== 0 ) { + offsetForRotation( tile, drawer.canvas, drawer.context, drawer.viewport.degrees ); + tile.drawCanvas( drawer.context ); + restoreRotationChanges( tile, drawer.canvas, drawer.context ); + } else { + tile.drawCanvas( drawer.context ); + } } else { tile.drawHTML( drawer.canvas ); } diff --git a/src/openseadragon.js b/src/openseadragon.js index 59554281..e5913772 100644 --- a/src/openseadragon.js +++ b/src/openseadragon.js @@ -1927,23 +1927,4 @@ window.OpenSeadragon = window.OpenSeadragon || function( options ){ throw new Error(message); }; - /** - * http://stackoverflow.com/questions/246193 - * /how-do-i-round-a-number-in-javascript - * @private - * @inner - * @function - * @param {Number} num - * @param {Number} decimals - * @return {Number} - */ - $._round = function ( num, decimals ) { - var coefficient; - - decimals = decimals || 10; - coefficient = Math.pow( 10, decimals ); - - return Math.round( num * coefficient ) / coefficient; - }; - }( OpenSeadragon )); diff --git a/src/overlay.js b/src/overlay.js index 66036c13..f0faf96f 100644 --- a/src/overlay.js +++ b/src/overlay.js @@ -204,7 +204,11 @@ size = size.apply( Math.ceil ); // rotate the position of the overlay - if(this.scales){ + // TODO only rotate overlays if in canvas mode + // TODO replace the size rotation with CSS3 transforms + // TODO add an option to overlays to not rotate with the image + // Currently only rotates position and size + if( degrees !== 0 && this.scales ) { overlayCenter = new $.Point( size.x / 2, size.y / 2 ); position = position.plus( overlayCenter ).rotate( diff --git a/src/point.js b/src/point.js index 0fb43a26..806f9fdb 100644 --- a/src/point.js +++ b/src/point.js @@ -170,14 +170,8 @@ $.Point.prototype = { */ rotate: function ( degrees, pivot ) { var angle = degrees * Math.PI / 180.0, - x = $._round( - Math.cos( angle ) * ( this.x - pivot.x ) - - Math.sin( angle ) * ( this.y - pivot.y ) + pivot.x - ), - y = $._round( - Math.sin( angle ) * ( this.x - pivot.x ) + - Math.cos( angle ) * ( this.y - pivot.y ) + pivot.y - ); + x = Math.cos( angle ) * ( this.x - pivot.x ) - Math.sin( angle ) * ( this.y - pivot.y ) + pivot.x, + y = Math.sin( angle ) * ( this.x - pivot.x ) + Math.cos( angle ) * ( this.y - pivot.y ) + pivot.y; return new $.Point( x, y ); }, diff --git a/src/rectangle.js b/src/rectangle.js index 22dda5ce..32fc20dc 100644 --- a/src/rectangle.js +++ b/src/rectangle.js @@ -176,6 +176,15 @@ $.Rect.prototype = { height = this.height, newTopLeft; + degrees = ( degrees + 360 ) % 360; + if( degrees % 90 !== 0 ) { + throw new Error('Currently only 0, 90, 180, and 270 degrees are supported.'); + } + + if( degrees === 0 ){ + return this; + } + pivot = pivot || this.getCenter(); switch ( degrees ) { diff --git a/src/viewer.js b/src/viewer.js index cd06ce48..0c6f5969 100644 --- a/src/viewer.js +++ b/src/viewer.js @@ -1074,19 +1074,6 @@ $.extend( $.Viewer.prototype, $.EventHandler.prototype, $.ControlDock.prototype, return this; }, - /** - * @function - * @name OpenSeadragon.Viewer.prototype.rotate - * @return {OpenSeadragon.Viewer} Chainable. - */ - rotate: function(clockwise){ - clockwise = clockwise || true; - this.viewport.degrees = ( this.viewport.degrees + (clockwise ? 90 : -90 ) + 360 ) % 360; - //this.raiseEvent( 'rotate', { viewer: this } ); - this.drawer.update(); - return this; - }, - /** * Display a message in the viewport * @function @@ -1709,9 +1696,5 @@ function onNext(){ this.goToPage( next ); } -function onRotate(){ - this.rotate(); -} - }( OpenSeadragon )); diff --git a/src/viewport.js b/src/viewport.js index eec94bae..074011d3 100644 --- a/src/viewport.js +++ b/src/viewport.js @@ -570,6 +570,23 @@ $.Viewport.prototype = { return this; }, + /** + * Currently only supports 90 degree rotation. + * Currently only works with canvas. + * @function + * @name OpenSeadragon.Viewport.prototype.rotate + * @return {OpenSeadragon.Viewport} Chainable. + */ + setRotation: function(degrees){ + degrees = ( degrees + 360 ) % 360; + if(degrees % 90 !== 0){ + throw new Error('Currently only 0, 90, 180, and 270 degrees are supported.'); + } + this.degrees = degrees; + this.viewer.drawer.update(); + return this; + }, + /** * @function * @return {OpenSeadragon.Viewport} Chainable.