From ed70cb02b69187c2c5e3ca90bdf26ca2d4afe22d Mon Sep 17 00:00:00 2001 From: kamidu Date: Thu, 13 Oct 2016 15:16:09 +0530 Subject: [PATCH] Sample implimentation using the new cdmf.ui.modal unit --- .../cdmf.page.users/public/js/listing.js | 123 +++++---- .../app/pages/cdmf.page.users/users.hbs | 237 ++---------------- 2 files changed, 80 insertions(+), 280 deletions(-) diff --git a/components/device-mgt/org.wso2.carbon.device.mgt.ui/src/main/resources/jaggeryapps/devicemgt/app/pages/cdmf.page.users/public/js/listing.js b/components/device-mgt/org.wso2.carbon.device.mgt.ui/src/main/resources/jaggeryapps/devicemgt/app/pages/cdmf.page.users/public/js/listing.js index 1074b271cf..d8dc9d4860 100644 --- a/components/device-mgt/org.wso2.carbon.device.mgt.ui/src/main/resources/jaggeryapps/devicemgt/app/pages/cdmf.page.users/public/js/listing.js +++ b/components/device-mgt/org.wso2.carbon.device.mgt.ui/src/main/resources/jaggeryapps/devicemgt/app/pages/cdmf.page.users/public/js/listing.js @@ -39,9 +39,6 @@ $(function () { }); var apiBasePath = "/api/device-mgt/v1.0"; -var modalPopup = ".modal"; -var modalPopupContainer = modalPopup + " .modal-content"; -var modalPopupContent = modalPopup + " .modal-content"; var body = "body"; /** @@ -54,31 +51,6 @@ $(document).on('draw.dt', function () { $(".icon .text").res_text(0.2); }); -/* - * set popup maximum height function. - */ -function setPopupMaxHeight() { - $(modalPopupContent).css('max-height', ($(body).height() - ($(body).height() / 100 * 30))); - $(modalPopupContainer).css('margin-top', (-($(modalPopupContainer).height() / 2))); -} - -/* - * show popup function. - */ -function showPopup() { - $(modalPopup).modal('show'); -} - -/* - * hide popup function. - */ -function hidePopup() { - $(modalPopupContent).html(''); - $(modalPopup).modal('hide'); - $('body').removeClass('modal-open').css('padding-right', '0px'); - $('.modal-backdrop').remove(); -} - /** * Following click function would execute * when a user clicks on "Invite" link @@ -89,34 +61,48 @@ $("a#invite-user-link").click(function () { var inviteUserAPI = apiBasePath + "/users/send-invitation"; if (usernameList.length == 0) { - $(modalPopupContent).html($("#errorUsers").html()); + modalDialog.header("Operation cannot be performed !"); + modalDialog.content("Please select a user or a list of users to send invitation emails."); + modalDialog.footer('
Ok' + + '
'); + modalDialog.showAsError(); } else { - $(modalPopupContent).html($('#invite-user-modal-content').html()); - } + modalDialog.header(""); + modalDialog.content("An invitation mail will be sent to the selected user(s) to initiate an enrolment process." + + " Do you wish to continue ?"); + modalDialog.footer('
yes' + + 'No
'); + modalDialog.show(); - showPopup(); + } $("a#invite-user-yes-link").click(function () { invokerUtil.post( inviteUserAPI, usernameList, function () { - $(modalPopupContent).html($('#invite-user-success-content').html()); + modalDialog.header("User invitation email for enrollment was successfully sent."); + modalDialog.footer('
Ok
'); $("a#invite-user-success-link").click(function () { - hidePopup(); + modalPopup.hide(); }); }, function () { - $(modalPopupContent).html($('#invite-user-error-content').html()); + modalDialog.header(' Unexpected Error !'); + modalDialog.content('An unexpected error occurred. Try again later.'); + modalDialog.footer('
Ok
'); $("a#invite-user-error-link").click(function () { - hidePopup(); + modalPopup.hide(); }); } ); }); $("a#invite-user-cancel-link").click(function () { - hidePopup(); + modalPopup.hide(); }); }); @@ -138,13 +124,16 @@ function getSelectedUsernames() { * on User Listing page in WSO2 MDM Console. */ function resetPassword(username) { - $(modalPopupContent).html($('#reset-password-window').html()); - showPopup(); + modalDialog.header(' Reset Password'); + modalDialog.content($("#modal-content-reset-password").html()); + modalDialog.footer('
Save ' + + ' Cancel
'); + modalDialog.show(); $("a#reset-password-yes-link").click(function () { - var newPassword = $("#new-password").val(); - var confirmedPassword = $("#confirmed-password").val(); - + var newPassword = $("#basic-modal-view .new-password").val(); + var confirmedPassword = $("#basic-modal-view .confirmed-password").val(); var errorMsgWrapper = "#notification-error-msg"; var errorMsg = "#notification-error-msg span"; if (!newPassword) { @@ -177,10 +166,10 @@ function resetPassword(username) { // The success callback function (data, textStatus, jqXHR) { if (jqXHR.status == 200) { - $(modalPopupContent).html($('#reset-password-success-content').html()); - $("a#reset-password-success-link").click(function () { - hidePopup(); - }); + modalDialog.header("Password reset is successful."); + modalDialog.content(""); + modalDialog.footer('
Ok
'); } }, // The error callback @@ -194,7 +183,7 @@ function resetPassword(username) { }); $("a#reset-password-cancel-link").click(function () { - hidePopup(); + modalDialog.hide(); }); } @@ -213,8 +202,16 @@ function removeUser(username) { if (domain) { removeUserAPI += '?domain=' + domain; } - $(modalPopupContent).html($('#remove-user-modal-content').html()); - showPopup(); + + modalDialog.header("Remove User"); + modalDialog.content("Do you really want to remove this user ?"); + modalDialog.footer('
Remove ' + + 'Cancel
'); + modalDialog.showAsAWarning(); + + $("a#remove-user-cancel-link").click(function () { + modalDialog.hide(); + }); $("a#remove-user-yes-link").click(function () { invokerUtil.delete( @@ -227,24 +224,24 @@ function removeUser(username) { $("#user-" + username).remove(); } // update modal-content with success message - $(modalPopupContent).html($('#remove-user-success-content').html()); - $("a#remove-user-success-link").click(function () { - hidePopup(); - }); + modalDialog.header("User Removed."); + modalDialog.content("Done. User was successfully removed."); + modalDialog.footer('
Ok
'); + } }, function () { - $(modalPopupContent).html($('#remove-user-error-content').html()); - $("a#remove-user-error-link").click(function () { - hidePopup(); - }); + modalDialog.hide(); + modalDialog.header("Operation cannot be performed !"); + modalDialog.content("An unexpected error occurred. Please try again later."); + modalDialog.footer('
Ok
'); + modalDialog.showAsError(); } ); }); - $("a#remove-user-cancel-link").click(function () { - hidePopup(); - }); } /** @@ -256,8 +253,10 @@ function InitiateViewOption() { if ($("#can-view").val()) { $(location).attr('href', $(this).data("url")); } else { - $(modalPopupContent).html($('#errorUserView').html()); - showPopup(); + modalDialog.header("Unauthorized action!"); + modalDialog.content("You don't have permissions to view users"); + modalDialog.footer('
Ok
'); + modalDialog.showAsError(); } } diff --git a/components/device-mgt/org.wso2.carbon.device.mgt.ui/src/main/resources/jaggeryapps/devicemgt/app/pages/cdmf.page.users/users.hbs b/components/device-mgt/org.wso2.carbon.device.mgt.ui/src/main/resources/jaggeryapps/devicemgt/app/pages/cdmf.page.users/users.hbs index ea30ecbfc9..b22af2dc10 100644 --- a/components/device-mgt/org.wso2.carbon.device.mgt.ui/src/main/resources/jaggeryapps/devicemgt/app/pages/cdmf.page.users/users.hbs +++ b/components/device-mgt/org.wso2.carbon.device.mgt.ui/src/main/resources/jaggeryapps/devicemgt/app/pages/cdmf.page.users/users.hbs @@ -18,6 +18,7 @@ {{unit "cdmf.unit.ui.title" pageTitle="User Management"}} {{unit "cdmf.unit.data-tables-extended"}} +{{unit "cdmf.unit.ui.modal"}} {{#zone "breadcrumbs"}}
  • @@ -47,7 +48,7 @@ {{/zone}} {{#zone "content"}} - +
    {{#if canManage}} @@ -99,226 +100,26 @@
    -
    -
    - -
    -
    -

    - An invitation mail will be sent to the selected user(s) to initiate an enrolment process. - Do you wish to continue ? -

    -
    -
    -
    - yes - No -
    -
    -
    - -
    -
    -

    User invitation email for enrollment was successfully sent.

    - -
    -
    -
    -
    -
    - - Ok - -
    -
    -
    - -
    -
    -

    - - - - - Unexpected Error -

    - -
    -
    -

    - An unexpected error occurred. Try again later. -

    -
    -
    -
    - Ok -
    -
    -
    - -
    -
    -

    - Remove User -

    - -
    -
    -

    - Do you really want to remove this user ? -

    -
    -
    -
    - Remove - Cancel -
    -
    -
    - -
    -
    -

    - User Removed. -

    - -
    -
    -

    - Done. User was successfully removed. -

    -
    -
    -
    - Ok -
    -
    -
    - -
    -
    -

    - - - - - Unexpected Error -

    - +
    + -
    -

    - An unexpected error occurred. Please try again later. -

    -
    -
    -
    - Ok +

    + Enter new password +

    +
    +
    -

    -
    - -
    -
    -

    - - - - - Operation cannot be performed ! -

    - -
    -
    -

    - Please select a user or a list of users to send invitation emails. -

    -
    -
    -
    - Ok +
    + Retype new password +

    +
    +
    -
    -
    - -
    -
    -

    - Unauthorized action! -

    - -
    -
    - -
    - -
    -

    - - - - - Reset Password -

    - -
    -
    - -

    - Enter new password -

    -
    - -
    -
    - Retype new password -

    -
    - -
    -
    -

    -
    -
    -
    - - Save - - - - Cancel - -
    -
    -
    - -
    -
    -

    - Password reset is successful. -

    - -
    -
    -
    - - Ok - -
    -
    +
    +
    {{/zone}}