Added tabs and leave page tests.

diff --git a/css/admin.css b/css/admin.css
index 80e0f3e..189e5ae 100644 (file)
--- a/css/admin.css
+++ b/css/admin.css
@@ -78,7 +78,7 @@
 
 /* Admin Forms */
 .glm-bad-input-area {
-    background: #FFaBa9;   
+    background: #FFaBa9 !important;   
 }
 .glm-form-bad-input {
     background: #FFaBa9;

diff --git a/models/admin/management/index.php b/models/admin/management/index.php
index 878d8f0..3ce8321 100644 (file)
--- a/models/admin/management/index.php
+++ b/models/admin/management/index.php
@@ -133,9 +133,6 @@ class GlmMembersAdmin_management_index extends GlmDataSettingsGeneral
                     $settingsUpdated = true;
                 }
 
-                // Display admin message that the data has been updated
-                glmMembersAdmin::addNotice('General Settings for the '.GLM_MEMBERS_PLUGIN_NAME.' plugin have been updated.', 'AdminNotice');
-
                 break;
 
             // Default is to get the current settings and display the form

diff --git a/views/admin/management/header.html b/views/admin/management/header.html
index 8abe751..b539c74 100644 (file)
--- a/views/admin/management/header.html
+++ b/views/admin/management/header.html
@@ -2,10 +2,6 @@
 
     <h2>{$glmPluginName} Configuration</h2>
        
-{if $gitBranch != 'master'}
-    <h3><span class="glm-error">Current git branch: </span>{$gitBranch}</h3>
-{/if}
-       
     <h2 class="nav-tab-wrapper">
         <a href="{$thisURL}?page={$thisPage}&glm_action=index" class="nav-tab{if $thisAction==index} nav-tab-active{/if}">General Settings</a>
         <a href="{$thisURL}?page={$thisPage}&glm_action=terms" class="nav-tab{if $thisAction==terms} nav-tab-active{/if}">Terms and Phrases</a>

diff --git a/views/admin/management/index.html b/views/admin/management/index.html
index fe2f520..74c892c 100644 (file)
--- a/views/admin/management/index.html
+++ b/views/admin/management/index.html
@@ -1,16 +1,23 @@
 {include file='admin/management/header.html'}
     
     
-    {if $settingsUpdated}<h2 class="glm-notice glm-flash-updated">Settings Updated</h2>{/if}
-    
     <form action="{$thisURL}?page={$thisPage}" method="post" enctype="multipart/form-data">
         <input type="hidden" name="glm_action" value="index">
         <input type="hidden" name="option" value="submit">
+   
+        <h2 class="nav-tab-wrapper" style="margin-bottom: 1em;">
+            <a id="glm-settings-debug" data-show-table="glm-table-debug" class="glm-settings-tab nav-tab nav-tab-active">Debug Settings</a>
+            <a id="glm-settings-misc" data-show-table="glm-table-misc" class="glm-settings-tab nav-tab">Misc. Settings</a>
+            <a id="glm-settings-list" data-show-table="glm-table-list" class="glm-settings-tab nav-tab">Member List Options</a>
+            <a id="glm-settings-detail" data-show-table="glm-table-detail" class="glm-settings-tab nav-tab">Member Detail Options</a>
+            {if $settingsUpdated}<span class="glm-notice glm-flash-updated glm-right">Settings Updated</span>{/if}
+            {if $settingsUpdateError}<span class="glm-error glm-flash-updated glm-right">Settings Update Error</span>{/if}
+        </h2>
         
-        <table class="glm-admin-table">
         
-            <!-- Debug Settings -->
+        <!-- Debug Settings -->
         
+        <table id="glm-table-debug" class="glm-admin-table glm-settings-table">
             <tr><td colspan="2"><h2>Debug Settings</h2></td></tr>
             <tr>
                 <th>Admin Debug Information:</th>
@@ -36,11 +43,16 @@
                     <input type="checkbox" name="front_debug_verbose"{if $genSettings.fieldData.front_debug_verbose.value} checked="checked"{/if}>
                 </td>
             </tr>
+        </table>
+        
+            <!-- Misc Settings -->
+            
+        <table id="glm-table-misc" class="glm-admin-table glm-settings-table glm-hidden">
             <tr><td colspan="2"><hr></td></tr>
             <tr><td colspan="2"><h2>Misc. Settings</h2></td></tr>
             <tr>
                 <th {if $genSettings.fieldRequired.google_maps_api_key}class="glm-required"{/if}>Google Maps API Key:</th>
-                <td {if $genSettings.fieldFail.google_maps_api_key}class="glm-form-bad-input"{/if}>
+                <td {if $genSettings.fieldFail.google_maps_api_key}class="glm-form-bad-input glm-form-bad-input-misc"{/if}>
                     <input type="text" name="google_maps_api_key" value="{$genSettings.fieldData.google_maps_api_key}" class="glm-form-text-input-medium">
                     {if $genSettings.fieldFail.google_maps_api_key}<p>{$genSettings.fieldFail.google_maps_api_key}</p>{/if}
                     <br>Optional: See Google Maps JAVAscript API V3 documentation for information.
@@ -48,7 +60,7 @@
             </tr>
             <tr>
                 <th {if $genSettings.fieldRequired.maps_default_lat}class="glm-required"{/if}>Default Map Location:</th>
