From 65181c84ee343f23a9ba1ffc934bc086e7d2ae4a Mon Sep 17 00:00:00 2001
From: Andrew Bauer <zonexpertconsulting@outlook.com>
Date: Sun, 23 Aug 2020 17:53:47 -0500
Subject: [PATCH] update frame top toolbar

---
 web/skins/classic/views/frame.php       | 31 ++++++++++++++-----------
 web/skins/classic/views/js/frame.js     | 24 ++++++++++++++++++-
 web/skins/classic/views/js/frame.js.php |  8 +++++++
 3 files changed, 48 insertions(+), 15 deletions(-)
diff --git a/web/skins/classic/views/frame.php b/web/skins/classic/views/frame.php
index 038c8cdb4..b46e0d04e 100644
--- a/web/skins/classic/views/frame.php
+++ b/web/skins/classic/views/frame.php
@@ -85,23 +85,26 @@ $focusWindow = true;
 xhtmlHeaders(__FILE__, translate('Frame').' - '.$Event->Id().' - '.$Frame->FrameId());
 ?>
 <body>
-  <div id="page">
-    <?php echo getNavBarHTML() ?>
-    <div id="header">
-    <form>
-      <div id="headerButtons">
-        <?php echo ( ZM_RECORD_EVENT_STATS && $alarmFrame ) ? '<a href="?view=stats&amp;eid='.$Event->Id().'&amp;fid='.$Frame->FrameId().'">'.translate('Stats').'</a>' : '' ?>
-        <?php if ( canEdit('Events') ) { ?><a href="?view=none&amp;action=delete&amp;markEid=<?php echo $Event->Id() ?>"><?php echo translate('Delete') ?></a><?php } ?>
-        <a href="#" id="backLnk"><?php echo translate('Back') ?></a>
+  <?php echo getNavBarHTML() ?>
+  <div id="page p-0">
+    <div class="d-flex flex-row justify-content-between px-3 pt-1">
+      <div id="toolbar" >
+        <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="statsBtn" class="btn btn-normal" data-toggle="tooltip" data-placement="top" title="<?php echo translate('Stats') ?>" ><i class="fa fa-info"></i></button>
       </div>
-      <div id="scaleControl"><label for="scale"><?php echo translate('Scale') ?></label><?php echo htmlSelect('scale', $scales, $scale); ?></div>
+      
       <h2><?php echo translate('Frame') ?> <?php echo $Event->Id().'-'.$Frame->FrameId().' ('.$Frame->Score().')' ?></h2>
-      <input type="hidden" name="base_width" id="base_width" value="<?php echo $Event->Width(); ?>"/>
-      <input type="hidden" name="base_height" id="base_height" value="<?php echo $Event->Height(); ?>"/>
-    </form>
+      
+      <form>
+        <div id="scaleControl"><label for="scale"><?php echo translate('Scale') ?></label><?php echo htmlSelect('scale', $scales, $scale); ?></div>        
+        <input type="hidden" name="base_width" id="base_width" value="<?php echo $Event->Width(); ?>"/>
+        <input type="hidden" name="base_height" id="base_height" value="<?php echo $Event->Height(); ?>"/>
+      </form>
     </div>
-    <div id="content">
-      <p id="image">
+    
+  <div id="content">
+    <p id="image">
 <?php if ( $imageData['hasAnalImage'] ) {
  echo sprintf('<a href="?view=frame&amp;eid=%d&amp;fid=%d&scale=%d&amp;show=%s">', $Event->Id(), $Frame->FrameId(), $scale, ( $show=='anal'?'capt':'anal' ) );
 } ?>
diff --git a/web/skins/classic/views/js/frame.js b/web/skins/classic/views/js/frame.js
index 93eaab5b2..f7ee39288 100644
--- a/web/skins/classic/views/js/frame.js
+++ b/web/skins/classic/views/js/frame.js
@@ -41,13 +41,35 @@ document.addEventListener('DOMContentLoaded', function onDCL() {
 });
 
 function initPage() {
+  var backBtn = $j('#backBtn');
+  var refreshBtn = $j('#refreshBtn');
+  var statsBtn = $j('#statsBtn');
+
   if ( scale == '0' || scale == 'auto' ) changeScale();
 
+  // Don't enable the back button if there is no previous zm page to go back to
+  backBtn.prop('disabled', !document.referrer.length);
+
   // Manage the BACK button
-  document.getElementById("backLnk").addEventListener("click", function onBackClick(evt) {
+  document.getElementById("backBtn").addEventListener("click", function onBackClick(evt) {
     evt.preventDefault();
     window.history.back();
   });
+
+  // Manage the REFRESH Button
+  document.getElementById("refreshBtn").addEventListener("click", function onRefreshClick(evt) {
+    evt.preventDefault();
+    window.location.reload(true);
+  });
+
+  // Manage the STATS button
+  document.getElementById("statsBtn").addEventListener("click", function onViewClick(evt) {
+
+    evt.preventDefault();
+    window.location.href = thisUrl+'?view=stats&eid='+eid+'&fid='+fid;
+  });
+
+
 }
 
 $j(document).ready(function() {
diff --git a/web/skins/classic/views/js/frame.js.php b/web/skins/classic/views/js/frame.js.php
index c84db0be4..9bd2f4236 100644
--- a/web/skins/classic/views/js/frame.js.php
+++ b/web/skins/classic/views/js/frame.js.php
@@ -1,7 +1,15 @@
 <?php
   global $scale;
+  global $eid;
+  global $fid;
+  global $alarmFrame;
 ?>
 
 var scale = '<?php echo validJsStr($scale); ?>';
 
 var SCALE_BASE = <?php echo SCALE_BASE ?>;
+
+var eid = <?php echo $eid ?>;
+var fid = <?php echo $fid ?>;
+var record_event_stats = <?php echo ZM_RECORD_EVENT_STATS ?>;
+var alarmFrame = <?php echo $alarmFrame ?>;
