From: Chuck Scott <cscott@gaslightmedia.com>
Date: Fri, 2 Nov 2018 18:06:04 +0000 (-0400)
Subject: Cleanup of layout and print area for better useability.
X-Git-Tag: v2.0.0~2
X-Git-Url: http://cvs2.gaslightmedia.com/gitweb/?a=commitdiff_plain;h=2a3f4d0bfbb7e553cf8bb1ef4b8fc21a78d20452;p=WP-Plugins%2Fglm-serverstats.git

Cleanup of layout and print area for better useability.
---

diff --git a/js/PrintArea/jquery.PrintArea.js b/js/PrintArea/jquery.PrintArea.js
old mode 100644
new mode 100755
index 23daa7a..fec36ed
--- a/js/PrintArea/jquery.PrintArea.js
+++ b/js/PrintArea/jquery.PrintArea.js
@@ -1,5 +1,5 @@
 /**
- *  Version 2.4.0 Copyright (C) 2013
+ *  Version 2.4.1 Copyright (C) 2013
  *  Tested in IE 11, FF 28.0 and Chrome 33.0.1750.154
  *  No official support for other browsers, but will TRY to accommodate challenges in other browsers.
  *  Example:
@@ -60,7 +60,7 @@
 
         PrintArea.write( PrintAreaWindow.doc, $printSource );
 
-        setTimeout( function () { PrintArea.print( PrintAreaWindow ); }, 1000 );
+        setTimeout( function () { PrintArea.print( PrintAreaWindow ); }, 5000 );
     };
 
     var PrintArea = {
@@ -139,7 +139,7 @@
                 var copiedInput = copiedInputs.eq( i );
 
                 if ( typeInput == "radio" || typeInput == "checkbox" ) copiedInput.attr( "checked", $(this).is(":checked") );
-                else if ( typeInput == "text" ) copiedInput.attr( "value", $(this).val() );
+                else if ( typeInput == "text" || typeInput == "" ) copiedInput.attr( "value", $(this).val() );
                 else if ( typeInput == "select" )
                     $(this).find( "option" ).each( function( i ) {
                         if ( $(this).is(":selected") ) $("option", copiedInput).eq( i ).attr( "selected", true );
diff --git a/models/adminServerStats.php b/models/adminServerStats.php
index 5219bb3..e3855c9 100755
--- a/models/adminServerStats.php
+++ b/models/adminServerStats.php
@@ -183,7 +183,7 @@ class adminServerStats extends glmServerStatsBandwidthSupport
 
         }
 
-        // echo "<pre>".print_r($websites,1)."</pre>";
+       //echo "<pre>".print_r($selectedSite,1)."</pre>";
 
         // Compile template data
         $templateData = array(
diff --git a/views/adminServerStats.html b/views/adminServerStats.html
index 7332ca7..dabe3c3 100755
--- a/views/adminServerStats.html
+++ b/views/adminServerStats.html
@@ -106,17 +106,16 @@
         <input type="submit" value="Update Site Settings" class="button-primary">
         <hr>
     {/if}                
-    <center><h1>Customer Section</h1></center>
+        <center><h1>Customer Section</h1></center>
+    </form>
   {/if}
     <!-- Server Data Usage Stats -->
     <div style="width: 95%;">
         <center>
             <p>&nbsp;</p>
-            Date Selected: 
-            <input type="hidden" autofocus="true">
-            <input data-id="graphDate" type="text" name="graph_date" value="{$thisDate}" class="glm-form-text-input-small glm-date-input recurrence-input" placeholder="Click to Select Date/Time" tabindex="2">
-            &nbsp;&nbsp;&nbsp;&nbsp;<div class="button button-secondary graph-print" data-areaToPrint="StatsPrintArea">Print</div>
-            &nbsp;&nbsp;&nbsp;&nbsp;<span class="button button-secondary" id="guideButton">Explanation of Usage and Graphs</span>
+            <span class="button button-secondary" id="guideButton">Explanation of Usage and Graphs</span>
+            &nbsp;&nbsp;<span class="button button-secondary graph-print" data-areaToPrint="StatsPrintArea">Print Page</span>
+            
             <table id="usageGuide" class="glmbw-table" style="margin-top: 3em;"> 
                 <tbody>
                     <tr>
@@ -176,10 +175,10 @@
                     </tr>
                 </tbody>
             </table>
-    
             <div id="StatsPrintArea" class="PrintArea" style="padding: 10px;">
                 <style>
                     .glmbw-table{
+                        font-size: 1em;
                     }
                     .glmbw-table th {
                         font-weight: bold;
@@ -204,9 +203,9 @@
                         width: auto\9; /* IE8 */
                     }
                 </style>