-                <td {if $genSettings.fieldFail.maps_default_lat || $genSettings.fieldFail.maps_default_lon}class="glm-form-bad-input"{/if}>
+                <td {if $genSettings.fieldFail.maps_default_lat || $genSettings.fieldFail.maps_default_lon}class="glm-form-bad-input glm-form-bad-input-misc"{/if}>
                     <label for="maps_default_lat">Lat:</label>
                     <input type="text" name="maps_default_lat" value="{$genSettings.fieldData.maps_default_lat}" class="glm-form-text-input-small"><br>
                     <label for="maps_default_lon">Lon:</label>
@@ -66,7 +78,7 @@
             </tr>
             <tr>
                 <th {if $genSettings.fieldRequired.time_zone}class="glm-required"{/if}>Time Zone:</th>
-                <td {if $genSettings.fieldFail.time_zone}class="glm-form-bad-input"{/if}>
+                <td {if $genSettings.fieldFail.time_zone}class="glm-form-bad-input glm-form-bad-input-misc"{/if}>
                     <select name="time_zone">
         {foreach $timezones as $tz}
                         <option value="{$tz}"{if $tz == $genSettings.fieldData.time_zone} selected="selected"{/if}>{$tz}</option>
@@ -82,11 +94,11 @@
                     <br>Use only the page name at the end of the permalink for the member detail page.
                 </td>
             </tr>
-            
+        </table>
+        
             <!-- Member List Page Options -->
             
-            <tr><td colspan="2"><hr></td></tr>
-            <tr><td colspan="2"><h2>Member List Page Options</h2></td></tr>
+        <table id="glm-table-list" class="glm-admin-table glm-settings-table glm-hidden">
             <tr>
                 <th>Show Map:</th>
                 <td>
@@ -166,7 +178,7 @@
                         <tr><th>Show Member Logo:</th><td><input type="checkbox" name="list_show_logo"{if $genSettings.fieldData.list_show_logo.value} checked="checked"{/if}></td></tr>
                         <tr>
                             <th {if $genSettings.fieldRequired.list_logo_size}class="glm-required"{/if}>Logo Size:</th>
-                            <td {if $genSettings.fieldFail.list_logo_size}class="glm-form-bad-input"{/if}>
+                            <td {if $genSettings.fieldFail.list_logo_size}class="glm-form-bad-input glm-form-bad-input-list"{/if}>
                                 <select name="list_logo_size">
                     {foreach from=$genSettings.fieldData.list_logo_size.list item=v}
                                     <option value="{$v.value}"{if $v.default} selected="selected"{/if}>{$v.name}</option>
@@ -206,11 +218,11 @@
                     </table>
                 </td>
             </tr>
-            
+        </table>
+        
             <!-- Member Detail Page Options -->
             
-            <tr><td colspan="2"><hr></td></tr>
-            <tr><td colspan="2"><h2>Member Detail Page Options</h2></td></tr>
+        <table id="glm-table-detail" class="glm-admin-table glm-settings-table glm-hidden">
             <tr>
                 <th>Show Map:</th>
                 <td>
@@ -312,16 +324,86 @@
                 </td>
             </tr>
         </table>
-        <input type="submit" value="Update Settings" class="button button-primary">
+        <input id="updateSettings" type="submit" value="Update Settings" class="">
     </form>
     
     <script type="text/javascript">
         
         jQuery(document).ready(function($) {
+            
+            /*
+             * Edit area tabs
+             */
+            $('.glm-settings-tab').click( function() {
 
+                // Clear tabl highlights and hide all tables
+                $('.glm-settings-tab').removeClass('nav-tab-active');
+                $('.glm-settings-table').addClass('glm-hidden');
+                
+                // Highlight selected tab
+                $(this).addClass('nav-tab-active');
+                
+                // Show selected table
+                var table = $(this).attr('data-show-table');
+                $('#' + table).removeClass('glm-hidden');
+                
+                if (table == 'glm-table-address') {
+                    initMap();
+                }
+                
+            });
+            
             // Flash certain elements for a short time after display      
             $(".glm-flash-updated").fadeOut(500).fadeIn(500).fadeOut(500).fadeIn(500).fadeOut(500).fadeIn(500).fadeOut(500).fadeIn(500).fadeOut(500).fadeIn(500).fadeOut(500);
                     
+            /*
+             * Check for bad input or input changes
+             */
+             
+            // Check for any field errors and if found change related tab to error color.
+            if ($('.glm-form-bad-input-debug').length) {
+                $('#glm-settings-debug').addClass('glm-bad-input-area');
+            }
+            if ($('.glm-form-bad-input-misc').length) {
+                $('#glm-settings-misc').addClass('glm-bad-input-area');
+            }
+            if ($('.glm-form-bad-input-list').length) {
+                $('#glm-settings-list').addClass('glm-bad-input-area');
+            }
+            if ($('.glm-form-bad-input-detail').length) {
+                $('#glm-settings-detail').addClass('glm-bad-input-area');
+            }
+            
+            // Check for most input changes
+            $('input, textarea, select, checkbox').on( 'change', function() {
+                glmPageUpdateRequired();
+            }); 
+
+            /*
+             * Checks for leaving the page
+             */
+            var glmSubmitRequired = false;
+             
+            // Flag submit button when updates are required.
+            function glmPageUpdateRequired() {
+                $('#updateSettings').addClass('glm-bad-input-area');
+                glmSubmitRequired = true;
+            }
+            // When submit button is clicked, disable the beforeunload message
+            $('#updateSettings').on('click', function() {
+                glmSubmitRequired = false;
+                return true;
+            });
+            
+            // If submit is required and we're laving the page, alert the user
+            $(window).bind('beforeunload', function() {
+                if (glmSubmitRequired) {
+                    return 'Are you sure you want to leave?';
+                }
+                return '';
+            });
+
+            
         });
     </script>