Merged changes in the UI snippets in the main member plugin to this plugin where appropriate.
Made minor fixes and changes to certain UI snippets.
Fixed problems with usage and configure admin pages and forms.
GLM_SERVERSTATS_PLUGIN_VERSION,
true
);
+ wp_enqueue_script('glm-usage-foundation6-js', false, array('jquery'), false, true);
wp_register_style(
'glm-usage-foundation6-css',
GLM_SERVERSTATS_PLUGIN_URL . 'css/foundation-6.min.css',
);
wp_enqueue_style('glm-usage-foundation6-css');
-
wp_enqueue_style('jquery-style', 'https://ajax.googleapis.com/ajax/libs/jqueryui/1.11.4/themes/smoothness/jquery-ui.css');
// wp_enqueue_style('glm-server-stats-admin-css', GLM_SERVERSTATS_PLUGIN_CSS_URL.'/admin.css');
.'required to provide you with a consistent user experience. We don\'t store '
.'personally identifying or other sensitive information in these Cookies and '
.'these Cookies are erased when you close your Web Browser unless otherwise '
- .'stated when you click "Show more".</p><p>If you\'re on a public computer,'
+ .'stated when you click "Show more".</p><p>If you\'re on a public computer, '
.'be sure to close all Web Browsers when you\'re done!</p>';
$autoInsertDefault = true;
}
<p>
<b>LOGGED IN USERS:</b> We don't store passwords you use to log in as plain text, instead they're encrypted
before being stored in our systems. When you enter that password again to log in, we encrypt that and and
- match it to the encrypted password that had been stored. There is no way to decrypt the stored passwords.
- Still, you should try to avoid using the same password for everything you log into, should not make those
- passwords easily accessible to anyone else, and you should always use more complex passwords that don't
- include words or names people would associate with you.
+ match it to the encrypted password that had been stored. There is no way to decrypt the stored passwords,
+ but it may be possilbe for others to guess simple passwords. You should always use more complex passwords
+ that don't include words or names people would associate with you. You should also try to avoid using the
+ same password for everything you log into and should not make those passwords easily accessible to anyone else.
</p>
<?php } ?>
<?php if ($serverstatsConfig['cookie_opt_forms']) { ?>
{else}
- <h1>
- Gaslight Media Server Usage
- </h1>
-
{if !$haveStats}
<h3 class="glm-error">This application has not been configured. Please ask Gaslight Media this for your Website.</h3>
<p><b>Error:</b> {$connectError}</p>
{if apply_filters('glm-serverstats-is-provider', false)}
<div class="usage-section">Service Provider Section</div>
- {* Form Start *}
- {$ui = [
- 'action' => "{$thisUrl}?page={$thisPage}&selected_site={$selectedSite}",
- 'method' => 'POST',
- 'validate' => true,
- 'validateFocusMsg' => true
- ]}
- {include file="ui/f6/form-start.html"}
-
- <input type="hidden" name="option" value="update_site">
- <input type="hidden" name="site_sort" value="$site_sort">
- <input type="hidden" name="selected_site" value="{$selectedSite}">
{* Grid Start *}
{$ui = [
{* Misc Container Start *}
{include file="ui/f6/miscContainer-start.html"}
-
- <span class="sortByTitle">Sort By: </span>
- <input type="radio" name="site_sort" value="site_name" {if $site_sort == 'site_name'} checked="checked"{/if} onClick="location.href='{$thisUrl}?page={$thisPage}&site_sort=site_name&selected_site={$selectedSite}';">Site Name
- <span class="sortBy">Traffic:</span>
- <input type="radio" name="site_sort" value="data_total" {if $site_sort == 'data_total'} checked="checked"{/if} onClick="location.href='{$thisUrl}?page={$thisPage}&site_sort=data_total&selected_site={$selectedSite}';">Total for Month
- <input type="radio" name="site_sort" value="target_percent" {if $site_sort == 'target_percent'} checked="checked"{/if} onClick="location.href='{$thisUrl}?page={$thisPage}&site_sort=target_percent&selected_site={$selectedSite}';">Percent of target
- <span class="sortBy">Storage:</span>
- <input type="radio" name="site_sort" value="storage" {if $site_sort == 'storage'} checked="checked"{/if} onClick="location.href='{$thisUrl}?page={$thisPage}&site_sort=storage&selected_site={$selectedSite}';">Maximum for Month
- <input type="radio" name="site_sort" value="disk_target_percent" {if $site_sort == 'disk_target_percent'} checked="checked"{/if} onClick="location.href='{$thisUrl}?page={$thisPage}&site_sort=disk_target_percent&selected_site={$selectedSite}';">Percent of target
- <div class="pickContainer">
- <pre class=""> ----------------- Traffic ------------- --------------- Storage --------------</pre>
- <pre class="pseudoPickTitles">Website Last Month Target % of Target Last Month Target % of Target</pre>
- <div class="pseudoPick">
- {foreach $websites as $site}
- <pre class="pseudoPickOption"></span>{if $site.name == $selectedSite}<a name="selectedSite"></a>{/if}<a href="{$thisUrl}?page={$thisPage}&selected_site={$site.name}&site_id={$site.id}&site_sort={$site_sort}" class="pseudoPickOption" {if $site.name == $selectedSite}onClick="return false;"{/if}><span{if $site.name == $selectedSite} style="background-color: LightGray;"{/if}>{$site.name|string_format:"%-50s"} {$site.data_total|string_format:"%6.1f"} GB {$site.target|string_format:"%8.1f"} GB <span {if $site.target_percent > $threshold}style="color: red;"{/if}>{$site.target_percent|string_format:"%6.0f"}%</span> {$site.storage|string_format:"%6.1f"} GB {$site.disk_target|string_format:"%8.1f"} GB <span {if $site.disk_target_percent > $threshold}style="color: red;"{/if}>{$site.disk_target_percent|string_format:"%6.0f"}%</span></span></a></pre>
- {/foreach}
+
+ {* Form Start *}
+ {$ui = [
+ 'action' => "{$thisUrl}?page={$thisPage}&selected_site={$selectedSite}",
+ 'method' => 'POST',
+ 'validate' => true,
+ 'validateFocusMsg' => true
+ ]}
+ {include file="ui/f6/form-start.html"}
+
+
+ <span class="sortByTitle">Sort By: </span>
+ <input type="radio" name="site_sort" value="site_name" {if $site_sort == 'site_name'} checked="checked"{/if} onClick="location.href='{$thisUrl}?page={$thisPage}&site_sort=site_name&selected_site={$selectedSite}';">Site Name
+ <span class="sortBy">Traffic:</span>
+ <input type="radio" name="site_sort" value="data_total" {if $site_sort == 'data_total'} checked="checked"{/if} onClick="location.href='{$thisUrl}?page={$thisPage}&site_sort=data_total&selected_site={$selectedSite}';">Total for Month
+ <input type="radio" name="site_sort" value="target_percent" {if $site_sort == 'target_percent'} checked="checked"{/if} onClick="location.href='{$thisUrl}?page={$thisPage}&site_sort=target_percent&selected_site={$selectedSite}';">Percent of target
+ <span class="sortBy">Storage:</span>
+ <input type="radio" name="site_sort" value="storage" {if $site_sort == 'storage'} checked="checked"{/if} onClick="location.href='{$thisUrl}?page={$thisPage}&site_sort=storage&selected_site={$selectedSite}';">Maximum for Month
+ <input type="radio" name="site_sort" value="disk_target_percent" {if $site_sort == 'disk_target_percent'} checked="checked"{/if} onClick="location.href='{$thisUrl}?page={$thisPage}&site_sort=disk_target_percent&selected_site={$selectedSite}';">Percent of target
+ <div class="pickContainer">
+ <pre class=""> ----------------- Traffic ------------- --------------- Storage --------------</pre>
+ <pre class="pseudoPickTitles">Website Last Month Target % of Target Last Month Target % of Target</pre>
+ <div class="pseudoPick">
+ {foreach $websites as $site}
+ <pre class="pseudoPickOption"></span>{if $site.name == $selectedSite}<a name="selectedSite"></a>{/if}<a href="{$thisUrl}?page={$thisPage}&selected_site={$site.name}&site_id={$site.id}&site_sort={$site_sort}" class="pseudoPickOption" {if $site.name == $selectedSite}onClick="return false;"{/if}><span{if $site.name == $selectedSite} style="background-color: LightGray;"{/if}>{$site.name|string_format:"%-50s"} {$site.data_total|string_format:"%6.1f"} GB {$site.target|string_format:"%8.1f"} GB <span {if $site.target_percent > $threshold}style="color: red;"{/if}>{$site.target_percent|string_format:"%6.0f"}%</span> {$site.storage|string_format:"%6.1f"} GB {$site.disk_target|string_format:"%8.1f"} GB <span {if $site.disk_target_percent > $threshold}style="color: red;"{/if}>{$site.disk_target_percent|string_format:"%6.0f"}%</span></span></a></pre>
+ {/foreach}
+ </div>
+ <p>Click on a site above to display settings and charts.</p>
+ <hr>
</div>
- <p>Click on a site above to display settings and charts.</p>
- <hr>
- </div>
-
- {if $selectedSite}
-
- <div>
- <a href="{$ajaxUrl}?action=glm_server_stats&glm_action=ajaxSendUsageReport&selected_site={$selectedSite}" target="usageEmail" class="button button-secondary">Send usage E-mail for site selected above</a>
- <a href="{$ajaxUrl}?action=glm_server_stats&glm_action=ajaxSendUsageReport&selected_site={$selectedSite}&display_only=true" target="usageEmail" class="button button-secondary">Display usage E-mail for site selected above</a>
- </div>
-
- {/if}
+
+ {if $selectedSite}
+
+ <div>
+ <a href="{$ajaxUrl}?action=glm_server_stats&glm_action=ajaxSendUsageReport&selected_site={$selectedSite}" target="usageEmail" class="button button-secondary">Send usage E-mail for site selected above</a>
+ <a href="{$ajaxUrl}?action=glm_server_stats&glm_action=ajaxSendUsageReport&selected_site={$selectedSite}&display_only=true" target="usageEmail" class="button button-secondary">Display usage E-mail for site selected above</a>
+ </div>
+
+ {/if}
+
+ {include file="ui/f6/form-end.html"}
{include file="ui/f6/miscContainer-end.html"}
{include file="ui/f6/section-end.html"}
+
+ {include file="ui/f6/grid-end.html"}
- {* Section Start *}
+ {* Form Start *}
+ {$ui = [
+ 'action' => "{$thisUrl}?page={$thisPage}&selected_site={$selectedSite}",
+ 'method' => 'POST',
+ 'validate' => true,
+ 'validateFocusMsg' => true
+ ]}
+ {include file="ui/f6/form-start.html"}
+
+ <input type="hidden" name="option" value="update_site">
+ <input type="hidden" name="site_sort" value="$site_sort">
+ <input type="hidden" name="selected_site" value="{$selectedSite}">
+
+ {* Grid Start *}
{$ui = [
- 'title' => 'Settings for Selected Site'
+ 'sectionColor' => '#ffE',
+ 'nowrap' => true
]}
- {include file="ui/f6/section-start.html"}
-
- {* target *}
+ {include file="ui/f6/grid-start.html"}
+
+ {* Section Start *}
{$ui = [
- 'field' => 'target',
- 'value' => {$settings.target|string_format:"%.1f"},
- 'label' => 'Monthly Traffic Target',
- 'required' => true,
- 'placeholder' => 'i.e. 2.000 for 2 Gigabytes'
+ 'title' => 'Settings for Selected Site'
]}
- {include file="ui/f6/text.html"}
-
- {* disk_target *}
+ {include file="ui/f6/section-start.html"}
+
+ {* target *}
+ {$ui = [
+ 'field' => 'target',
+ 'value' => {$settings.target|string_format:"%.1f"},
+ 'label' => 'Monthly Traffic Target',
+ 'required' => true,
+ 'placeholder' => 'i.e. 2.000 for 2 Gigabytes'
+ ]}
+ {include file="ui/f6/text.html"}
+
+ {* disk_target *}
+ {$ui = [
+ 'field' => 'disk_target',
+ 'value' => {$settings.disk_target|string_format:"%.1f"},
+ 'label' => 'Disk Space Used Target',
+ 'required' => true,
+ 'placeholder' => 'i.e. 2.000 for 2 Gigabytes'
+ ]}
+ {include file="ui/f6/text.html"}
+
+ {* cust_contact *}
+ {$ui = [
+ 'field' => 'cust_contact',
+ 'value' => {$settings.cust_contact},
+ 'label' => 'Customer Contact E-Mail',
+ 'required' => true
+ ]}
+ {include file="ui/f6/text.html"}
+
+ {include file="ui/f6/section-end.html"}
+
+ {* Section Start *}
{$ui = [
- 'field' => 'disk_target',
- 'value' => {$settings.disk_target|string_format:"%.1f"},
- 'label' => 'Disk Space Used Target',
- 'required' => true,
- 'placeholder' => 'i.e. 2.000 for 2 Gigabytes'
+ 'title' => 'Global Settings'
]}
- {include file="ui/f6/text.html"}
-
- {* cust_contact *}
+ {include file="ui/f6/section-start.html"}
+
+ {* Reporting Threshold *}
+ {$ui = [
+ 'field' => 'threshold',
+ 'value' => {$threshold|string_format:"%.0f"},
+ 'label' => 'Reporting Threshold %',
+ 'required' => true,
+ 'min' => 0,
+ 'max' => 200,
+ 'width' => 5,
+ 'helpText' => 'Percentage above which target percentage should be highlighted in red and site contacts will receive E-Mail reports.'
+ ]}
+ {include file="ui/f6/number.html"}
+
+ {include file="ui/f6/section-end.html"}
+
+ {* Submit Button *}
{$ui = [
- 'field' => 'cust_contact',
- 'value' => {$settings.cust_contact},
- 'label' => 'Customer Contact E-Mail',
- 'required' => true
+ 'class' => 'primary',
+ 'label' => 'Update Site Settings',
+ 'submit' => true
]}
- {include file="ui/f6/text.html"}
+ {include file="ui/f6/submit.html"}
- {include file="ui/f6/section-end.html"}
+ {include file="ui/f6/grid-end.html"}
- {* Section Start *}
- {$ui = [
- 'title' => 'Global Settings'
- ]}
- {include file="ui/f6/section-start.html"}
-
- {* Reporting Threshold *}
- {$ui = [
- 'field' => 'threshold',
- 'value' => {$threshold|string_format:"%.0f"},
- 'label' => 'Reporting Threshold %',
- 'required' => true,
- 'min' => 0,
- 'max' => 200,
- 'width' => 5,
- 'helpText' => 'Percentage above which target percentage should be highlighted in red and site contacts will receive E-Mail reports.'
- ]}
- {include file="ui/f6/number.html"}
-
- {include file="ui/f6/section-end.html"}
-
- {* Submit Button *}
- {$ui = [
- 'class' => 'primary',
- 'label' => 'Update Site Settings',
- 'submit' => true
- ]}
- {include file="ui/f6/submit.html"}
-
- {include file="ui/f6/grid-end.html"}
-
- {include file="ui/f6/form-end.html"}
+ {include file="ui/f6/form-end.html"}
{/if} {* /is provider *}
<div class="usage-section">Customer Section</div>
<!-- Server Data Usage Stats -->
- <div style="width: 95%;">
+ <div style="width: 95%;" class="callout">
<center>
<span class="button button-secondary" id="guideButton">Explanation of Usage and Graphs</span>
<span class="button button-secondary graph-print" data-areaToPrint="StatsPrintArea">Print Page</span>
text-align: left;
vertical-align: top;
white-space: nowrap;
- padding-right: 20px;
+ padding: 0px;
}
.glmbw-table td {
font-weight: normal;
font-size: .9em;
text-align: left;
vertical-align: top;
- padding-right: 20px;
+ padding: 0px;
+ }
+ .glmbw-table tr {
}
.glmbw-image {
max-width: 90%;
</style>
<div class="print-title" style="text-align: center;">
Usage statistics for site: {$selectedSite|upper} Date:
- <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">
+ <input style="width: 7rem;" 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">
</div>
<center>
<table class="glmbw-table unstriped">
{$serverStats.yesterday.storage|string_format:"%.3f"} Gigabytes
</td>
<td> </td>
+ <td> </td>
</tr>
<tr>
<th>This Month: </th>
<div class="graphTitle">
Monthly traffic totals for the past year. The dotted line is our current/planned billing level.
</div>
- <div class="graph" style="padding-top: 10px;"><img id="twoYearImg" src="{$assetsUrl}/graph.png" class="glmbw-image"></div>
+ <div class="graph" style="padding-top: 0px;"><img id="twoYearImg" src="{$assetsUrl}/graph.png" class="glmbw-image"></div>
</div>
<div class="graphContainer">
<div class="graphTitle">
Montlhy maximum disk space used for past year. The dotted line is our current/planned billing level.
</div>
- <div class="graph" style="padding-top: 10px;"><img id="twoYearStorageImg" src="{$assetsUrl}/graph.png" class="glmbw-image"></div>
+ <div class="graph" style="padding-top: 0px;"><img id="twoYearStorageImg" src="{$assetsUrl}/graph.png" class="glmbw-image"></div>
</div>
<div class="graphContainer">
<div class="graphTitle">
Detail traffic for past 24 hours.
</div>
- <div class="graph" style="padding-top: 10px;"><img id="twoDayImg" src="{$assetsUrl}/graph.png" class="glmbw-image"></div>
+ <div class="graph" style="padding-top: 0px;"><img id="twoDayImg" src="{$assetsUrl}/graph.png" class="glmbw-image"></div>
</div>
<div class="graphContainer">
<div class="graphTitle">
Daily traffic for past two months.
</div>
- <div class="graph" style="padding-top: 10px;"><img id="twoMonthImg" src="{$assetsUrl}/graph.png" class="glmbw-image"></div>
+ <div class="graph" style="padding-top: 0px;"><img id="twoMonthImg" src="{$assetsUrl}/graph.png" class="glmbw-image"></div>
</div>
</center>
</div>
$('.datePrintInclude').hide();
location.href='#selectedSite';
+ location.href='#glmPageTop';
});
</script>
{* Beginning of user interface using view UI elements *}
- <form action="{$thisUrl}?page={$thisPage}" method="post" enctype="multipart/form-data" data-abide novalidate>
- <div data-abide-error class="alert callout" style="display: none;">
- <p><i class="fi-alert"></i> There are some errors in your form. Please check the highlighted fields below.</p>
- </div>
+ {* Form Start *}
+ {$ui = [
+ 'action' => "{$thisUrl}?page={$thisPage}",
+ 'method' => 'post',
+ 'validate' => true,
+ 'validateID' => '1234',
+ 'validateFocusMsg' => true,
+ 'validateMessage' => 'There are some errors in your form. Please check the highlighted fields below.'
+ ]}
+ {include file="ui/f6/form-start.html"}
<input type="hidden" name="option" value="update_connection">
'placeholder' => 'Try: bandwidth.gaslightmedia.com',
'required' => true,
'maxWidth' => 20,
- 'errorText' => 'This is an error!',
- 'helpText' => 'This is a test!'
+ 'errorText' => 'The database host name is required for connecting to the usage database.'
]}
{include file="ui/f6/text.html"}
'label' => 'Database Username',
'placeholder' => 'Try: bandwidthRO',
'required' => true,
- 'maxWidth' => 20
+ 'maxWidth' => 20,
+ 'errorText' => 'The database username is required for connecting to the usage database.'
]}
{include file="ui/f6/text.html"}
'value' => {$db_pass},
'label' => 'Database Password',
'placeholder' => 'Try: ,Wv4W*~^bL_vF3F4PbGsS',
- 'required' => true
+ 'required' => true,
+ 'errorText' => 'The database password for the above username is required for connecting to the usage database.'
]}
{include file="ui/f6/text.html"}
{$ui = [
'field' => 'website',
'value' => {$website},
- 'label' => 'Default Website Name',
+ 'label' => 'Website Name',
'placeholder' => 'i,e, www.gaslightmedia.com',
- 'required' => true
+ 'required' => true,
+ 'errorText' => 'The website host name is required to access settings for this site.'
]}
{include file="ui/f6/text.html"}
'field' => 'send_usage',
'value' => {!empty($send_usage)},
'label' => 'Automatically Send Usage Notices Monthly',
- 'helpText' => 'More help stuff. Arent you excited?'
+ 'helpText' => 'This will enable E-mail notifications of usage beyond the following target to the E-mail
+ contact set for each site. To set the contact address for a particular site, select the
+ "GLM Data Usage" menu on the left, select the desired site, then add the E-mail address
+ in the form on that page.'
]}
{include file="ui/f6/checkbox.html"}
{$ui = [
'field' => 'show_notifications',
'value' => {!empty($show_notifications)},
- 'label' => 'Customer Notiifications'
+ 'label' => 'Customer Notiifications',
+ 'helpText' => 'Turn this on to have general Gaslight Media messages displayed on this site.',
]}
{include file="ui/f6/checkbox.html"}
',
'tip' => '
This text is always displayed at the top of the Cookie Popup and is the only text displayed in the
- Cookie Popup until the user views other notices by clicking the "Show mode" button. This
+ Cookie Popup until the user views other notices by clicking the "Show more" button. This
is important text and should always be included.
'
]}
{include file="ui/f6/section-end.html"}
-
- {include file="ui/f6/grid-end.html"}
-
-<!--
-
-
- {* Section Start *}
- {$ui = [
- 'title' => 'Addional Notices',
- 'helpText' => 'These notices are displayed when the user clicks the "Show more" button.'
- ]}
- {include file="ui/f6/section-start.html"}
-
- {* show_cookie_popup *}
+ {* Submit Button *}
{$ui = [
- 'field' => 'show_cookie_popup',
- 'label' => 'Show Cookie Pop-Up'
+ 'class' => 'primary',
+ 'label' => 'Save Changes',
+ 'submit' => true
]}
- {include file="ui/f6/checkbox.html"}
+ {include file="ui/f6/submit.html"}
- {include file="ui/f6/section-end.html"}
-
-
-
-
- <tr>
- <th>Additional Notices</th>
- <td>These notices are displayed when the user clicks the "Show more" button.
- <br>Select only notices for things that are used in this Website.
- <input type="hidden" name="cookie_opt_gdpr" value="0"><br> <input type="checkbox" name="cookie_opt_gdpr"{if $cookie_opt_gdpr} checked{/if}> GDPR
- <input type="hidden" name="cookie_opt_access_logs" value="0"><br> <input type="checkbox" name="cookie_opt_access_logs"{if $cookie_opt_access_logs} checked{/if}> Access Logs
- <input type="hidden" name="cookie_opt_permanent" value="0"><br> <input type="checkbox" name="cookie_opt_permanent"{if $cookie_opt_permanent} checked{/if}> Permanent Cookies
- <input type="hidden" name="cookie_opt_tracking" value="0"><br> <input type="checkbox" name="cookie_opt_tracking"{if $cookie_opt_tracking} checked{/if}> Tracking Cookies
- <input type="hidden" name="cookie_opt_shared_tracking" value="0"><br> <input type="checkbox" name="cookie_opt_shared_tracking"{if $cookie_opt_shared_tracking} checked{/if}> Shared Tracking Cookies
- <input type="hidden" name="cookie_opt_https" value="0"><br> <input type="checkbox" name="cookie_opt_https"{if $cookie_opt_https} checked{/if}> HTTPS
- <input type="hidden" name="cookie_opt_logged_in" value="0"><br> <input type="checkbox" name="cookie_opt_logged_in"{if $cookie_opt_logged_in} checked{/if}> Logged-In Users
- <input type="hidden" name="cookie_opt_forms" value="0"><br> <input type="checkbox" name="cookie_opt_forms"{if $cookie_opt_forms} checked{/if}> Submission Forms
- <input type="hidden" name="cookie_opt_payment" value="0"><br> <input type="checkbox" name="cookie_opt_payment"{if $cookie_opt_payment} checked{/if}> Payment Forms
- </td>
- </tr>
- </table>
-{if $connectError}
- <h2 class="glm-error">Unable to connect to database! Please check connection settings.</h2>
-{/if}
-
--->
+ {include file="ui/f6/grid-end.html"}
- <p><br><input type="submit" value="Save Changes" class="button-primary"></p>
- </form>
+ {include file="ui/f6/form-end.html"}
</div>
{* End of user interface using view UI elements *}
jQuery(document).ready(function($) {
-{if $forceReload}
- alert('Redirecting due to menu change. Click "OK" to continue.');
- window.location.href = '{$adminUrl}{$reloadUrl}';
-{/if}
+ {if $forceReload}
+ alert('Redirecting due to menu change. Click "OK" to continue.');
+ window.location.href = '{$adminUrl}{$reloadUrl}';
+ {/if}
// 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);
- location.href='#selectedSite';
- window.setTimeout( function() {
- location.href='#glmPageTop';
- }, 500);
-
-
-
});
</script>
--- /dev/null
+{*
+ Foundation 6 Bitmap Field
+ All parameters are required.
+ Only 0ne of $data or $field may be used.
+ Do not list fields if they're false. (We're not checking for false)
+
+ {$ui = [
+ 'value' => string Value of the element
+ 'field' => string Name of field that holds the data if not using data abstract,
+ 'label' => string Label text for this field,
+ 'active' => string Text for active state
+ 'inactive' => string text for inactive state
+ 'required' => boolean True if required,
+ 'helpText' => string Help text for this input,
+ 'errortext' => string Error text that appears when the field doesn't validate,
+ 'dataError' => string Error from data Abstract Class
+ ]}
+*}
+<div class="cell small-12 glm-f6-ui-field">
+ <div class="grid-x grid-margin-x">
+ {foreach $ui.value as $item => $v}
+ <div class="cell small-12">
+ <div class="grid-x grid-margin-x">
+ <div class="cell shrink glm-f6-ui-field-input">
+ <div class="switch small glm-f6-ui-field-input-switch">
+ <input class="switch-input" id="{$ui.field}-{$v.value}" type="checkbox" name="{$ui.field}[{$v.value}]" value="{$v.value}"{if $v.default} checked{/if}>
+ <label for="{$ui.field}-{$v.value}" class="switch-paddle">
+ <span class="show-for-sr">{$v.name}</span>
+ <span class="switch-active" aria-hidden>{$ui.active|default:'On'}</span>
+ <span class="switch-inactive" aria-hidden>{$ui.inactive|default:'Off'}</span>
+ </label>
+ </div>
+
+ </div>
+ <div class="cell auto glm-f6-ui-label-container-right">
+ <label for="{$ui.field}-{$v.value}" class="glm-f6-ui-field-label">{$v.name}</label>
+ </div>
+ </div>
+ </div>
+ <div class="cell small-12">
+
+ </div>
+ {/foreach}
+ <div class="cell small-12">
+ {if isset($ui.dataError) && $ui.dataError}<span class="form-error is-visible glm-f6-ui-field-data-error">{$ui.dataError}</span>{/if}
+ {if isset($ui.errorText)}<span id="{$ui.field}_ErrorText" class="form-error glm-f6-ui-field-error-text" data-form-error-for="{$ui.field}">{$ui.errorText}</span>{/if}
+ {if isset($ui.helpText)}<span class="glm-f6-ui-field-help-text" id="{$ui.field}_HelpText">{$ui.helpText}</span]>{/if}
+ </div>
+ </div>
+</div>
+{*
+ <tr>
+ <th class="glm-nowrap-left-align{if $regSettings.fieldRequired.cc_accepts} glmÂ-required{/if}">Credit Card Accepted:</th>
+ <td {if $regSettings.fieldFail.cc_accepts}class="glmÂformÂbadÂinput" dataÂtabid="glm-reg-cc-accepts"{/if}>
+ {foreach from=$regSettings.fieldData.cc_accepts.bitmap item=v}
+ <input type="checkbox" name="cc_accepts[{$v.value}]" value="{$v.value}"{if $v.default} checked{/if}>{$v.name}<br>
+ {/foreach}
+ {if $regSettings.fieldFail.cc_accepts}<p>{$regSettings.fieldFail.cc_accepts}</p>{/if}
+ </td>
+ </tr>
+*}
--- /dev/null
+{*
+ Foundation 6 Callout Notice
+
+ {$ui = [
+ 'label' => string Label text for this Callout,
+ 'active' => string True or False if this notice is active
+ 'type' => string Success, Warning, Alert, Primary or Secondary
+ ]}
+*}
+{if $ui.active}
+ <div class="{$ui.type} callout" data-closable>
+ <button class="close-button" aria-label="Close" type="button" data-close>
+ <span aria-hidden="true">×</span>
+ </button>
+ <p>{$ui.label}</p>
+ </div>
+{/if}
+
'required' => boolean True if required,
'helpText' => string Help text for this input,
'errorText' => string Error text that appears when the field doesn't validate,
- 'dataError' => string Error from data Abstract Class,
+ 'dataError' => string Error from data Abstract Class, or other supplied error string
'tip' => string Tool Tip text
]}
*}
<div class="grid-x grid-margin-x">
<div class="cell shrink glm-f6-ui-field-input">
<div class="switch small glm-f6-ui-field-input-switch">
- <input class="switch-input " id="{$ui.field}" type="checkbox" name="{$ui.field}"{if !empty($ui.value)} checked{/if}>
- <label class="switch-paddle" for="{$ui.field}">
- <span class="switch-active" aria-hidden="true">Yes</span>
- <span class="switch-inactive" aria-hidden="true">No</span>
+ <input class="switch-input" id="{$ui.field}" type="checkbox" name="{$ui.field}"{if !empty($ui.value)} checked{/if}{if !empty($ui.required)} required{/if}>
+ <label for="{$ui.field}" class="switch-paddle">
+ <span class="show-for-sr">{$ui.label}</span>
+ <span class="switch-active" aria-hidden>{$ui.active|default:'On'}</span>
+ <span class="switch-inactive" aria-hidden>{$ui.inactive|default:'Off'}</span>
</label>
</div>
</div>
</div>
<div class="cell small-12 glm-f6-ui-field-messages">
{if !empty($ui.helpText)}<span class="glm-f6-ui-field-help-text" id="{$ui.field}_HelpText">{$ui.helpText}</span]>{/if}
+ {if !empty($ui.dataError)}<span class="form-error is-visible glm-f6-ui-field-data-error">{$ui.dataError}</span>{/if}
+ {if !empty($ui.errorText)}<span id="{$ui.field}_ErrorText" class="form-error glm-f6-ui-field-error-text" data-form-error-for="{$ui.field}">{$ui.errorText}</span>{/if}
</div>
</div>
</div>
{*
Foundation 6 UI - Form Start
+
+ WARNING: There may be a problem with using Form Start after Grid Start. Was seeing improper spacing.
+
+ Found that using ".position().top -10" was better since it places the top of the window 10px above the
+ box containing the validate message while using ".offset()" caused it to position in the middle of the
+ validate message.
{$ui = [
'action' => string Required URL
- 'method' => string Required Method "POST" or "GET"
+ 'method' => string Required Method "post" or "get"
'id' => string Form id
- 'File' => boolean If including file upload set to true
+ 'file' => boolean If including file upload set to true
'validate' => boolean If true, include Abide Form Validation
'validateFocusMsg' => boolean If true focuses on validateMessage on error
'validateID' => string Unique text that will be added to the validate message container to ensure that it is unique
- 'validateMessage' => string Message to show when validattion error, If not provided will use "There are some errors in your form."
+ 'validateMessage' => string Message to show for a validation error, Defaults to "There are some errors in your form."
]}
*}
-{$validateMessage = "There are some errors in your form."}
-{if !empty($ui.validate)}{$validateMessage = $ui.validateMessage}{/if}
-
<form
action="{$ui.action}"
method="{$ui.method}"
{if !empty($ui.id)}id="{$ui.id}"{/if}
- {if $ui.file}enctype="multipart/form-data"{/if}
- data-abide novalidate data-validate-on-blur="true"
->
- {if !empty($ui.validate)}
- <div id="validateMessage{if !empty($ui.validateID)}_{$ui.validateID}{/if}" data-abide-error class="alert callout" style="display: none;">
- <p><i class="fi-alert"></i> There are some errors in your form.</p>
- </div>
- {if !empty(validateFocusMsg)}
- <script>
- $(document).on("forminvalid.zf.abide", function(ev,frm) {
-{* For some reason this is not working. Need to figure this out *}
- document.getElementById("validateMessage{if !empty($ui.validateID)}_{$ui.validateID}{/if}").focus();
+ {if !empty($ui.file)}enctype="multipart/form-data"{/if}
+ data-abide novalidate data-validate-on-blur="true">
+
+{if !empty($ui.validate)}
+ <div id="validateMessage{if !empty($ui.validateID)}_{$ui.validateID}{/if}" data-abide-error class="alert callout" style="display: none;">
+ <p><i class="fi-alert"></i> {$ui.validateMessage|default:'There are some errors in your form.'}</p>
+ </div>
+ {if !empty($ui.validateFocusMsg)}
+ <script>
+ jQuery(document).ready(function(){
+
+ $(document).on( 'forminvalid.zf.abide', function( ev, frm ) {
+ console.log( 'forminvalid' );
+
+
+ $("html, body").animate({ scrollTop: $('#validateMessage{if !empty($ui.validateID)}_{$ui.validateID}{/if}').position().top -10 }, 'slow');
});
- </script>
- {/if}
+ });
+ </script>
{/if}
+{/if}
*}
</div>
</div>
-
<script>
jQuery(document).ready(function($) {
$(document).foundation();
});
-</script>
+</script>
\ No newline at end of file
'sectionColor' => string background color of sections
]}
- NOTE: The js/foundation-6.min.js and css/foundation-6.min.css files must be enqueued for this to work.
-
*}
{$glm_f6_ui_wrapsize = 6 scope="global"}
background-color: {$glm_f6_ui_section_color} !important;
}
.glm-f6-ui-field {
- margin-bottom: .5rem !important;
+ margin-bottom: 1rem !important;
}
.glm-f6-ui-label-container {
}
margin-bottom: 0 !important;
}
.glm-f6-ui-text-line {
- margin-bottom: 1.2rem !important;
+ margin-bottom: 1rem !important;
}
</style>
<div class="grid-container callout grid-margin-x glm-foundation-6-ui">
<div class="grid-x grid-margin-x">
-
-
'value' => string Value of the element
'field' => string Name of field that holds the data if not using data abstract,
'label' => string Label text for this field,
+ 'button' => string Text for the Button
'required' => boolean True if required,
'helpText' => string Help text for this input,
'errorText' => string Error text that appears when the field doesn't validate,
'dataError' => string Error from data Abstract Class
]}
*}
-<div class="grid-x grid-margin-x">
- <div class="cell small-12">
- <label for="{$ui.field}" class="{if $ui.required} glm-required{/if}">{$ui.label}:</label>
- <div class="grid-x grid-margin-x">
- {if $ui.value}
- <div class="cell small-12 medium-6">
- <div class="glm-galleryImage" data-id="{$ui.field}">
- <img src="{$glmPluginMediaUrl}/images/small/{$ui.value}">
- </div>
- </div>
- <div class="cell small-12 medium-6">
- <br>
- <input type="checkbox" name="{$ui.field}_delete"> Delete {$ui.label}<br>
- <span>{$ui.value}</span>
- <br>
+<div class="cell small-12">
+ <label for="{$ui.field}" class="{if $ui.required} glm-required{/if}">{$ui.label}:</label>
+ <div class="grid-x grid-margin-x">
+ {if $ui.value}
+ <div class="cell small-12 medium-6">
+ <div class="glm-galleryImage" data-id="{$ui.field}">
+ <img src="{$glmPluginMediaUrl}/images/small/{$ui.value}">
</div>
- {/if}
- <div class="cell small-12">
- <b>New {$ui.label}</b>
- <label for="{$ui.field}_button" class="button">Browse</label>
- <input type="file" class="show-for-sr" id="{$ui.field}_button" name="{$ui.field}_new">
</div>
- <div id="glm-galleryImageLarger_image" class="glm-imageDialog"><img src="{$glmPluginMediaUrl}/images/large/{$ui.field}"></div>
- </div>
+ <div class="cell small-12 medium-6">
+ <br>
+ <input type="checkbox" name="{$ui.field}_delete"> Delete {$ui.label}<br>
+ <span>{$ui.value}</span>
+ <br>
+ </div>
+ {/if}
<div class="cell small-12">
- {if $ui.dataError}<span class="form-error is-visible">{$ui.dataError}</span>{/if}
- {if isset($ui.helpText)}<p class="help-text" id="{$ui.field}_HelpText">{$ui.helpText}</p>{/if}
- {if isset($ui.errorText)}<span id="{$ui.field}_ErrorText" class="form-error">{$ui.errorText}</span>{/if}
+ <b>New {$ui.label}</b>
+ <label for="{$ui.field}_button" class="button primary">{if !empty($ui.button)}{$ui.button}{else}Browse{/if}</label>
+ <input type="file" class="show-for-sr" id="{$ui.field}_button" name="{$ui.field}_new">
</div>
+ <div id="glm-galleryImageLarger_image" class="glm-imageDialog"><img src="{$glmPluginMediaUrl}/images/large/{$ui.field}"></div>
+ </div>
+ <div class="cell small-12">
+ {if $ui.dataError}<span class="form-error is-visible">{$ui.dataError}</span>{/if}
+ {if !empty($ui.helpText)}<p class="help-text" id="{$ui.field}_HelpText">{$ui.helpText}</p>{/if}
+ {if !empty($ui.errorText)}<span id="{$ui.field}_ErrorText" class="form-error">{$ui.errorText}</span>{/if}
</div>
</div>
'dataError' => string Error from data Abstract Class
]}
*}
-<div class="grid-x grid-margin-x">
- <div class="cell small-12">
- <label>{$ui.label}</label>
- {if isset($ui.list) && $ui.list}
- {foreach $ui.list as $checkbox => $checkboxLabel}
- <label class="{if $ui.reouired} glm-required{/if}">
- <input
- type="checkbox"
- id="{$checkbox}"
- name="{$checkbox}"
- {if $ui.value.$checkbox} checked{/if} />
- {$checkboxLabel}
- </label>
- {/foreach}
- {/if}
-
- {if $ui.dataError}<span class="form-error is-visible">{$ui.dataError}</span>{/if}
- {if isset($ui.helpText)}<p class="help-text" id="{$field}_HelpText">{$ui.helpText}</p>{/if}
- {if isset($ui.errorText)}<span id="{$field}_ErrorText" class="form-error">{$ui.errorText}</span>{/if}
- </div>
+<div class="cell small-12">
+ <label>{$ui.label}</label>
+ {if isset($ui.list) && $ui.list}
+ {foreach $ui.list as $checkbox => $checkboxLabel}
+ <label class="{if !empty($ui.reouired)}glm-required{/if}">
+ <input
+ type="checkbox"
+ id="{$checkbox}"
+ name="{$checkbox}"
+ {if $ui.value.$checkbox} checked{/if} />
+ {$checkboxLabel}
+ </label>
+ {/foreach}
+ {/if}
+ {if !empty($ui.dataError)}<span class="form-error is-visible">{$ui.dataError}</span>{/if}
+ {if !empty($ui.helpText)}<p class="help-text" id="{$ui.field}_HelpText">{$ui.helpText}</p>{/if}
+ {if !empty($ui.errorText)}<span id="{$ui.field}_ErrorText" class="form-error">{$ui.errorText}</span>{/if}
</div>
'dataError' => string Error from data Abstract Class
]}
*}
-<div class="grid-x grid-margin-x">
- <div class="cell small-12">
- <label for="{$ui.field}" class="{if $ui.required} glm-required{/if}">{$ui.label}</label>
- <select
- id="{$ui.field}"
- name="{$ui.field}[]"
- multiple="multiple"
- size="{$ui.l_size}"
- {if $ui.required}required{/if} >
+<div class="cell small-12">
+ <label for="{$ui.field}" class="{if $ui.required} glm-required{/if}">{$ui.label}</label>
+ <select
+ id="{$ui.field}"
+ name="{$ui.field}[]"
+ multiple="multiple"
+ size="{$ui.l_size}"
+ {if $ui.required}required{/if} >
- {if $ui.l_blank}<option value=""></option>{/if}
+ {if $ui.l_blank}<option value=""></option>{/if}
- {foreach $ui.list as $v}
- <option value="{$v.id}"{if in_array($v.id, $ui.value)} selected{/if}>{$v.name}</option>
- {/foreach}
- </select>
- {if isset($ui.dataError)}<span class="form-error is-visible">{$ui.dataError}</span>{/if}
- {if isset($ui.helpText)}<p class="help-text" id="{$ui.field}_HelpText">{$ui.helpText}</p>{/if}
- {if isset($ui.errorText)}<span id="{$ui.field}_ErrorText" class="form-error">{$ui.errorText}</span>{/if}
+ {foreach $ui.list as $k => $v}
+ {if isset($ui.l_value) && isset($ui.l_label)}
+ <option value="{$v[$ui.l_value]}"{if in_array($v[$ui.l_value], $ui.value)} selected="selected"{/if}>{$v[$ui.l_label]}</option>
+ {else}
+ <option value="{$k}"{if in_array($k, $ui.value)} selected="selected"{/if}>{$v}</option>
+ {/if}
+ {/foreach}
+ </select>
+
+ {if isset($ui.dataError)}<span class="form-error is-visible">{$ui.dataError}</span>{/if}
+ {if isset($ui.helpText)}<p class="help-text" id="{$ui.field}_HelpText">{$ui.helpText}</p>{/if}
+ {if isset($ui.errorText)}<span id="{$ui.field}_ErrorText" class="form-error">{$ui.errorText}</span>{/if}
- </div>
</div>
'message' => string Message string to display between label and input,
'helpText' => string Help text for this input,
'errorText' => string Error text that appears when the field doesn't validate
+ 'tip' => string String to display when hover over question mark on right
]}
*}
{if empty($ui.width)}
>
</div>
<div class="cell auto glm-f6-ui-label-container-right">
+ {if isset($ui.tip)}
+ <span style="float:right;" data-tooltip aria-haspopup="true" class="has-tip" data-disable-hover="false" title="{$ui.tip}">?</span>
+ {/if}
<label for="{$ui.field}" class="{if !empty($ui.required)} glm-required{/if} glm-f6-ui-field-label">{$ui.label}</label>
</div>
<div class="cell small-12 glm-f6-ui-field-messages">
--- /dev/null
+{*
+ Foundation 6 Pagination
+
+ {$ui = [
+ 'limit' => integer
+ 'total' => integer
+ 'prevStart' => integer
+ 'nextStart' => integer
+ ]}
+*}
+<nav aria-label="Pagination">
+ <ul class="pagination">
+ <li class="pagination-previous disabled">Previous <span class="show-for-sr">page</span></li>
+ <li class="current"><span class="show-for-sr">You're on page</span> 1</li>
+ <li><a href="#" aria-label="Page 2">2</a></li>
+ <li><a href="#" aria-label="Page 3">3</a></li>
+ <li><a href="#" aria-label="Page 4">4</a></li>
+ <li class="ellipsis" aria-hidden="true"></li>
+ <li><a href="#" aria-label="Page 12">12</a></li>
+ <li><a href="#" aria-label="Page 13">13</a></li>
+ <li class="pagination-next"><a href="#" aria-label="Next page">Next <span class="show-for-sr">page</span></a></li>
+ </ul>
+</nav>
{else}
<div class="cell small-12 glm-f6-ui-section-title">
{if isset($ui.tip)}
- <span style="float:right;" data-tooltip aria-haspopup="true" class="has-tip .left" data-disable-hover="false" tabindex=1 title="{$ui.tip}">?</span>
+ <span style="float:right;" data-tooltip title="{$ui.tip}">?</span>
{/if}
<h3>{$ui.title}</h3>
{if isset($ui.helpText)}<p class="help-text">{$ui.helpText}</p>{/if}
'dataError' => string Error from data Abstract Class
]}
*}
-<div class="grid-x grid-margin-x">
- <div class="cell small-12">
- <label for="{$ui.field}" class="{if $ui.required} glm-required{/if}">{$ui.label}</label>
- <select
- id="{$ui.field}"
- name="{$ui.field}"
- {if $ui.required}required{/if} >
+<div class="cell small-12">
+ <label for="{$ui.field}" class="{if $ui.required} glm-required{/if}">{$ui.label}</label>
+ <select
+ id="{$ui.field}"
+ name="{$ui.field}"
+ {if $ui.required}required{/if} >
- {if $ui.l_blank}<option value=""></option>{/if}
+ {if $ui.l_blank}<option value=""></option>{/if}
- {foreach $ui.list as $v}
- {if isset($ui.l_value) && isset($ui.l_label)}
- <option value="{$v[$ui.l_value]}"{if $ui.value == $v[$ui.l_value]} selected="selected"{/if}>{$v[$ui.l_label]}</option>
- {else}
- <option value="{$v}"{if $ui.value == $v} selected="selected"{/if}>{$v}</option>
- {/if}
- {/foreach}
- </select>
+ {foreach $ui.list as $k => $v}
+ {if isset($ui.l_value) && isset($ui.l_label)}
+ <option value="{$v[$ui.l_value]}"{if $ui.value == $v[$ui.l_value]} selected="selected"{/if}>{$v[$ui.l_label]}</option>
+ {else}
+ <option value="{$k}"{if $ui.value == $k} selected="selected"{/if}>{$v}</option>
+ {/if}
+ {/foreach}
+ </select>
- {if isset($ui.dataError) && $ui.dataError}<span class="form-error is-visible">{$ui.dataError}</span>{/if}
- {if isset($ui.helpText)}<p class="help-text" id="{$ui.field}_HelpText">{$ui.helpText}</p>{/if}
- {if isset($ui.errorText)}<span id="{$ui.field}_ErrorText" class="form-error">{$ui.errorText}</span>{/if}
+ {if !empty($ui.dataError)}<span class="form-error is-visible">{$ui.dataError}</span>{/if}
+ {if !empty($ui.helpText)}<p class="help-text" id="{$ui.field}_HelpText">{$ui.helpText}</p>{/if}
+ {if !empty($ui.errorText)}<span id="{$ui.field}_ErrorText" class="form-error">{$ui.errorText}</span>{/if}
- </div>
</div>
{*
- Foundation 6 - Submit Button
+ Foundation 6 Submit Button
+
+ Button Colors:
+ primary = blue
+ secondary = grey
+ success = green
+ alert = red
+ warning = yellow
{$ui = [
'class' => string Required One of "primary", "secondary", "alert", "success", and "warning" and any addtional desired classes
'submit' => boolean True if this is a submit button
'id' => string Optional ID for this button
'small' => boolean True to select a small button
+ 'cancel' => string Optional URL for cancel button
]}
*}
<div class="cell small-12 glm-f6-ui-field">
<button
- {if !empty($ui.id)}id={$ui.id}{/if}
+ {if !empty($ui.id)}id="{$ui.id}"{/if}
{if !empty($ui.submit)}type="submit"{/if}
- class="button{if !empty($ui.small)} button-small{/if} {$ui.class}"
- >
+ class="button {$ui.class|default:'primary'}{if !empty($ui.small)} button-small{/if}"
+ >
{$ui.label}
</button>
+ {if !empty($ui.cancel)}<a href="{$ui.cancel}" class="button secondary">Cancel</a>{/if}
</div>
'placeholder' => string Placeholder string,
'required' => boolean True if required,
'maxWidth' => string Size of input field using standard style notation ('900px', '15rem', ...),
- 'maxlength' => integer Maximum number of characters that may be entered,
+ 'maxLength' => integer Maximum number of characters that may be entered,
'helpText' => string Help text for this input,
'errorText' => string Error text that appears when the field doesn't validate,
'dataError' => string Error from data Abstract Class
'tip' => string String to display when hover over question mark on right
+ 'class' => string Additional Classes for the main cell div
]}
*}
-<div class="cell small-12 glm-f6-ui-field">
+<div class="cell small-12 glm-f6-ui-field {$ui.class|default:''}">
{if (!isset($ui.value) && !isset($ui.field)) || !isset($ui.label)}
<span class="glm-required">Field Error: Required field information not supplied!</span>
{else}
<div class="grid-x grid-margin-x">
<div class="cell small-12">
{if isset($ui.tip)}
- <span style="float:right;" data-tooltip aria-haspopup="true" class="has-tip" data-disable-hover="false" tabindex=1 title="{$ui.tip}">?</span>
+ <span style="float:right;" data-tooltip aria-haspopup="true" class="has-tip" data-disable-hover="false" title="{$ui.tip}">?</span>
{/if}
<label for="{$ui.field}" class="{if $ui.required} glm-required{/if} glm-f6-ui-field-label">{$ui.label}</label>
</div>
</div>
{/if}
</div>
+
+