Merge pull request #1452 from girder/faster-style-swap

Swap styles faster in the frame viewer
girder · Jan 31, 2024 · 9cd545d · 9cd545d
2 parents 90a3a26 + e92c3e0
commit 9cd545d
Show file tree

Hide file tree

Showing 2 changed files with 19 additions and 3 deletions.
diff --git a/CHANGELOG.md b/CHANGELOG.md
@@ -7,6 +7,7 @@
 - Bypass some scaling code when compositing multi sources ([#1447](../../pull/1447), [#1449](../../pull/1449))
 - Do not create needless alpha bands in the multi source ([#1451](../../pull/1451))
 - Infer DICOM file size, when possible ([#1448](../../pull/1448))
+- Swap styles faster in the frame viewer ([#1452](../../pull/1452))
 
 ## 1.27.1
 

diff --git a/girder/girder_large_image/web_client/views/imageViewerWidget/geojs.js b/girder/girder_large_image/web_client/views/imageViewerWidget/geojs.js
@@ -175,10 +175,25 @@ var GeojsImageViewerWidget = ImageViewerWidget.extend({
         frame = frame || 0;
         this._nextframe = frame;
         this._nextstyle = style;
-        if ((frame !== this._frame || style !== this._style) && !this._updating) {
+        if ((frame !== this._frame || style !== this._style)) {
             this._frame = frame;
             this._style = style;
             this.trigger('g:imageFrameChanging', this, frame);
+            if (this._updating) {
+                this._layer2.url(this.getFrameAndUrl().url);
+                if (this._style === undefined) {
+                    if (this._layer2.setFrameQuad) {
+                        this._layer2.setFrameQuad(frame);
+                    }
+                    this._layer2.frame = frame;
+                } else {
+                    if (this._layer2.setFrameQuad) {
+                        this._layer2.setFrameQuad(undefined);
+                    }
+                    this._layer2.frame = undefined;
+                }
+                return;
+            }
             const quadLoaded = ((this._layer.setFrameQuad || {}).status || {}).loaded;
             if (quadLoaded && this._style === undefined) {
                 this._layer.url(this.getFrameAndUrl().url);
@@ -194,7 +209,7 @@ var GeojsImageViewerWidget = ImageViewerWidget.extend({
                 this._layer.frame = undefined;
             }
             this._updating = true;
-            this.viewer.onIdle(() => {
+            this._layer.onIdle(() => {
                 this._layer2.url(this.getFrameAndUrl().url);
                 if (this._style === undefined) {
                     if (this._layer2.setFrameQuad) {
@@ -207,7 +222,7 @@ var GeojsImageViewerWidget = ImageViewerWidget.extend({
                     }
                     this._layer2.frame = undefined;
                 }
-                this.viewer.onIdle(() => {
+                this._layer2.onIdle(() => {
                     if (this._layer.zIndex() > this._layer2.zIndex()) {
                         this._layer.moveDown();
                         if (!this._layer.options.keepLower) {