Fixes made after first code review of rotation.

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 );
+                if( drawer.viewport.degrees !== 0 ) {
-                tile.drawCanvas( drawer.context );
+                    offsetForRotation( tile, drawer.canvas, drawer.context, drawer.viewport.degrees );
-                restoreRotationChanges( tile, drawer.canvas, drawer.context );
+                    tile.drawCanvas( drawer.context );
+                    restoreRotationChanges( tile, drawer.canvas, drawer.context );
+                } else {
+                    tile.drawCanvas( drawer.context );
+                }
             } else {
                 tile.drawHTML( drawer.canvas );
             }

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 ));

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(

src/point.js

@@ -170,14 +170,8 @@ $.Point.prototype = {
      */
     rotate: function ( degrees, pivot ) {
         var angle = degrees * Math.PI / 180.0,
-            x = $._round(
+            x = Math.cos( angle ) * ( this.x - pivot.x ) - Math.sin( angle ) * ( this.y - pivot.y ) + pivot.x,
-                    Math.cos( angle ) * ( this.x - pivot.x ) -
+            y = Math.sin( angle ) * ( this.x - pivot.x ) + Math.cos( angle ) * ( this.y - pivot.y ) + pivot.y;
-                    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
-                );
         return new $.Point( x, y );
     },
 

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 ) {

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 ));

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.