replace mootool Cookie object with plain JS

web/skins/classic/js/skin.js

@@ -273,10 +273,10 @@ if ( currentView != 'none' && currentView != 'login' ) {
       var flip = $j("#flip");
       if ( flip.html() == 'keyboard_arrow_up' ) {
         flip.html('keyboard_arrow_down');
-        Cookie.write('zmHeaderFlip', 'down', {duration: 10*365, samesite: 'strict'} );
+        setCookie('zmHeaderFlip', 'down', 3600);
       } else {
         flip.html('keyboard_arrow_up');
-        Cookie.write('zmHeaderFlip', 'up', {duration: 10*365, samesite: 'strict'} );
+        setCookie('zmHeaderFlip', 'up', 3600);
       }
     });
     // Manage the web console filter bar minimize chevron
@@ -285,10 +285,10 @@ if ( currentView != 'none' && currentView != 'login' ) {
       var fbflip = $j("#fbflip");
       if ( fbflip.html() == 'keyboard_arrow_up' ) {
         fbflip.html('keyboard_arrow_down');
-        Cookie.write('zmFilterBarFlip', 'down', {duration: 10*365, samesite: 'strict'} );
+        setCookie('zmFilterBarFlip', 'down', 3600);
       } else {
         fbflip.html('keyboard_arrow_up');
-        Cookie.write('zmFilterBarFlip', 'up', {duration: 10*365, samesite: 'strict'} );
+        setCookie('zmFilterBarFlip', 'up', 3600);
         $j('.chosen').chosen("destroy");
         $j('.chosen').chosen();
       }
@@ -300,10 +300,10 @@ if ( currentView != 'none' && currentView != 'login' ) {
       var mfbflip = $j("#mfbflip");
       if ( mfbflip.html() == 'keyboard_arrow_up' ) {
         mfbflip.html('keyboard_arrow_down');
-        Cookie.write('zmMonitorFilterBarFlip', 'up', {duration: 10*365, samesite: 'strict'} );
+        setCookie('zmMonitorFilterBarFlip', 'up', 3600);
       } else {
         mfbflip.html('keyboard_arrow_up');
-        Cookie.write('zmMonitorFilterBarFlip', 'down', {duration: 10*365, samesite: 'strict'} );
+        setCookie('zmMonitorFilterBarFlip', 'down', 3600);
         $j('.chosen').chosen("destroy");
         $j('.chosen').chosen();
       }

web/skins/classic/views/js/cycle.js

@@ -81,18 +81,18 @@ function changeSize() {
     console.log('Did not find liveStream'+monitorData[monIdx].id);
   }
   $j('#scale').val('');
-  Cookie.write('zmCycleScale', '', {duration: 10*365, samesite: 'strict'});
+  setCookie('zmCycleScale', '', 3600);
-  Cookie.write('zmCycleWidth', width, {duration: 10*365, samesite: 'strict'});
+  setCookie('zmCycleWidth', width, 3600);
-  Cookie.write('zmCycleHeight', height, {duration: 10*365, samesite: 'strict'});
+  setCookie('zmCycleHeight', height, 3600);
 } // end function changeSize()
 
 function changeScale() {
   var scale = $j('#scale').val();
   $j('#width').val('auto');
   $j('#height').val('auto');
-  Cookie.write('zmCycleScale', scale, {duration: 10*365, samesite: 'strict'});
+  setCookie('zmCycleScale', scale, 3600);
-  Cookie.write('zmCycleWidth', 'auto', {duration: 10*365, samesite: 'strict'});
+  setCookie('zmCycleWidth', 'auto', 3600);
-  Cookie.write('zmCycleHeight', 'auto', {duration: 10*365, samesite: 'strict'});
+  setCookie('zmCycleHeight', 'auto', 3600);
   var newWidth = ( monitorData[monIdx].width * scale ) / SCALE_BASE;
   var newHeight = ( monitorData[monIdx].height * scale ) / SCALE_BASE;
 

web/skins/classic/views/js/event.js

@@ -210,13 +210,13 @@ function changeScale() {
   } else {
     alarmCue.html(renderAlarmCues(eventViewer));//just re-render alarmCues.  skip ajax call
   }
-  Cookie.write('zmEventScale'+eventData.MonitorId, scale, {duration: 10*365, samesite: 'strict'});
+  setCookie('zmEventScale'+eventData.MonitorId, scale, 3600);
 } // end function changeScale
 
 function changeReplayMode() {
   var replayMode = $j('#replayMode').val();
 
-  Cookie.write('replayMode', replayMode, {duration: 10*365, samesite: 'strict'});
+  setCookie('replayMode', replayMode, 3600);
 
   refreshWindow();
 }
@@ -249,7 +249,7 @@ function changeRate() {
       streamReq({command: CMD_VARPLAY, rate: rate});
     }
   }
