Improvements for identity module.

src/Volo.Abp.AspNetCore.Mvc.UI.Bootstrap/Localization/Resource/en.json

@@ -2,6 +2,7 @@
   "culture": "en",
   "texts": {
     "Close": "Close",
-    "Save": "Save"
+    "Save": "Save",
+    "SavingWithThreeDot": "Saving..."
   }
 }

src/Volo.Abp.AspNetCore.Mvc.UI.Bootstrap/Localization/Resource/tr.json

@@ -2,6 +2,7 @@
   "culture": "tr",
   "texts": {
     "Close": "Kapat",
-    "Save": "Kaydet"
+    "Save": "Kaydet",
+    "SavingWithThreeDot": "Kaydediliyor..."
   }
 }

src/Volo.Abp.AspNetCore.Mvc.UI.Bootstrap/TagHelpers/AbpCardTagHelper.cs

@@ -1,34 +0,0 @@
-using Microsoft.AspNetCore.Razor.TagHelpers;
-
-namespace Volo.Abp.AspNetCore.Mvc.UI.Bootstrap.TagHelpers
-{
-    public class AbpCardTagHelper : TagHelper
-    {
-        public override void Process(TagHelperContext context, TagHelperOutput output)
-        {
-            //TODO: Remove abp-modal HTML element which is unnecessary!
-            output.TagName = "div";
-            output.Attributes.Add("class", "card"); //TODO: Append class if any exists
-        }
-    }
-
-    public class AbpCardHeaderTagHelper : TagHelper
-    {
-        public override void Process(TagHelperContext context, TagHelperOutput output)
-        {
-            //TODO: Remove abp-modal HTML element which is unnecessary!
-            output.TagName = "div";
-            output.Attributes.Add("class", "card-header"); //TODO: Append class if any exists
-        }
-    }
-
-    public class AbpCardBodyTagHelper : TagHelper
-    {
-        public override void Process(TagHelperContext context, TagHelperOutput output)
-        {
-            //TODO: Remove abp-modal HTML element which is unnecessary!
-            output.TagName = "div";
-            output.Attributes.Add("class", "card-body"); //TODO: Append class if any exists
-        }
-    }
-}

src/Volo.Abp.AspNetCore.Mvc.UI.Bootstrap/TagHelpers/AbpTagHelperAttributeListExtensions.cs

@@ -0,0 +1,34 @@
+using System.Collections.Generic;
+using Microsoft.AspNetCore.Razor.TagHelpers;
+
+namespace Volo.Abp.AspNetCore.Mvc.UI.Bootstrap.TagHelpers
+{
+    public static class AbpTagHelperAttributeListExtensions
+    {
+        public static void AddClass(this TagHelperAttributeList attributes, string className)
+        {
+            var classAttribute = attributes["class"];
+            if (classAttribute == null)
+            {
+                attributes.Add("class", className);
+            }
+            else
+            {
+                //TODO: Check if it's already added before!
+                attributes.SetAttribute("class", classAttribute.Value + " " + className);
+            }
+        }
+
+        public static void RemoveClass(this TagHelperAttributeList attributes, string className)
+        {
+            var classAttribute = attributes["class"];
+            if (classAttribute == null)
+            {
+                return;
+            }
+
+            //Can be optimized?
+            attributes.SetAttribute("class", classAttribute.Value.ToString().Split(' ').RemoveAll(c => c == className).JoinAsString(" "));
+        }
+    }
+}

src/Volo.Abp.AspNetCore.Mvc.UI.Bootstrap/TagHelpers/Card/AbpCardBodyTagHelper.cs

@@ -0,0 +1,14 @@
+using Microsoft.AspNetCore.Razor.TagHelpers;
+
+namespace Volo.Abp.AspNetCore.Mvc.UI.Bootstrap.TagHelpers
+{
+    public class AbpCardBodyTagHelper : TagHelper
+    {
+        public override void Process(TagHelperContext context, TagHelperOutput output)
+        {
+            //TODO: Remove abp-modal HTML element which is unnecessary!
+            output.TagName = "div";
+            output.Attributes.AddClass("card-body");
+        }
+    }
+}

src/Volo.Abp.AspNetCore.Mvc.UI.Bootstrap/TagHelpers/Card/AbpCardHeaderTagHelper.cs