+                <h2 style="text-align: center;">Usage statistics for site:&nbsp;&nbsp;{$selectedSite|upper}&nbsp;&nbsp;&nbsp;&nbsp;Date: {$thisDate}</h2>
                 <center>
                     <table class="glmbw-table">
-                        <h2>Server Usage for {$website} - {$reportDate}</h2>
                         <tr>
                             <th>&nbsp;</th><th>Traffic</th><th>Storage</th></tr>
                         <tr>
@@ -245,15 +244,18 @@
                                 &nbsp;
                             </td>
                         </tr>
-                    {if $serverStats.trafficDiff.exceeded}
-                        <tr>
-                            <td colspan="2" style="padding-top: 1em; color: red;">Total Traffic Target exceeded by {$serverStats.trafficDiff.traffic|string_format:"%.3f"} Gigabytes ({$serverStats.trafficDiff.percent|string_format:"%.0f"}%).</td>
-                        </tr>
-                    {/if}        
                     </table>
-                    <h4>
-                        Color Key: <span style="color: maroon;">Target</span>, <span style="color: gray;">Storage</span>, <span style="color: red;">Incoming</span>, <span style="color: green;">Outgoing</span>, <span style="color: blue;">Total</span><br>                     
-                    </h4>
+                {if $serverStats.trafficDiff.exceeded}
+                    <span colspan="2" style="padding-top: 1em; color: red;">Total traffic last month: {$serverStats.trafficDiff.traffic|string_format:"%.3f"} Gigabytes - {$serverStats.trafficDiff.percent|string_format:"%.0f"}% of Target ({$target} GB)<br></span>
+                {/if}        
+                    <br>
+                    <span class="datePrintExclude">
+                        Select Date for Graphs: 
+                        <input data-id="graphDate" type="text" name="graph_date" value="{$thisDate}" class="glm-form-text-input-small glm-date-input" placeholder="Click to Select Date/Time" tabindex="2">
+                    </span>
+                    <span class="datePrintInclude" style="margin-bottom: 0em;">
+                        Color Key: <span style="color: maroon;">Target</span>, <span style="color: gray;">Storage</span>, <span style="color: red;">Incoming</span>, <span style="color: green;">Outgoing</span>, <span style="color: blue;">Total</span><br>
+                    </span>                     
                     <p><img id="twoDayImg" src="{$assetsUrl}/graph.png" class="glmbw-image"><br></p>
                     <p><img id="twoMonthImg" src="{$assetsUrl}/graph.png" class="glmbw-image"><br></p>
                     <p><img id="twoYearImg" src="{$assetsUrl}/graph.png" class="glmbw-image"><br></p>
@@ -267,13 +269,13 @@
     
     <script type="text/javascript">
         jQuery(document).ready(function($) {
-
+   
             // Toggle guide contents
             $('#guideButton').on('click', function() {
                 $('#usageGuide').toggle();
             })
             $('#usageGuide').hide();
-            
+
             // Date Only Pickers
             $('.glm-date-input').datetimepicker({
                 format: 'm/d/Y',
@@ -283,7 +285,8 @@
                 closeOnWithoutClick: true,
                 timepicker: false,
                 onChangeDateTime:function(dp,$input){
-                    updateGraphs($input.val());
+                    updateGraphs($input.val())
+                    $('#displayThisDate').html($input.val());
                 }
             });
             
@@ -298,11 +301,14 @@
             }
             
             $(".graph-print").click(function(){
+                $('.datePrintExclude').hide();
+                $('.datePrintInclude').show();
+                
                 var areaToPrint = $(this).attr('data-areaToPrint');
                 var position = $(this).offset();
                 $('#' + areaToPrint).printArea({
                     mode:       'popup',        //printable window is either iframe or browser popup
-                    popHt:      1200,            // popup window height
+                    popHt:      1400,            // popup window height
                     popWd:      1100,            // popup window width
                     popX:       200,            // popup window screen X position
                     popY:       200,            //popup window screen Y position
@@ -312,20 +318,19 @@
                     extraHead:  '',             // Comma separated list of extra elements to be appended to head tag
                     strict:     false           // strict or loose Transitional html 4.01 document standard or undefined to not include at all only for popup option
                 });
+                $('.datePrintExclude').show();
+                $('.datePrintInclude').hide();
            });
 
            // Do an initial load of usage graphs
            updateGraphs('{$thisDate}');
-
+           $('.datePrintInclude').hide();
+           
            location.href='#selectedSite';
-           window.setTimeout( function() {
-               location.href='#glmPageTop';
-           }, 500);
 
         });
     </script>
   {/if}
-
 {/if}