Adding loading graphic

Add loading graphic functions for startAjax and complete

diff --git a/assets/loading103.gif b/assets/loading103.gif
new file mode 100644 (file)
index 0000000..1f00701
Binary files /dev/null and b/assets/loading103.gif differ

diff --git a/assets/loading25.gif b/assets/loading25.gif
new file mode 100644 (file)
index 0000000..72498aa
Binary files /dev/null and b/assets/loading25.gif differ

diff --git a/models/admin/billing/accounts.php b/models/admin/billing/accounts.php
index c2ab2e6..b664190 100644 (file)
--- a/models/admin/billing/accounts.php
+++ b/models/admin/billing/accounts.php
@@ -501,6 +501,7 @@ class GlmMembersAdmin_billing_accounts extends GlmDataAccounts
             'filterExpired'       => $filterExpired,
             'filterActive'        => $filterActive,
             'filterArchived'      => $filterArchived,
+            'pluginAssetsUrl'     => GLM_MEMBERS_BILLING_PLUGIN_BASE_URL . '/assets/'
         );
 
         // Return status, any suggested view, and any data to controller

diff --git a/models/admin/member/billing.php b/models/admin/member/billing.php
index ad75e2a..7ab390e 100644 (file)
--- a/models/admin/member/billing.php
+++ b/models/admin/member/billing.php
@@ -664,13 +664,15 @@ class GlmMembersAdmin_member_billing // extends GlmDataBilling
                     if ( !$account['status'] ) {
                         $accountUpdateError = true;
                         if ( $this->ajaxSide ) {
-                            echo false;
+                            header( 'Content-type:application/json;charset=utf-8', true );
+                            echo json_encode( false, true );
                             exit;
                         }
                     } else {
                         $accountUpdated = true;
                         if ( $this->ajaxSide ) {
-                            echo true;
+                            header( 'Content-type:application/json;charset=utf-8', true );
+                            echo json_encode( true, true );
                             exit;
                         }
                     }

diff --git a/views/admin/billing/accounts.html b/views/admin/billing/accounts.html
index 03d578e..5e4462d 100644 (file)
--- a/views/admin/billing/accounts.html
+++ b/views/admin/billing/accounts.html
@@ -160,17 +160,25 @@ input[type="text"] {
             var member = $(this).data('member');
             var $modal = $('#glmBillingInfo');
 
-            $.ajax(
-                '{$ajaxUrl}?action=glm_members_admin_ajax&glm_action=ajaxBillingInfo&option=account&member=' + member
-            )
+            $.ajax({
+                url: '{$ajaxUrl}?action=glm_members_admin_ajax&glm_action=ajaxBillingInfo&option=account&member=' + member,
+                beforeSend: startAjax,
+                complete: completeAjax,
+            })
             .done(function(resp){
                     $modal.html(resp).foundation('open').trigger('resizeme.zp.reveal');
                     $('#billingInfoForm').on('submit', function(){
                         var data = $(this).serialize();
-                        $.ajax(
-                            '{$ajaxUrl}?action=glm_members_admin_ajax' + data
-                        ).done(function(rsp){
+                        $.ajax({
+                            url: '{$ajaxUrl}?action=glm_members_admin_ajax&' + data,
+                            beforeSend: startAjax,
+                            complete: completeAjax,
+                        }).done(function(rsp){
                             console.log( 'rsp:', rsp );
+                            var $sucessModal = $('#billingInfoSuccess');
+                            $sucessModal.foundation('open').trigger('resizeme.zp.reveal');
+                        }).fail(function(){
+                            console.log( 'error' );
                         });
                         return false;
                     });
@@ -178,9 +186,13 @@ input[type="text"] {
             );
             return false;
         });
-
-
         $(document).foundation();
+        function startAjax(){
+            $('#glmLoading').show();
+        }
+        function completeAjax(){
+            $('#glmLoading').hide();
+        };
     });
 
 </script>
@@ -189,5 +201,14 @@ input[type="text"] {
         <span aria-hidden="true">&times;</span>
     </button>
 </div>
+<div class="reveal" id="billingInfoSuccess" data-reveal>
+    <h2>Billing Info Updated!</h2>
+    <button class="close-button" data-close aria-label="Close" type="button">
+        <span aria-hidden="true">&times;</span>
+    </button>
+</div>
+<div id="glmLoading" class="" style="display:none; position: absolute; left: 50%; top: 50vh;width: 100%; height: 100%;z-index: 9999;">
+    <img src="{$pluginAssetsUrl}loading25.gif">
+</div>
 
 {include file='admin/footer.html'}

diff --git a/views/admin/billing/editAccount.html b/views/admin/billing/editAccount.html
index d3bc000..0955c83 100644 (file)
--- a/views/admin/billing/editAccount.html
+++ b/views/admin/billing/editAccount.html
@@ -20,6 +20,8 @@
     {if $adminAjaxPassthru}
         <form id="billingInfoForm" action="{$ajaxUrl}?action=glm_members_admin_ajax" method="post">
             <input type="hidden" name="glm_action" value="ajaxBillingInfo" />
+
+            <input class="button button-primary" type="submit" value="{if $haveAccount}Save{else}Create{/if} Account">
     {else}
         <form action="{$thisUrl}?page=glm-members-admin-menu-member" method="post">
             <input type="hidden" name="page" value="glm-members-admin-menu-member" />
@@ -152,7 +154,7 @@
         <div class="glm-billing-field">
             <div class="glm-billing-label{if $account.fieldRequired.email} glm-required{/if}">Billing Email</div>
             <div class="glm-billing-input{if $account.fieldFail.email} glm-form-bad-input{/if}" data-tabid="glm-email">
-                <input type="text" name="email" value="{$account.fieldData.email}" class="glm-form-text-input-medium"{if $account.fieldRequired.email} required{/if}>
+                <input type="email" name="email" value="{$account.fieldData.email}" class="glm-form-text-input-medium"{if $account.fieldRequired.email} required{/if}>
                 {if $account.fieldFail.email}<p>{$account.fieldFail.email}</p>{/if}<br>
             </div>
         </div>
@@ -294,10 +296,7 @@
 
         <input class="button button-primary" type="submit" value="{if $haveAccount}Save{else}Create{/if} Account">
 
-
-
     </form>
-
 </div>
 
 <script>