fixes (#54)

* Set large initial cacheSize to tile sources

* Improve performance by removing unnecessary offscreen coloring rendering

* Add min/max color function for offscreen rendering/coloring

* Improve performance by handling the channels opacity change at OpenLayer level

* Add FrameOfReferenceUID and ContainerIdentifier checks

Author: Punzo

docs/channel.js.html

@@ -282,7 +282,7 @@ <h1 class="page-title">Source: channel.js</h1>
                 rows
               }
 
-              const rendered = renderingEngine.colorMonochomeImageFrame(frameData)
+              const rendered = renderingEngine.colorMonochromeImageFrame(frameData)
               tile.needToRerender = !rendered
             }
           )
@@ -343,7 +343,7 @@ <h1 class="page-title">Source: channel.js</h1>
                 rows
               }
 
-              const rendered = renderingEngine.colorMonochomeImageFrame(frameData)
+              const rendered = renderingEngine.colorMonochromeImageFrame(frameData)
               tile.needToRerender = !rendered
             }
           ).catch(
@@ -380,7 +380,7 @@ <h1 class="page-title">Source: channel.js</h1>
                     rows
                   }
 
-                  const rendered = renderingEngine.colorMonochomeImageFrame(frameData)
+                  const rendered = renderingEngine.colorMonochromeImageFrame(frameData)
                   tile.needToRerender = !rendered
                 }
               )
@@ -715,7 +715,7 @@ <h1 class="page-title">Source: channel.js</h1>
             rows
           }
 
-          const rendered = this.renderingEngine.colorMonochomeImageFrame(frameData)
+          const rendered = this.renderingEngine.colorMonochromeImageFrame(frameData)
           if (rendered) {
             mapRerender = true
             tile.needToRerender = !rendered

examples/basic/index.html

@@ -60,7 +60,7 @@
       const viewer = new DICOMMicroscopyViewer.api.VLWholeSlideMicroscopyImageViewer({
         client,
         metadata,
-        controls: ['fullscreen', 'overview', 'zoom'],
+        controls: ['overview'],
         retrieveRendered: true
       });
 

examples/blend/index.html

@@ -21,11 +21,13 @@
     <script src="https://unpkg.com/@cornerstonejs/codec-charls/dist/charlsjs.js"></script>
 
     <script src="https://unpkg.com/dicomweb-client"></script>
-    <script src="https://unpkg.com/dicom-microscopy-viewer"></script>
+    <script src="https://unpkg.com/dicom-microscopy-viewer"></script> 
+   
     <!-- enable for testing locally
     <script src="../../node_modules/dicomweb-client/build/dicomweb-client.js"></script>
     <script src="../../build/dicom-microscopy-viewer.js"></script>
     !-->
+
     <script>
     var colorPicker;
     var channelToggle;
@@ -46,7 +48,7 @@
         const thresholdValues = [minValue, 255.];
         const blendingInformation = {
           thresholdValues : thresholdValues,
-          opticalPathID : `15`,
+          opticalPathIdentifier : `15`,
         };
         viewer.setBlendingInformation(blendingInformation);
       }
@@ -59,24 +61,24 @@
         parseInt(hexColor.substr(5, 2), 16) / 255.];
       const blendingInformation = {
         color : color,
-        opticalPathID : `15`,
+        opticalPathIdentifier : `15`,
       };
       viewer.setBlendingInformation(blendingInformation);
     }
 
     function updateChannelToggle() {
-      const opticalPathID = `15`;
+      const OpticalPathIdentifier = `15`;
       if(channelToggle.checked) {
-        viewer.activateOpticalPath(opticalPathID);
-        viewer.showOpticalPath(opticalPathID);
+        viewer.activateOpticalPath(OpticalPathIdentifier);
+        viewer.showOpticalPath(OpticalPathIdentifier);
       } else {
-        viewer.deactivateOpticalPath(opticalPathID);
+        viewer.deactivateOpticalPath(OpticalPathIdentifier);
       }
     }
 
-    const url = 'http://34.68.90.36/';
+    const url = 'http://34.68.90.36/'; 
     const client = new DICOMwebClient.api.DICOMwebClient({url});
-    const studyInstanceUID = '1.3.6.1.4.1.5962.99.1.2103930081.1286074986.1595536829665.3.0';
+    const studyInstanceUID = '1.3.6.1.4.1.5962.99.1.3456320082.756362073.1622659023442.3.0';
     const seriesInstanceUIDOne = '1.3.6.1.4.1.5962.1.1.0.0.0.1595262375.18986.1';
     const seriesInstanceUIDTwo = '1.3.6.1.4.1.5962.1.1.0.0.0.1595262375.18986.15';
     const seriesInstanceUIDThree = '1.3.6.1.4.1.5962.1.1.0.0.0.1595262375.18986.35';
@@ -119,28 +121,31 @@
         color: [0.,0.5,0.5],
         opacity: 1.0,
         thresholdValues: [125., 255.],
+        limitValues:[0, 255.],
         visible: true,
       });
       const BITwo = new DICOMMicroscopyViewer.metadata.BlendingInformation({
         opticalPathIdentifier: `1`,
         color: [0.5, 0.5, 0.],
         opacity: 1.0,
         thresholdValues: [0., 255.],
+        limitValues:[0, 255.],
         visible: true,
       });
       const BIThree = new DICOMMicroscopyViewer.metadata.BlendingInformation({
         opticalPathIdentifier: `15`,
         color: [1, 0., 0.],
         opacity: 1.0,
         thresholdValues: [30., 255.],
+        limitValues:[0, 255.],
         visible: true,
       });
 
       const viewer = new DICOMMicroscopyViewer.api.VLWholeSlideMicroscopyImageViewer({
         client,
         metadata,
         blendingInformation: [BIOne, BITwo, BIThree],
-        controls: ['fullscreen', 'zoom']
+        controls: ['fullscreen', 'overview', 'zoom']
       });
 
       const container = document.getElementById("dicomImage");