From 1ed160866b7c51fd1f21f26598d1a9b6bb27e32d Mon Sep 17 00:00:00 2001
From: Andrew Bauer <zonexpertconsulting@outlook.com>
Date: Fri, 16 Oct 2020 15:47:42 -0500
Subject: [PATCH] add legacy watch view alarm buttons to toolbar

---
 web/skins/classic/views/js/watch.js     | 40 ++++++++++++++++++-------
 web/skins/classic/views/js/watch.js.php |  5 ++++
 web/skins/classic/views/watch.php       | 22 ++++----------
 3 files changed, 39 insertions(+), 28 deletions(-)

diff --git a/web/skins/classic/views/js/watch.js b/web/skins/classic/views/js/watch.js
index 1b2778fa8..40c8dc5be 100644
--- a/web/skins/classic/views/js/watch.js
+++ b/web/skins/classic/views/js/watch.js
@@ -1,5 +1,7 @@
 var backBtn = $j('#backBtn');
 var settingsBtn = $j('#settingsBtn');
+var enableAlmBtn = $j('#enableAlmBtn');
+var forceAlmBtn = $j('#forceAlmBtn');
 
 function showEvents() {
   $('ptzControls').addClass('hidden');
@@ -204,22 +206,22 @@ function getStreamCmdResponse(respObj, respText) {
 
       if ( canEditMonitors ) {
         if ( streamStatus.enabled ) {
-          $('enableAlarmsLink').addClass('hidden');
-          $('disableAlarmsLink').removeClass('hidden');
+          enableAlmBtn.addClass('disabled');
+          enableAlmBtn.prop('title', disableAlarmsStr);
           if ( streamStatus.forced ) {
-            $('forceAlarmLink').addClass('hidden');
-            $('cancelAlarmLink').removeClass('hidden');
+            forceAlmBtn.addClass('disabled');
+            forceAlmBtn.prop('title', cancelForcedAlarmStr);
           } else {
-            $('forceAlarmLink').removeClass('hidden');
-            $('cancelAlarmLink').addClass('hidden');
+            forceAlmBtn.removeClass('disabled');
+            forceAlmBtn.prop('title', forceAlarmStr);
           }
-          $('forceCancelAlarm').removeClass('hidden');
+          forceAlmBtn.prop('disabled', false);
         } else {
-          $('enableAlarmsLink').removeClass('hidden');
-          $('disableAlarmsLink').addClass('hidden');
-          $('forceCancelAlarm').addClass('hidden');
+          enableAlmBtn.removeClass('disabled');
+          enableAlmBtn.prop('title', enableAlarmsStr);
+          forceAlmBtn.prop('disabled', true);
         }
-        $('enableDisableAlarms').removeClass('hidden');
+        enableAlmBtn.prop('disabled', false);
       } // end if canEditMonitors
 
       if ( streamStatus.auth ) {
@@ -470,6 +472,14 @@ function cmdEnableAlarms() {
   alarmCmdReq.send(alarmCmdParms+"&command=enableAlarms");
 }
 
+function cmdAlarm() {
+  if ( enableAlmBtn.hasClass('disabled') ) {
+    cmdEnableAlarms();
+  } else {
+    cmdDisableAlarms();
+  }
+}
+
 function cmdForceAlarm() {
   alarmCmdReq.send(alarmCmdParms+"&command=forceAlarm");
   if ( window.event ) {
@@ -485,6 +495,14 @@ function cmdCancelForcedAlarm() {
   return false;
 }
 
+function cmdForce() {
+  if ( forceAlmBtn.hasClass('disabled') ) {
+    cmdCancelForcedAlarm();
+  } else {
+    cmdForceAlarm();
+  }
+}
+
 function getActResponse( respObj, respText ) {
   if ( respObj.result == 'Ok' ) {
     if ( respObj.refreshParent && window.opener ) {
diff --git a/web/skins/classic/views/js/watch.js.php b/web/skins/classic/views/js/watch.js.php
index d0904b22a..711b3d484 100644
--- a/web/skins/classic/views/js/watch.js.php
+++ b/web/skins/classic/views/js/watch.js.php
@@ -24,6 +24,11 @@ stateStrings[STATE_TAPE] = "<?php echo translate('Record') ?>";
 
 var deleteString = "<?php echo translate('Delete') ?>";
 
+var enableAlarmsStr = "<?php echo translate('EnableAlarms') ?>";
+var disableAlarmsStr = "<?php echo translate('DisableAlarms') ?>";
+var forceAlarmStr = "<?php echo translate('ForceAlarm') ?>";
+var cancelForcedAlarmStr = "<?php echo translate('CancelForcedAlarm') ?>";
+
 var CMD_NONE = <?php echo CMD_NONE ?>;
 var CMD_PAUSE = <?php echo CMD_PAUSE ?>;
 var CMD_PLAY = <?php echo CMD_PLAY ?>;
diff --git a/web/skins/classic/views/watch.php b/web/skins/classic/views/watch.php
index 9b0b98bf2..a8b9f24bd 100644
--- a/web/skins/classic/views/watch.php
+++ b/web/skins/classic/views/watch.php
@@ -62,9 +62,11 @@ xhtmlHeaders(__FILE__, $monitor->Name().' - '.translate('Feed'));
   <?php echo getNavBarHTML() ?>
     <div class="d-flex flex-row justify-content-between px-3 py-1">
       <div>
-        <button id="backBtn" class="btn btn-normal" data-toggle="tooltip" data-placement="top" title="<?php echo translate('Back') ?>" disabled><i class="fa fa-arrow-left"></i></button>
-        <button id="refreshBtn" class="btn btn-normal" data-toggle="tooltip" data-placement="top" title="<?php echo translate('Refresh') ?>" ><i class="fa fa-refresh"></i></button>
-        <button id="settingsBtn" class="btn btn-normal" data-toggle="tooltip" data-placement="top" title="<?php echo translate('Settings') ?>" disabled><i class="fa fa-sliders"></i></button>
+        <button type="button" id="backBtn" class="btn btn-normal" data-toggle="tooltip" data-placement="top" title="<?php echo translate('Back') ?>" disabled><i class="fa fa-arrow-left"></i></button>
+        <button type="button" id="refreshBtn" class="btn btn-normal" data-toggle="tooltip" data-placement="top" title="<?php echo translate('Refresh') ?>" ><i class="fa fa-refresh"></i></button>
+        <button type="button" id="settingsBtn" class="btn btn-normal" data-toggle="tooltip" data-placement="top" title="<?php echo translate('Settings') ?>" disabled><i class="fa fa-sliders"></i></button>
+        <button type="button" id="enableAlmBtn" class="btn btn-normal" data-on-click="cmdAlarm" data-toggle="tooltip" data-placement="top" title="<?php echo translate('DisableAlarms') ?>" disabled><i class="fa fa-bell"></i></button>
+        <button type="button" id="forceAlmBtn" class="btn btn-danger" data-on-click="cmdForce" data-toggle="tooltip" data-placement="top" title="<?php echo translate('ForceAlarm') ?>" disabled><i class="fa fa-exclamation-circle"></i></button>
       </div>
 
       <div>
@@ -92,20 +94,6 @@ if ( $streamMode == 'jpeg' ) {
 
 <?php if ( $monitor->Type() != 'WebSite' ) { ?>
       <div id="monitorStatus">
-<?php if ( canEdit('Monitors') ) { ?>
-        <div id="enableDisableAlarms">
-          <button type="button" id="enableAlarmsLink" data-on-click="cmdEnableAlarms" class="hidden">
-          <?php echo translate('EnableAlarms') ?></button>
-          <button type="button" id="disableAlarmsLink" data-on-click="cmdDisableAlarms" class="hidden">
-          <?php echo translate('DisableAlarms') ?></button>
-        </div>
-        <div id="forceCancelAlarm">
-            <button type="button" id="forceAlarmLink" data-on-click="cmdForceAlarm"><?php echo translate('ForceAlarm') ?></button>
-            <button type="button" id="cancelAlarmLink" data-on-click="cmdCancelForcedAlarm" class="hidden"><?php echo translate('CancelForcedAlarm') ?></button>
-        </div>
-<?php
-}
-?>
         <div id="monitorState"><?php echo translate('State') ?>:&nbsp;<span id="stateValue"></span>&nbsp;-&nbsp;<span id="fpsValue"></span>&nbsp;fps</div>
       </div>
       <div id="dvrControls">