From 2008af9a6845c999ddad8d7d94f4d46f43f9c63c Mon Sep 17 00:00:00 2001
From: dg9vh <dg9vh@darc.de>
Date: Thu, 2 Mar 2017 15:56:46 +0000
Subject: [PATCH] make all infobox panels collapsible

---
 css/style.css              |  7 +++++++
 include/disk.php           |  4 +++-
 include/lh_ajax.php        |  4 +++-
 include/localtx_ajax.php   |  4 +++-
 include/modes.php          |  4 +++-
 include/repeaterinfo.php   |  4 +++-
 include/sysinfo_ajax.php   |  4 +++-
 include/txinfo.php         |  4 +++-
 include/ysfgatewayinfo.php |  8 ++++++--
 index.php                  | 16 ++++++++++++++++
 version.php                |  2 +-
 11 files changed, 51 insertions(+), 10 deletions(-)
 create mode 100644 css/style.css

diff --git a/css/style.css b/css/style.css
new file mode 100644
index 0000000..498ee89
--- /dev/null
+++ b/css/style.css
@@ -0,0 +1,7 @@
+.clickable{
+    cursor: pointer;   
+}
+
+.panel-heading span {
+	font-size: 15px;
+}
\ No newline at end of file
diff --git a/include/disk.php b/include/disk.php
index 4e9ab07..b372ead 100644
--- a/include/disk.php
+++ b/include/disk.php
@@ -1,6 +1,7 @@
   <div class="panel panel-default">
   <!-- Standard-Panel-Inhalt -->
-     <div class="panel-heading">Disk Use</div>
+     <div class="panel-heading">Disk Use<span class="pull-right clickable"><i class="glyphicon glyphicon-chevron-up"></i></span></div>
+     <div class="panel-body">
      <!-- Tabelle -->
      <div class="table-responsive">
          <table id="diskuse" class="table diskuse table-condensed table-striped table-hover">
