From e508a59ee350f04e08932c61ce14360dd98d6142 Mon Sep 17 00:00:00 2001
From: Evren Ozkan <evren217@gmail.com>
Date: Wed, 19 Dec 2018 10:29:45 -0500
Subject: [PATCH] fix(thumbnails): Prevent caching for thumbnail images by
 using canvas element (thanks @jasonklotzer)

---
 .../imageThumbnail/imageThumbnail.html        |  2 +-
 .../imageThumbnail/imageThumbnail.js          | 20 ++++++-------------
 2 files changed, 7 insertions(+), 15 deletions(-)

diff --git a/Packages/ohif-viewerbase/client/components/studyBrowser/imageThumbnail/imageThumbnail.html b/Packages/ohif-viewerbase/client/components/studyBrowser/imageThumbnail/imageThumbnail.html
index a64431dcb..5f9386a58 100644
--- a/Packages/ohif-viewerbase/client/components/studyBrowser/imageThumbnail/imageThumbnail.html
+++ b/Packages/ohif-viewerbase/client/components/studyBrowser/imageThumbnail/imageThumbnail.html
@@ -1,7 +1,7 @@
 <template name="imageThumbnail">
     <div class="imageThumbnail">
         <div class="imageThumbnailCanvas">
-            <img class="static-image"/>
+            <canvas class="static-image"></canvas>
         </div>
         <div class="imageThumbnailLoadingIndicator
                     thumbnailLoadingIndicator
diff --git a/Packages/ohif-viewerbase/client/components/studyBrowser/imageThumbnail/imageThumbnail.js b/Packages/ohif-viewerbase/client/components/studyBrowser/imageThumbnail/imageThumbnail.js
index 3d29b3e04..0831da598 100644
--- a/Packages/ohif-viewerbase/client/components/studyBrowser/imageThumbnail/imageThumbnail.js
+++ b/Packages/ohif-viewerbase/client/components/studyBrowser/imageThumbnail/imageThumbnail.js
@@ -57,28 +57,20 @@ Template.imageThumbnail.onRendered(() => {
     const $thumbnailElement = $parent.find('.imageThumbnailCanvas');
 
     instance.refreshImage = () => {
-        const imageElement = $thumbnailElement.find('img').get(0);
+        const staticImageCanvasElement = $thumbnailElement.find('canvas').get(0);
 
         // Activate the loading state
         instance.isLoading.set(true);
         instance.hasLoadingError.set(false);
 
-        // Clear the previous image
-        imageElement.removeAttribute('src');
-
         // Define a handler for success on image load
         const loadSuccess = image => {
-            // This is an off-screen canvas. It's used to get dataURL images by using
-            // cornerstone.renderToCanvas function.
-            const canvasElement = document.createElement('canvas');
-            canvasElement.width = 193;
-            canvasElement.height = 123;
+            staticImageCanvasElement.width = 193;
+            staticImageCanvasElement.height = 123;
 
-            // Render the image to canvas to be able to get its dataURL
-            renderAsync(canvasElement, image).then(() => {
-              instance.isLoading.set(false);
-
-              imageElement.src = canvasElement.toDataURL('image/jpeg', 1);
+            // Render the image to the static image canvas
+            renderAsync(staticImageCanvasElement, image).then(() => {
+                instance.isLoading.set(false);
             });
         };