From b5a9116a0bf2335bd6302c87d35271f8ffbf85a1 Mon Sep 17 00:00:00 2001
From: Ian Gilman <ian@iangilman.com>
Date: Wed, 5 Nov 2014 16:39:35 -0800
Subject: [PATCH] Fixed rotation with multiple images

---
 src/tiledimage.js             | 29 ++++++++++++-----------------
 test/demo/collections/main.js |  4 ++--
 2 files changed, 14 insertions(+), 19 deletions(-)

diff --git a/src/tiledimage.js b/src/tiledimage.js
index 8079b375..c8ad9d93 100644
--- a/src/tiledimage.js
+++ b/src/tiledimage.js
@@ -195,8 +195,6 @@ function updateViewport( tiledImage ) {
         haveDrawn       = false,
         currentTime     = $.now(),
         viewportBounds  = tiledImage.viewport.getBoundsWithMargins( true ),
-        viewportTL      = viewportBounds.getTopLeft(),
-        viewportBR      = viewportBounds.getBottomRight(),
         zeroRatioC      = tiledImage.viewport.deltaPixelsFromPoints(
             tiledImage.source.getPixelRatio( 0 ),
             true
@@ -223,10 +221,8 @@ function updateViewport( tiledImage ) {
         levelOpacity,
         levelVisibility;
 
-    viewportTL.x -= tiledImage._worldX;
-    viewportTL.y -= tiledImage._worldY;
-    viewportBR.x -= tiledImage._worldX;
-    viewportBR.y -= tiledImage._worldY;
+    viewportBounds.x -= tiledImage._worldX;
+    viewportBounds.y -= tiledImage._worldY;
 
     // Reset tile's internal drawn state
     while ( tiledImage.lastDrawn.length > 0 ) {
@@ -236,27 +232,25 @@ function updateViewport( tiledImage ) {
 
     //Change bounds for rotation
     if (degrees === 90 || degrees === 270) {
-        var rotatedBounds = viewportBounds.rotate( degrees );
-        viewportTL = rotatedBounds.getTopLeft();
-        viewportBR = rotatedBounds.getBottomRight();
-    } else if (degrees !== 0) {
+        viewportBounds = viewportBounds.rotate( degrees );
+    } else if (degrees !== 0 && degrees !== 180) {
         // This is just an approximation.
         var orthBounds = viewportBounds.rotate(90);
         viewportBounds.x -= orthBounds.width / 2;
         viewportBounds.y -= orthBounds.height / 2;
         viewportBounds.width += orthBounds.width;
         viewportBounds.height += orthBounds.height;
-        viewportTL = viewportBounds.getTopLeft();
-        viewportBR = viewportBounds.getBottomRight();
     }
 
+    var viewportTL = viewportBounds.getTopLeft();
+    var viewportBR = viewportBounds.getBottomRight();
+
     //Don't draw if completely outside of the viewport
-    if  ( !tiledImage.wrapHorizontal &&
-        ( viewportBR.x < 0 || viewportTL.x > tiledImage._worldWidth ) ) {
+    if  ( !tiledImage.wrapHorizontal && (viewportBR.x < 0 || viewportTL.x > tiledImage._worldWidth ) ) {
         return;
-    } else if
-        ( !tiledImage.wrapVertical &&
-        ( viewportBR.y < 0 || viewportTL.y > tiledImage._worldHeight ) ) {
+    }
+
+    if ( !tiledImage.wrapVertical && ( viewportBR.y < 0 || viewportTL.y > tiledImage._worldHeight ) ) {
         return;
     }
 
@@ -265,6 +259,7 @@ function updateViewport( tiledImage ) {
         viewportTL.x = Math.max( viewportTL.x, 0 );
         viewportBR.x = Math.min( viewportBR.x, tiledImage._worldWidth );
     }
+
     if ( !tiledImage.wrapVertical ) {
         viewportTL.y = Math.max( viewportTL.y, 0 );
         viewportBR.y = Math.min( viewportBR.y, tiledImage._worldHeight );
diff --git a/test/demo/collections/main.js b/test/demo/collections/main.js
index af83c343..e9cde3d3 100644
--- a/test/demo/collections/main.js
+++ b/test/demo/collections/main.js
@@ -13,7 +13,7 @@
             var margins;
 
             var config = {
-                debugMode: true,
+                // debugMode: true,
                 zoomPerScroll: 1.02,
                 showNavigator: testNavigator,
                 // wrapHorizontal: true,
@@ -86,7 +86,7 @@
             }
 
             // this.crossTest3();
-            this.basicTest();
+            this.gridTest();
         },
 
         // ----------