Added loading states to Login/Register/Settings buttons.

Teknik/Areas/User/Controllers/UserController.cs

@@ -550,6 +550,11 @@ namespace Teknik.Areas.Users.Controllers
                     model.ErrorMessage = "User Registration is Disabled";
                 }
             }
+            else
+            {
+                model.Error = true;
+                model.ErrorMessage = "Missing Required Fields";
+            }
             return GenerateActionResult(new { error = model.ErrorMessage }, View("/Areas/User/Views/User/ViewRegistration.cshtml", model));
         }
 

Teknik/Areas/User/Scripts/BlogSettings.js

@@ -1,7 +1,7 @@
 $(document).ready(function () {
     $("#update_submit").click(function () {
         // Start Updating Animation
-        $.blockUI({ message: '<div class="text-center"><h3>Updating...</h3></div>' });
+        disableButton('#update_submit', 'Saving...');
         
         blog_title = $("#update_blog_title").val();
         blog_desc = $("#update_blog_description").val();
@@ -13,7 +13,7 @@ $(document).ready(function () {
                 Description: blog_desc,
             }),
             success: function (response) {
-                $.unblockUI();
+                enableButton('#update_submit', 'Save');
                 if (response.result) {
                     $("#top_msg").css('display', 'inline', 'important');
                     $("#top_msg").html('<div class="alert alert-success alert-dismissable"><button type="button" class="close" data-dismiss="alert" aria-hidden="true">&times;</button>Settings Saved!</div>');

Teknik/Areas/User/Scripts/ProfileSettings.js

@@ -1,7 +1,7 @@
 $(document).ready(function () {
     $("#update_submit").click(function () {
         // Start Updating Animation
-        $.blockUI({ message: '<div class="text-center"><h3>Updating...</h3></div>' });
+        disableButton('#update_submit', 'Saving...');
         
         website = $("#update_website").val();
         quote = $("#update_quote").val();
@@ -15,7 +15,7 @@ $(document).ready(function () {
                 About: about
             }),
             success: function (response) {
-                $.unblockUI();
+                enableButton('#update_submit', 'Save');
                 if (response.result) {
                     $("#top_msg").css('display', 'inline', 'important');
                     $("#top_msg").html('<div class="alert alert-success alert-dismissable"><button type="button" class="close" data-dismiss="alert" aria-hidden="true">&times;</button>Settings Saved!</div>');

Teknik/Areas/User/Scripts/SecuritySettings.js

@@ -151,7 +151,7 @@ $(document).ready(function () {
 
     $("#update_submit").click(function () {
         // Start Updating Animation
-        $.blockUI({ message: '<div class="text-center"><h3>Updating...</h3></div>' });
+        disableButton('#update_submit', 'Saving...');
 
         current_password = $("#update_password_current").val();
         password = $("#update_password").val();
@@ -173,7 +173,7 @@ $(document).ready(function () {
                 RecoveryEmail: recovery
             }),
             success: function (response) {
-                $.unblockUI();
+                enableButton('#update_submit', 'Save');
                 if (response.result) {
                     if (response.result.checkAuth)
                     {

Teknik/Areas/User/Scripts/UploadSettings.js

@@ -3,7 +3,7 @@ $(document).ready(function () {
 
     $("#update_submit").click(function () {
         // Start Updating Animation
-        $.blockUI({ message: '<div class="text-center"><h3>Updating...</h3></div>' });
+        disableButton('#update_submit', 'Saving...');
         
         upload_encrypt = $("#update_upload_encrypt").is(":checked");
         $.ajax({
@@ -13,7 +13,7 @@ $(document).ready(function () {
                 Encrypt: upload_encrypt
             }),
             success: function (response) {
-                $.unblockUI();
+                enableButton('#update_submit', 'Save');
                 if (response.result) {
                     $("#top_msg").css('display', 'inline', 'important');
                     $("#top_msg").html('<div class="alert alert-success alert-dismissable"><button type="button" class="close" data-dismiss="alert" aria-hidden="true">&times;</button>Settings Saved!</div>');

Teknik/Areas/User/Views/User/Settings/BlogSettings.cshtml

@@ -29,8 +29,8 @@
     <div class="row">
         <div class="form-group col-sm-10">
             <br />
-            <button class="btn btn-lg btn-success" id="update_submit" type="submit"><i class="glyphicon glyphicon-ok-sign"></i> Save</button>
-            <button class="btn btn-lg" type="reset"><i class="glyphicon glyphicon-repeat"></i> Reset</button>
+            <button class="btn btn-lg btn-success" id="update_submit" type="submit">Save</button>
+            <button class="btn btn-lg" type="reset">Reset</button>
         </div>
     </div>
 </form>

Teknik/Areas/User/Views/User/Settings/ProfileSettings.cshtml

@@ -34,8 +34,8 @@
     <div class="row">
         <div class="form-group col-sm-10">
             <br />
-            <button class="btn btn-lg btn-success" id="update_submit" type="submit"><i class="glyphicon glyphicon-ok-sign"></i> Save</button>
-            <button class="btn btn-lg" type="reset"><i class="glyphicon glyphicon-repeat"></i> Reset</button>
+            <button class="btn btn-lg btn-success" id="update_submit" type="submit">Save</button>
+            <button class="btn btn-lg" type="reset">Reset</button>
         </div>
     </div>
 </form>

Teknik/Areas/User/Views/User/Settings/SecuritySettings.cshtml

@@ -171,8 +171,8 @@
     <div class="row">
         <div class="form-group col-sm-10">
             <br />
-            <button class="btn btn-lg btn-success" id="update_submit" type="submit"><i class="glyphicon glyphicon-ok-sign"></i> Save</button>
-            <button class="btn btn-lg" type="reset"><i class="glyphicon glyphicon-repeat"></i> Reset</button>
+            <button class="btn btn-lg btn-success" id="update_submit" type="submit">Save</button>
+            <button class="btn btn-lg" type="reset">Reset</button>
         </div>
     </div>
 </form>

Teknik/Areas/User/Views/User/Settings/UploadSettings.cshtml

@@ -29,8 +29,8 @@
     <div class="row">
         <div class="form-group col-sm-10">
             <br />
-            <button class="btn btn-lg btn-success" id="update_submit" type="submit"><i class="glyphicon glyphicon-ok-sign"></i> Save</button>
-            <button class="btn btn-lg" type="reset"><i class="glyphicon glyphicon-repeat"></i> Reset</button>
+            <button class="btn btn-lg btn-success" id="update_submit" type="submit">Save</button>
+            <button class="btn btn-lg" type="reset">Reset</button>
         </div>
     </div>
 </form>

Teknik/Scripts/common.js

@@ -13,6 +13,13 @@ $(document).ready(function () {
     });
 
     $("#loginSubmit").click(function () {
+        // Reset login status messages
+        $("#loginStatus").css('display', 'none', 'important');
+        $("#loginStatus").html('');
+
+        // Disable the login button
+        disableButton('#loginSubmit', 'Signing In...');
+
         var form = $('#loginForm');
         $.ajax({
             type: "POST",
@@ -27,16 +34,12 @@ $(document).ready(function () {
                     window.location = html.result;
                 }
                 else {
-                    var errMsg = html;
-                    if (html.error) {
-                        errMsg = html.error;
-                        if (html.error.message) {
-                            errMsg = html.error.message;
-                        }
-                    }
                     $("#loginStatus").css('display', 'inline', 'important');
-                    $("#loginStatus").html('<div class="alert alert-danger alert-dismissable"><button type="button" class="close" data-dismiss="alert" aria-hidden="true">&times;</button>' + errMsg + '</div>');
+                    $("#loginStatus").html('<div class="alert alert-danger alert-dismissable"><button type="button" class="close" data-dismiss="alert" aria-hidden="true">&times;</button>' + parseErrorMessage(html) + '</div>');
                 }
+
+                // Re-enable the login button
+                enableButton('#loginSubmit', 'Sign In');
             }
         });
         return false;
@@ -51,6 +54,13 @@ $(document).ready(function () {
     });
 
     $("#registerSubmit").click(function () {
+        // Reset register status messages
+        $("#registerStatus").css('display', 'none', 'important');
+        $("#registerStatus").html('');
+
+        // Disable the register button
+        disableButton('#registerSubmit', 'Signing In...');
+
         var form = $('#registrationForm');
         $.ajax({
             type: "POST",
@@ -65,16 +75,12 @@ $(document).ready(function () {
                     window.location.reload();
                 }
                 else {
-                    var errMsg = html;
-                    if (html.error) {
-                        errMsg = html.error;
-                        if (html.error.message) {
-                            errMsg = html.error.message;
-                        }
-                    }
                     $("#registerStatus").css('display', 'inline', 'important');
-                    $("#registerStatus").html('<div class="alert alert-danger alert-dismissable"><button type="button" class="close" data-dismiss="alert" aria-hidden="true">&times;</button>' + errMsg + '</div>');
+                    $("#registerStatus").html('<div class="alert alert-danger alert-dismissable"><button type="button" class="close" data-dismiss="alert" aria-hidden="true">&times;</button>' + parseErrorMessage(html) + '</div>');
                 }
+
+                // Re-enable the register button
+                enableButton('#registerSubmit', 'Sign Up');
             }
         });
         return false;
@@ -152,6 +158,16 @@ $(function () {
     };
 });
 
+function disableButton(btn, text) {
+    $(btn).addClass('disabled');
+    $(btn).text(text);
+}
+
+function enableButton(btn, text) {
+    $(btn).removeClass('disabled');
+    $(btn).text(text);
+}
+
 function removeAmp(code) {
     code = code.replace(/&amp;/g, '&');
     return code;