-  Cookie.write('zmEventRate', rate, {duration: 10*365, samesite: 'strict'});
+  setCookie('zmEventRate', rate, 3600);
 } // end function changeRate
 
 function getCmdResponse( respObj, respText ) {
@@ -292,7 +292,7 @@ function getCmdResponse( respObj, respText ) {
     streamPause( );
   } else {
     $j('select[name="rate"]').val(streamStatus.rate*100);
-    Cookie.write('zmEventRate', streamStatus.rate*100, {duration: 10*365, samesite: 'strict'});
+    setCookie('zmEventRate', streamStatus.rate*100, 3600);
     streamPlay( );
   }
   $j('#progressValue').html(secsToTime(parseInt(streamStatus.progress)));
@@ -361,7 +361,7 @@ function vjsPlay() { //catches if we change mode programatically
     stopFastRev();
   }
   $j('select[name="rate"]').val(vid.playbackRate()*100);
-  Cookie.write('zmEventRate', vid.playbackRate()*100, {duration: 10*365, samesite: 'strict'});
+  setCookie('zmEventRate', vid.playbackRate()*100, 3600);
   streamPlay();
 }
 
@@ -388,7 +388,7 @@ function streamFastFwd( action ) {
       setButtonState('fastFwdBtn', 'unavail');
     }
     $j('select[name="rate"]').val(vid.playbackRate()*100);
-    Cookie.write('zmEventRate', vid.playbackRate()*100, {duration: 10*365, samesite: 'strict'});
+    setCookie('zmEventRate', vid.playbackRate()*100, 3600);
   } else {
     streamReq({command: CMD_FASTFWD});
   }
@@ -415,7 +415,7 @@ function stopFastRev() {
   clearInterval(intervalRewind);
   vid.playbackRate(1);
   $j('select[name="rate"]').val(vid.playbackRate()*100);
-  Cookie.write('zmEventRate', vid.playbackRate()*100, {duration: 10*365, samesite: 'strict'});
+  setCookie('zmEventRate', vid.playbackRate()*100, 3600);
   revSpeed = .5;
 }
 
@@ -433,7 +433,7 @@ function streamFastRev( action ) {
     }
     clearInterval(intervalRewind);
     $j('select[name="rate"]').val(-revSpeed*100);