@@ -0,0 +1,14 @@
+using Microsoft.AspNetCore.Razor.TagHelpers;
+
+namespace Volo.Abp.AspNetCore.Mvc.UI.Bootstrap.TagHelpers
+{
+    public class AbpCardHeaderTagHelper : TagHelper
+    {
+        public override void Process(TagHelperContext context, TagHelperOutput output)
+        {
+            //TODO: Remove abp-modal HTML element which is unnecessary!
+            output.TagName = "div";
+            output.Attributes.AddClass("card-header");
+        }
+    }
+}

src/Volo.Abp.AspNetCore.Mvc.UI.Bootstrap/TagHelpers/Card/AbpCardTagHelper.cs

@@ -0,0 +1,14 @@
+using Microsoft.AspNetCore.Razor.TagHelpers;
+
+namespace Volo.Abp.AspNetCore.Mvc.UI.Bootstrap.TagHelpers
+{
+    public class AbpCardTagHelper : TagHelper
+    {
+        public override void Process(TagHelperContext context, TagHelperOutput output)
+        {
+            //TODO: Remove abp-modal HTML element which is unnecessary!
+            output.TagName = "div";
+            output.Attributes.AddClass("card");
+        }
+    }
+}

src/Volo.Abp.AspNetCore.Mvc.UI.Bootstrap/TagHelpers/AbpModalBodyTagHelper.cs → src/Volo.Abp.AspNetCore.Mvc.UI.Bootstrap/TagHelpers/Modal/AbpModalBodyTagHelper.cs

@@ -1,13 +1,13 @@
 using Microsoft.AspNetCore.Razor.TagHelpers;
 
-namespace Volo.Abp.AspNetCore.Mvc.UI.Bootstrap.TagHelpers
+namespace Volo.Abp.AspNetCore.Mvc.UI.Bootstrap.TagHelpers.Modal
 {
     public class AbpModalBodyTagHelper : TagHelper
     {
         public override void Process(TagHelperContext context, TagHelperOutput output)
         {
             output.TagName = "div";
-            output.Attributes.Add("class", "modal-body"); //TODO: Append class if any exists
+            output.Attributes.AddClass("modal-body");
         }
     }
 }

src/Volo.Abp.AspNetCore.Mvc.UI.Bootstrap/TagHelpers/AbpModalFooterTagHelper.cs → src/Volo.Abp.AspNetCore.Mvc.UI.Bootstrap/TagHelpers/Modal/AbpModalFooterTagHelper.cs

@@ -3,7 +3,7 @@ using Microsoft.AspNetCore.Razor.TagHelpers;
 using Microsoft.Extensions.Localization;
 using Volo.Abp.AspNetCore.Mvc.UI.Bootstrap.Localization.Resource;
 
