From 12862aec51a351354da132132189f9b97a18a282 Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?Elo=C3=ADzio=20Salgado?= <eloisalgado@gmail.com>
Date: Fri, 4 Nov 2016 18:32:50 -0200
Subject: [PATCH] OHIF-127: Resizing viewport when window gets resized

---
 .../client/components/viewer/cineDialog/cineDialog.js    | 9 +++++++--
 .../client/components/viewer/viewerMain/viewerMain.js    | 9 +++++++--
 2 files changed, 14 insertions(+), 4 deletions(-)

diff --git a/Packages/viewerbase/client/components/viewer/cineDialog/cineDialog.js b/Packages/viewerbase/client/components/viewer/cineDialog/cineDialog.js
index 41b93560e..71d3ff09a 100644
--- a/Packages/viewerbase/client/components/viewer/cineDialog/cineDialog.js
+++ b/Packages/viewerbase/client/components/viewer/cineDialog/cineDialog.js
@@ -111,11 +111,16 @@ Template.cineDialog.onCreated(() => {
      * ... jQuery's on('resize', func) version which, for some unkown reason
      * ... is currently not working for this portion of code.
      * ... Further investigation is necessary.
+     *
+     * This happens because when an event is attached using jQuery's
+     * you can't get it using vanilla JavaScript, it returns null. 
+     * You need to use jQuery for that. So, either you use vanilla JS or jQuery
+     * to get an element's event handler. See viewerMain for more details.
      */
 
-    instance.setResizeHandler = (handler) => {
+    instance.setResizeHandler = handler => {
         if (typeof handler === 'function') {
-            let origHandler = window.onresize;
+            const origHandler = window.onresize;
             instance.origWindowResizeHandler = typeof origHandler === 'function' ? origHandler : null;
             window.onresize = function (event) {
                 if (typeof origHandler === 'function') {
diff --git a/Packages/viewerbase/client/components/viewer/viewerMain/viewerMain.js b/Packages/viewerbase/client/components/viewer/viewerMain/viewerMain.js
index 33b5d775c..dcfcf74a2 100644
--- a/Packages/viewerbase/client/components/viewer/viewerMain/viewerMain.js
+++ b/Packages/viewerbase/client/components/viewer/viewerMain/viewerMain.js
@@ -1,6 +1,11 @@
 Template.viewerMain.onCreated(() => {
     // Attach the Window resize listener
-    $(window).on('resize', handleResize);
+    // Don't use jQuery here. "window.onresize" will always be null
+    // If its necessary, check all the code for window.onresize getter
+    // and change it to jQuery._data(window, 'events')['resize']. 
+    // Otherwise this function will be probably overrided.
+    // See cineDialog instance.setResizeHandler function
+    window.addEventListener('resize', handleResize);
 
     // Create the synchronizer used to update reference lines
     OHIF.viewer.updateImageSynchronizer = new cornerstoneTools.Synchronizer('CornerstoneNewImage', cornerstoneTools.updateImageSynchronizer);
@@ -24,7 +29,7 @@ Template.viewerMain.onDestroyed(() => {
     log.info('viewerMain onDestroyed');
     
     // Remove the Window resize listener
-    $(window).off('resize', handleResize);
+    window.removeEventListener('resize', handleResize);
 
     // Destroy the synchronizer used to update reference lines
     OHIF.viewer.updateImageSynchronizer.destroy();