-    Cookie.write('zmEventRate', vid.playbackRate()*100, {duration: 10*365, samesite: 'strict'});
+    setCookie('zmEventRate', vid.playbackRate()*100, 3600;
     intervalRewind = setInterval(function() {
       if (vid.currentTime() <= 0) {
         clearInterval(intervalRewind);
@@ -1134,11 +1134,11 @@ function initPage() {
       handleClick(event);
     });
     vid.on('volumechange', function() {
-      Cookie.write('volume', vid.volume(), {duration: 10*365, samesite: 'strict'});
+      setCookie('volume', vid.volume(), 3600);
     });
-    if ( Cookie.read('volume') != null ) {
+    var cookie = getCookie('volume');
-      vid.volume(Cookie.read('volume'));
+    if ( cookie ) vid.volume(cookie);
-    }
+
     vid.on('timeupdate', function() {
       $j('#progressValue').html(secsToTime(Math.floor(vid.currentTime())));
     });

web/skins/classic/views/js/frame.js

@@ -24,7 +24,7 @@ function changeScale() {
     img.css('width', newWidth + 'px');
     img.css('height', newHeight + 'px');
   }
-  Cookie.write('zmWatchScale', scale, {duration: 10*365, samesite: 'strict'});
+  setCookie('zmWatchScale', scale, 3600);
   $j.each(controlsLinks, function(k, anchor) { //Make frames respect scale choices
     if ( anchor ) {
       anchor.prop('href', anchor.prop('href').replace(/scale=.*&/, 'scale=' + scale + '&'));

web/skins/classic/views/js/montage.js

@@ -44,9 +44,9 @@ function selectLayout(element) {
   if ( ! layout ) {
     return;
   }
-  Cookie.write('zmMontageLayout', layout_id, {duration: 10*365, samesite: 'strict'});
+  setCookie('zmMontageLayout', layout_id, 3600);
   if ( layouts[layout_id].Name != 'Freeform' ) { // 'montage_freeform.css' ) {
-    Cookie.write('zmMontageScale', '', {duration: 10*365, samesite: 'strict'});
+    setCookie('zmMontageScale', '', 3600);
     $j('#scale').val('');
     $j('#width').val('0');
   } else {
@@ -129,9 +129,9 @@ function changeSize() {
     }
   }
   $j('#scale').val('');
-  Cookie.write('zmMontageScale', '', {duration: 10*365, samesite: 'strict'});
+  setCookie('zmMontageScale', '', 3600);
-  Cookie.write('zmMontageWidth', width, {duration: 10*365, samesite: 'strict'});
+  setCookie('zmMontageWidth', width, 3600);
-  Cookie.write('zmMontageHeight', height, {duration: 10*365, samesite: 'strict'});
+  setCookie('zmMontageHeight', height, 3600);
   $j("#zmMontageLayout option:selected").removeAttr("selected");
   //selectLayout('#zmMontageLayout');
 } // end function changeSize()
@@ -143,9 +143,9 @@ function changeScale() {
   var scale = $j('#scale').val();
   $j('#width').val('0'); //auto
   $j('#height').val('0'); //auto
-  Cookie.write('zmMontageScale', scale, {duration: 10*365, samesite: 'strict'});
+  setCookie('zmMontageScale', scale, 3600);
-  Cookie.write('zmMontageWidth', '', {duration: 10*365, samesite: 'strict'});
+  setCookie('zmMontageWidth', '', 3600);
-  Cookie.write('zmMontageHeight', '', {duration: 10*365, samesite: 'strict'});
+  setCookie('zmMontageHeight', '', 3600);
   if ( scale == '' ) {
     selectLayout('#zmMontageLayout');
     return;
@@ -275,9 +275,9 @@ function initPage() {
   $j("#hdrbutton").click(function() {
     $j("#flipMontageHeader").slideToggle("slow");
     $j("#hdrbutton").toggleClass('glyphicon-menu-down').toggleClass('glyphicon-menu-up');
-    Cookie.write( 'zmMontageHeaderFlip', $j('#hdrbutton').hasClass('glyphicon-menu-up') ? 'up' : 'down', {duration: 10*365} );
+    setCookie( 'zmMontageHeaderFlip', $j('#hdrbutton').hasClass('glyphicon-menu-up') ? 'up' : 'down', 3600);
   });
-  if ( Cookie.read('zmMontageHeaderFlip') == 'down' ) {
+  if ( getCookie('zmMontageHeaderFlip') == 'down' ) {
     // The chosen dropdowns require the selects to be visible, so once chosen has initialized, we can hide the header
     $j("#flipMontageHeader").slideToggle("fast");
     $j("#hdrbutton").toggleClass('glyphicon-menu-down').toggleClass('glyphicon-menu-up');

web/skins/classic/views/js/watch.js

@@ -110,7 +110,7 @@ function changeScale() {
     newHeight = monitorHeight * scale / SCALE_BASE;
   }
 
-  Cookie.write('zmWatchScale'+monitorId, scale, {duration: 10*365, samesite: 'strict'});
+  setCookie('zmWatchScale'+monitorId, scale, 3600);
 
   var streamImg = $j('#liveStream'+monitorId);
   if ( streamImg ) {