@@ -57,4 +58,5 @@ try{
                </tbody>
          </table>
      </div>
+     </div>
   </div>
diff --git a/include/lh_ajax.php b/include/lh_ajax.php
index 680d9b2..7150b88 100644
--- a/include/lh_ajax.php
+++ b/include/lh_ajax.php
@@ -3,7 +3,8 @@ $totalLH = count($lastHeard);
 ?>
   <div class="panel panel-default">
   <!-- Standard-Panel-Inhalt -->
-  <div class="panel-heading">Last Heard List of today's <?php echo $totalLH; ?> callsigns.</div>
+  <div class="panel-heading">Last Heard List of today's <?php echo $totalLH; ?> callsigns.<span class="pull-right clickable"><i class="glyphicon glyphicon-chevron-up"></i></span></div>
+  <div class="panel-body">
   <!-- Tabelle -->
   <div class="table-responsive">
   <table id="lastHeard" class="table lastHeard table-condensed table-striped table-hover">
@@ -29,6 +30,7 @@ $totalLH = count($lastHeard);
         </thead>
     </table>
   </div>
+  </div>
 </div>
 <script>
 $(document).ready(function(){
diff --git a/include/localtx_ajax.php b/include/localtx_ajax.php
index a7acfa8..9f67a93 100644
--- a/include/localtx_ajax.php
+++ b/include/localtx_ajax.php
@@ -3,7 +3,8 @@ $totalLH = count($lastHeard);
 ?>
   <div class="panel panel-default">
   <!-- Standard-Panel-Inhalt -->
-  <div class="panel-heading">Today's local transmissions</div>
+  <div class="panel-heading">Today's local transmissions<span class="pull-right clickable"><i class="glyphicon glyphicon-chevron-up"></i></span></div>
+  <div class="panel-body">
   <!-- Tabelle -->
   <div class="table-responsive">
   <table id="localTx" class="table localTx table-condensed table-striped table-hover">
@@ -35,6 +36,7 @@ $totalLH = count($lastHeard);
         </thead>
     </table>
   </div>
+  </div>
 </div>
 <script>
 $(document).ready(function(){
diff --git a/include/modes.php b/include/modes.php
index bd76a75..2d27430 100644
--- a/include/modes.php
+++ b/include/modes.php
@@ -1,6 +1,7 @@
   <div class="panel panel-default">
   <!-- Standard-Panel-Inhalt -->
-  <div class="panel-heading">Enabled Modes</div>
+  <div class="panel-heading">Enabled Modes<span class="pull-right clickable"><i class="glyphicon glyphicon-chevron-up"></i></span></div>
+  <div class="panel-body">
   <!-- Tabelle -->
   <div class="table-responsive">
   <table class="table">
@@ -16,4 +17,5 @@
     </tr>
   </table>
   </div>
+  </div>
 </div>
diff --git a/include/repeaterinfo.php b/include/repeaterinfo.php
index 629f74f..c22f999 100644
--- a/include/repeaterinfo.php
+++ b/include/repeaterinfo.php
@@ -1,6 +1,7 @@
   <div class="panel panel-default">
   <!-- Standard-Panel-Inhalt -->
-  <div class="panel-heading">Repeater Info</div>
+  <div class="panel-heading">Repeater Info<span class="pull-right clickable"><i class="glyphicon glyphicon-chevron-up"></i></span></div>
+  <div class="panel-body">
   <!-- Tabelle -->
   <div class="table-responsive">
   <table class="table repeaterinfo">
@@ -115,4 +116,5 @@
     </tr>
   </table>
   </div>
+  </div>
 </div>
diff --git a/include/sysinfo_ajax.php b/include/sysinfo_ajax.php
index 5d6e7a4..53f8578 100644
--- a/include/sysinfo_ajax.php
+++ b/include/sysinfo_ajax.php
@@ -1,11 +1,13 @@
  <div class="panel panel-default">
   <!-- Standard-Panel-Inhalt -->
-  <div class="panel-heading">System Info</div>
+  <div class="panel-heading">System Info<span class="pull-right clickable"><i class="glyphicon glyphicon-chevron-up"></i></span></div>
+  <div class="panel-body">
   <!-- Tabelle -->
    <div class="table-responsive">
       <table id="sysinfo" class="table sysinfo table-condensed">
       </table>
    </div>
+   </div>
  </div>
 <script>
 function loadXMLDocSysinfo() {
diff --git a/include/txinfo.php b/include/txinfo.php
index 72debfe..1b6b70e 100644
--- a/include/txinfo.php
+++ b/include/txinfo.php
@@ -1,6 +1,7 @@
   <div class="panel panel-default">
   <!-- Standard-Panel-Inhalt -->
-  <div class="panel-heading">Currently TXing</div>
+  <div class="panel-heading">Currently TXing<span class="pull-right clickable"><i class="glyphicon glyphicon-chevron-up"></i></span></div>
+  <div class="panel-body">
   <!-- Tabelle -->
   <div class="table-responsive">
   <table id="currtx" class="table curTx table-condensed table-striped table-hover">
@@ -32,6 +33,7 @@
   </table>
   </div>
 </div>
+</div>
 <script>
 function doXMLHTTPRequest(scriptname, elem) {
    var xmlhttp;
diff --git a/include/ysfgatewayinfo.php b/include/ysfgatewayinfo.php
index 58fbb07..68d5372 100644
--- a/include/ysfgatewayinfo.php
+++ b/include/ysfgatewayinfo.php
@@ -2,7 +2,8 @@
 ?>
   <div class="panel panel-default">
   <!-- Standard-Panel-Inhalt -->
-  <div class="panel-heading">YSFGateway-Infos</div>
+  <div class="panel-heading">YSFGateway-Infos<span class="pull-right clickable"><i class="glyphicon glyphicon-chevron-up"></i></span></div>
+  <div class="panel-body">
   <!-- Tabelle -->
   <table class="table">
     <tr>
@@ -17,10 +18,12 @@
     ?>
     </tr>
   </table>
+</div>
 </div>
   <div class="panel panel-default">
   <!-- Standard-Panel-Inhalt -->
-  <div class="panel-heading">YSFReflectors reported active</div>
+  <div class="panel-heading">YSFReflectors reported active<span class="pull-right clickable"><i class="glyphicon glyphicon-chevron-up"></i></span></div>
+  <div class="panel-body">
   <!-- Tabelle -->
   <div class="table-responsive">
   <table id="ysfGateways" class="table ysfGateways table-condensed table-striped table-hover">
@@ -56,6 +59,7 @@
   </table>
   </div>
 </div>
+</div>
 
 <script>
 $(document).ready(function(){
diff --git a/index.php b/index.php
index 86695c3..403982c 100644
--- a/index.php
+++ b/index.php
@@ -21,6 +21,8 @@ include "version.php";
   <head>
     <meta charset="utf-8">
      <meta name="viewport" content="width=device-width, initial-scale=0.6,maximum-scale=1, user-scalable=yes">
+    <!-- Default-CSS -->
+    <link rel="stylesheet" href="css/style.css">
     <!-- CSS for tooltip display -->
     <link rel="stylesheet" href="css/tooltip.css">
     <!-- CSS for monospaced fonts in tables -->
@@ -157,6 +159,20 @@ if (!isset($_GET['stoprefresh'])) {
     instructions how to enable JavaScript in your web browser</a>.
    </noscript>
   </body>
+  <script>
+  		$(document).on('click', '.panel-heading span.clickable', function(e){
+    var $this = $(this);
+	if(!$this.hasClass('panel-collapsed')) {
+		$this.parents('.panel').find('.panel-body').slideUp();
+		$this.addClass('panel-collapsed');
+		$this.find('i').removeClass('glyphicon-chevron-up').addClass('glyphicon-chevron-down');
+	} else {
+		$this.parents('.panel').find('.panel-body').slideDown();
+		$this.removeClass('panel-collapsed');
+		$this.find('i').removeClass('glyphicon-chevron-down').addClass('glyphicon-chevron-up');
+	}
+})
+  </script>
 </html>
 <?php
    showLapTime("End of Page");
diff --git a/version.php b/version.php
index 864c8ed..09fe60d 100644
--- a/version.php
+++ b/version.php
@@ -1,3 +1,3 @@
 <?php
-define("VERSION", "20170228-1");
+define("VERSION", "20170302-1");
 ?>