From 1b44de3b68d254bc5a8773f3b9e6e99956f7bf23 Mon Sep 17 00:00:00 2001
From: Tom <tmpearce@gmail.com>
Date: Wed, 31 Jan 2024 15:37:09 -0500
Subject: [PATCH 1/4] Stop tiles from loading if opacity of tiled image is 0

---
 src/tiledimage.js | 2 +-
 1 file changed, 1 insertion(+), 1 deletion(-)

diff --git a/src/tiledimage.js b/src/tiledimage.js
index 0b1862a7..cb7dd778 100644
--- a/src/tiledimage.js
+++ b/src/tiledimage.js
@@ -1434,7 +1434,7 @@ $.extend($.TiledImage.prototype, $.EventSource.prototype, /** @lends OpenSeadrag
         let lowestLevel = tiles.length ? tiles[0].level : 0;
 
         let drawArea = this.getDrawArea();
-        if(!drawArea){
+        if(!drawArea || this._opacity === 0){
             return;
         }
 

From 84a55968ee2c5e0c886458b1c51565123d33e4ed Mon Sep 17 00:00:00 2001
From: Tom <tmpearce@gmail.com>
Date: Wed, 31 Jan 2024 15:40:47 -0500
Subject: [PATCH 2/4] Allow preloading of tiles for zero opacity tiled images

---
 src/tiledimage.js | 2 +-
 1 file changed, 1 insertion(+), 1 deletion(-)

diff --git a/src/tiledimage.js b/src/tiledimage.js
index cb7dd778..9b202819 100644
--- a/src/tiledimage.js
+++ b/src/tiledimage.js
@@ -1434,7 +1434,7 @@ $.extend($.TiledImage.prototype, $.EventSource.prototype, /** @lends OpenSeadrag
         let lowestLevel = tiles.length ? tiles[0].level : 0;
 
         let drawArea = this.getDrawArea();
-        if(!drawArea || this._opacity === 0){
+        if(!drawArea || (this._opacity === 0 && !this._preload)){
             return;
         }
 

From 921171ed2bb1afe3529426a7cdc8b7a73e62636b Mon Sep 17 00:00:00 2001
From: Tom <tmpearce@gmail.com>
Date: Thu, 1 Feb 2024 08:47:03 -0500
Subject: [PATCH 3/4] move logic about zero opacity case into getDrawArea

---
 src/tiledimage.js             | 7 ++++++-
 test/demo/drawercomparison.js | 2 +-
 2 files changed, 7 insertions(+), 2 deletions(-)

diff --git a/src/tiledimage.js b/src/tiledimage.js
index 9b202819..a1c3054b 100644
--- a/src/tiledimage.js
+++ b/src/tiledimage.js
@@ -1020,9 +1020,14 @@ $.extend($.TiledImage.prototype, $.EventSource.prototype, /** @lends OpenSeadrag
     /**
      * Get the region of this tiled image that falls within the viewport.
      * @returns {OpenSeadragon.Rect} the region of this tiled image that falls within the viewport.
+     * Returns false for images with opacity==0 unless preload==true
      */
     getDrawArea: function(){
 
+        if( this._opacity === 0 && !this._preload){
+            return false;
+        }
+
         var drawArea = this._viewportToTiledImageRectangle(
             this.viewport.getBoundsWithMargins(true));
 
@@ -1434,7 +1439,7 @@ $.extend($.TiledImage.prototype, $.EventSource.prototype, /** @lends OpenSeadrag
         let lowestLevel = tiles.length ? tiles[0].level : 0;
 
         let drawArea = this.getDrawArea();
-        if(!drawArea || (this._opacity === 0 && !this._preload)){
+        if(!drawArea){
             return;
         }
 
diff --git a/test/demo/drawercomparison.js b/test/demo/drawercomparison.js
index 96793915..bd95deaa 100644
--- a/test/demo/drawercomparison.js
+++ b/test/demo/drawercomparison.js
@@ -1,5 +1,5 @@
 const sources = {
-    "rainbow":"../data/testpattern.dzi",
+    "rainbow": "../data/testpattern.dzi",
     "leaves":"../data/iiif_2_0_sizes/info.json",
     "bblue":{
         type:'image',

From 68623ace26a90470eac969d8b42638f479775c6a Mon Sep 17 00:00:00 2001
From: Tom <tmpearce@gmail.com>
Date: Thu, 1 Feb 2024 10:46:45 -0500
Subject: [PATCH 4/4] skip drawing zero-opacity images for webgl drawer. remove
 checks for preload in html and canvas drawers since that is done in
 tiledimage.

---
 src/canvasdrawer.js           | 2 +-
 src/htmldrawer.js             | 2 +-
 src/webgldrawer.js            | 2 +-
 test/demo/drawercomparison.js | 2 +-
 4 files changed, 4 insertions(+), 4 deletions(-)

diff --git a/src/canvasdrawer.js b/src/canvasdrawer.js
index a637fb39..37b8c3bb 100644
--- a/src/canvasdrawer.js
+++ b/src/canvasdrawer.js
@@ -102,7 +102,7 @@ class CanvasDrawer extends $.DrawerBase{
         this._prepareNewFrame(); // prepare to draw a new frame
 
         for(const tiledImage of tiledImages){
-            if (tiledImage.opacity !== 0 || tiledImage._preload) {
+            if (tiledImage.opacity !== 0) {
                 this._drawTiles(tiledImage);
             }
         }
diff --git a/src/htmldrawer.js b/src/htmldrawer.js
index a9030702..6e154095 100644
--- a/src/htmldrawer.js
+++ b/src/htmldrawer.js
@@ -89,7 +89,7 @@ class HTMLDrawer extends $.DrawerBase{
         var _this = this;
         this._prepareNewFrame(); // prepare to draw a new frame
         tiledImages.forEach(function(tiledImage){
-            if (tiledImage.opacity !== 0 || tiledImage._preload) {
+            if (tiledImage.opacity !== 0) {
                 _this._drawTiles(tiledImage);
             }
         });
diff --git a/src/webgldrawer.js b/src/webgldrawer.js
index a3cda706..046c33e4 100644
--- a/src/webgldrawer.js
+++ b/src/webgldrawer.js
@@ -222,7 +222,7 @@
 
                 let tilesToDraw = tiledImage.getTilesToDraw();
 
-                if(tilesToDraw.length === 0){
+                if(tilesToDraw.length === 0 || tiledImage.getOpacity() === 0){
                     return;
                 }
                 let firstTile = tilesToDraw[0];
diff --git a/test/demo/drawercomparison.js b/test/demo/drawercomparison.js
index bd95deaa..96793915 100644
--- a/test/demo/drawercomparison.js
+++ b/test/demo/drawercomparison.js
@@ -1,5 +1,5 @@
 const sources = {
-    "rainbow": "../data/testpattern.dzi",
+    "rainbow":"../data/testpattern.dzi",
     "leaves":"../data/iiif_2_0_sizes/info.json",
     "bblue":{
         type:'image',