-namespace Volo.Abp.AspNetCore.Mvc.UI.Bootstrap.TagHelpers
+namespace Volo.Abp.AspNetCore.Mvc.UI.Bootstrap.TagHelpers.Modal
 {
     public class AbpModalFooterTagHelper : TagHelper
     {
@@ -17,7 +17,7 @@ namespace Volo.Abp.AspNetCore.Mvc.UI.Bootstrap.TagHelpers
         public override void Process(TagHelperContext context, TagHelperOutput output)
         {
             output.TagName = "div";
-            output.Attributes.Add("class", "modal-footer"); //TODO: Append class if any exists
+            output.Attributes.AddClass("modal-footer");
             output.Content.SetHtmlContent(CreateContent());
         }
 
@@ -26,7 +26,7 @@ namespace Volo.Abp.AspNetCore.Mvc.UI.Bootstrap.TagHelpers
             var sb = new StringBuilder();
 
             sb.AppendLine("<button type=\"button\" class=\"btn btn-secondary\" data-dismiss=\"modal\">" + _localizer["Close"] + "</button>");
-            sb.AppendLine("<button type=\"submit\" class=\"btn btn-primary\" id=\"btnUpdateUserSave\">" + _localizer["Save"] + "</button>");
+            sb.AppendLine("<button type=\"submit\" class=\"btn btn-primary\" data-busy-text=\""+ _localizer["SavingWithThreeDot"] + "\"><i class=\"fa fa-check\"></i> <span>" + _localizer["Save"] + "</span></button>");
 
             return sb.ToString();
         }

src/Volo.Abp.AspNetCore.Mvc.UI.Bootstrap/TagHelpers/AbpModalHeaderTagHelper.cs → src/Volo.Abp.AspNetCore.Mvc.UI.Bootstrap/TagHelpers/Modal/AbpModalHeaderTagHelper.cs

@@ -1,7 +1,7 @@
 using System.Text;
 using Microsoft.AspNetCore.Razor.TagHelpers;
 
-namespace Volo.Abp.AspNetCore.Mvc.UI.Bootstrap.TagHelpers
+namespace Volo.Abp.AspNetCore.Mvc.UI.Bootstrap.TagHelpers.Modal
 {
     public class AbpModalHeaderTagHelper : TagHelper
     {
@@ -10,7 +10,7 @@ namespace Volo.Abp.AspNetCore.Mvc.UI.Bootstrap.TagHelpers
         public override void Process(TagHelperContext context, TagHelperOutput output)
         {
             output.TagName = "div";
-            output.Attributes.Add("class", "modal-header"); //TODO: Append class if any exists
+            output.Attributes.AddClass("modal-header");
             output.Content.SetHtmlContent(CreateContent());
         }
 

src/Volo.Abp.AspNetCore.Mvc.UI.Bootstrap/TagHelpers/AbpModalTagHelper.cs → src/Volo.Abp.AspNetCore.Mvc.UI.Bootstrap/TagHelpers/Modal/AbpModalTagHelper.cs

@@ -1,7 +1,7 @@
 using System.Text;
 using Microsoft.AspNetCore.Razor.TagHelpers;
 
-namespace Volo.Abp.AspNetCore.Mvc.UI.Bootstrap.TagHelpers
+namespace Volo.Abp.AspNetCore.Mvc.UI.Bootstrap.TagHelpers.Modal
 {
     public class AbpModalTagHelper : TagHelper
     {

src/Volo.Abp.Identity.Web/Pages/Identity/Users/CreateModal.cshtml

@@ -14,6 +14,7 @@
     <abp-modal-body>
 
         <form method="post" asp-page="/Identity/Users/CreateModal">
+            
             <ul class="nav nav-tabs" role="tablist">
                 <li class="nav-item">
                     <a class="nav-link active" data-toggle="tab" href="#CreateUser_UserInfo" role="tab">@Localizer["CreateUser"]</a>
@@ -29,19 +30,19 @@
 
                     <div class="form-group">
                         <label asp-for="UserInfo.UserName"></label>
-                        <input asp-for="UserInfo.UserName" class="form-control" />
+                        <input asp-for="UserInfo.UserName" class="form-control"/>
                     </div>
                     <div class="form-group">
                         <label asp-for="UserInfo.Password"></label>
-                        <input asp-for="UserInfo.Password" class="form-control" />
+                        <input asp-for="UserInfo.Password" class="form-control"/>
                     </div>
                     <div class="form-group">
                         <label asp-for="UserInfo.Email"></label>
-                        <input asp-for="UserInfo.Email" class="form-control" />
+                        <input asp-for="UserInfo.Email" class="form-control"/>
                     </div>
                     <div class="form-group">
                         <label asp-for="UserInfo.PhoneNumber"></label>
-                        <input asp-for="UserInfo.PhoneNumber" class="form-control" />
+                        <input asp-for="UserInfo.PhoneNumber" class="form-control"/>
                     </div>
 
                 </div>
@@ -50,11 +51,11 @@
                     {
                         <div class="form-check">
                             <label asp-for="@Model.Roles[i].IsAssigned" class="form-check-label">
-                                <input asp-for="@Model.Roles[i].IsAssigned" class="form-check-input" />
+                                <input asp-for="@Model.Roles[i].IsAssigned" class="form-check-input"/>
                                 @Model.Roles[i].Name
                             </label>
                         </div>
-                        <input asp-for="@Model.Roles[i].Name" />
+                        <input asp-for="@Model.Roles[i].Name"/>
                     }
                 </div>
 

src/Volo.Abp.Identity.Web/Pages/Identity/Users/EditModal.cshtml.cs

@@ -2,6 +2,7 @@ using System;
 using System.Collections.Generic;
 using System.ComponentModel.DataAnnotations;
 using System.Linq;
+using System.Threading;
 using System.Threading.Tasks;
 using Microsoft.AspNetCore.Mvc;
 using Volo.Abp.AspNetCore.Mvc.RazorPages;

src/Volo.Abp.Identity.Web/wwwroot/modules/identity/helpers/ModalManager.js

@@ -6,9 +6,26 @@ var abp = abp || {};
 (function ($) {
 
     abp.modals = abp.modals || {};
-
+    
     abp.ModalManager = (function () {
-        
+
+        var CallbackList = function() { //TODO: To a seperated file
+            var _callbacks = [];
+
+            return {
+                add: function(callback) {
+                    _callbacks.push(callback);
+                },
+
+                triggerAll: function(thisObj, argumentList) {
+                    for (var i = 0; i < _callbacks.length; i++) {
+                        _callbacks[i].apply(thisObj, argumentList);
+                    }
+                }
+
+            }
+        };
+
         return function (options) {
 
             var _options = options;
@@ -16,14 +33,15 @@ var abp = abp || {};
             var _$modalContainer = null;
             var _$modal = null;
             var _$form = null;
+
             var _modalId = 'Modal_' + (Math.floor((Math.random() * 1000000))) + new Date().getTime();
             var _modalObject = null;
 
             var _publicApi = null;
             var _args = null;
-            var _getResultCallback = null;
 
-            var _onCloseCallbacks = [];
+            var _onCloseCallbacks = new CallbackList();
+            var _onResultCallbacks = new CallbackList();
 
             function _removeContainer() {
                 _$modalContainer && _$modalContainer.remove();
@@ -47,12 +65,26 @@ var abp = abp || {};
                 _$modal = _$modalContainer.find('.modal');
 
                 _$form = _$modal.find('form');
-                if (!_$form.length) {
+                if (_$form.length) {
+                    if (_$form.attr('data-ajaxForm') !== 'false') {
+                        _$form.ajaxForm({
+                            beforeSubmit: function() {
+                                _setBusy(true);
+                            },
+                            success: function() {
+                                _publicApi.setResult.apply(_publicApi, arguments);
+                                _$modal.modal('hide');
+                            },
+                            error: function() {
+                                //TODO: Handle error!
+                            },
+                            complete: function() {
+                                _setBusy(false);
+                            }
+                        });
+                    }
+                } else {
                     _$form = null;
-                } else if (_options.ajaxForm !== false) { //TODO: This option should be set by the modal or modal class!
-                    _$form.ajaxForm(function() {
-                        _$modal.modal('hide');
-                    });
                 }
 
                 _$modal.modal({
@@ -60,11 +92,8 @@ var abp = abp || {};
                 });
 
                 _$modal.on('hidden.bs.modal', function () {
-                    _removeContainer(_modalId);
-
-                    for (var i = 0; i < _onCloseCallbacks.length; i++) {
-                        _onCloseCallbacks[i]();
-                    }
+                    _removeContainer();
+                    _onCloseCallbacks.triggerAll(_publicApi);
                 });
 
                 _$modal.on('shown.bs.modal', function () {
@@ -97,15 +126,14 @@ var abp = abp || {};
                 _$modal.modal('show');
             };
 
-            var _open = function (args, getResultCallback) {
+            var _open = function (args) {
 
                 _args = args || {};
-                _getResultCallback = getResultCallback;
 
                 _createContainer(_modalId)
                     .load(options.viewUrl, $.param(_args), function (response, status, xhr) {
-                        if (status == "error") {
-                            //TODO: ERROR message!
+                        if (status === "error") {
+                            //TODO: Handle!
                             return;
                         };
 
@@ -128,7 +156,11 @@ var abp = abp || {};
             };
 
             var _onClose = function (onCloseCallback) {
-                _onCloseCallbacks.push(onCloseCallback);
+                _onCloseCallbacks.add(onCloseCallback);
+            }
+
+            var _onResult = function (callback) {
+                _onResultCallbacks.add(callback);
             }
 
             function _setBusy(isBusy) {
@@ -157,6 +189,10 @@ var abp = abp || {};
                     return _$modal;
                 },
 
+                getForm: function () {
+                    return _$form;
+                },
+
                 getArgs: function () {
                     return _args;
                 },
@@ -167,11 +203,13 @@ var abp = abp || {};
 
                 setBusy: _setBusy,
 
-                setResult: function() {
-                    _getResultCallback && _getResultCallback.apply(_publicApi, arguments);
+                setResult: function () {
+                    _onResultCallbacks.triggerAll(_publicApi, arguments);
                 },
 
-                onClose: _onClose
+                onClose: _onClose,
+
+                onResult: _onResult
             }
 
             return _publicApi;

src/Volo.Abp.Identity.Web/wwwroot/modules/identity/helpers/ResourceLoader.js

@@ -1,6 +1,8 @@
 /**
  * abp.ResourceLoader can be used to load scripts when needed.
  * It ensures that every script is only loaded once.
+ * 
+ * TODO: Add a loadStyle method
  */
 var abp = abp || {};
 (function ($) {

src/Volo.Abp.Identity.Web/wwwroot/modules/identity/helpers/jquery.js

@@ -1,4 +1,59 @@
-(function () {
+(function ($) {
+    if (!$) {
+        return;
+    }
+
+    /* A simple jQuery plug-in to make a button busy. */
+    $.fn.buttonBusy = function (isBusy) {
+        return $(this).each(function () {
+            var $button = $(this);
+            var $icon = $button.find('i');
+            var $buttonInnerSpan = $button.find('span');
+
+            if (isBusy) {
+                if ($button.hasClass('button-busy')) {
+                    return;
+                }
+
+                $button.attr('disabled', 'disabled');
+
+                //change icon
+                if ($icon.length) {
+                    $button.data('iconOriginalClasses', $icon.attr('class'));
+                    $icon.removeClass();
+                    $icon.addClass('fa fa-spin fa-spinner');
+                }
+
+                //change text
+                if ($buttonInnerSpan.length && $button.attr('data-busy-text')) {
+                    $button.data('buttonOriginalText', $buttonInnerSpan.html());
+                    $buttonInnerSpan.html($button.attr('data-busy-text'));
+                }
+
+                $button.addClass('button-busy');
+            } else {
+                if (!$button.hasClass('button-busy')) {
+                    return;
+                }
+
+                //enable button
+                $button.removeAttr('disabled');
+
+                //restore icon
+                if ($icon.length && $button.data('iconOriginalClasses')) {
+                    $icon.removeClass();
+                    $icon.addClass($button.data('iconOriginalClasses'));
+                }
+
+                //restore text
+                if ($buttonInnerSpan.length && $button.data('buttonOriginalText')) {
+                    $buttonInnerSpan.html($button.data('buttonOriginalText'));
+                }
+
+                $button.removeClass('button-busy');
+            }
+        });
+    };
 
     $.fn.serializeFormToObject = function () {
         //serialize to array
@@ -6,8 +61,12 @@
 
         //add also disabled items
         $(':disabled[name]', this)
-            .each(function () {
-                data.push({ name: this.name, value: $(this).val() });
+            .each(function (item) {
+                if ($(this).is(":checkbox")) {
+                    data.push({ name: this.name, value: $(this).is(':checked') });
+                } else {
+                    data.push({ name: this.name, value: $(this).val() });
+                }
             });
 
         //map to object
@@ -17,4 +76,4 @@
         return obj;
     };
 
-})();
+})(jQuery);

src/Volo.Abp.Identity.Web/wwwroot/modules/identity/views/users/index.js

@@ -13,9 +13,6 @@
     
     var app = new Vue({
         el: '#IdentityUsersWrapper',
-        data: {
-            
-        },
         methods: {
             openCreateModal: function () {
                 _createModal.open();
@@ -86,11 +83,11 @@
             }
         });
 
-        _createModal.onClose(function () { //TODO: Only refresh if saved!
+        _createModal.onResult(function () {
             _dataTable.ajax.reload();
         });
 
-        _editModal.onClose(function () { //TODO: Only refresh if saved!
+        _editModal.onResult(function () {
             _dataTable.ajax.reload();
         });
     });