From 34225bd9da840631d68759d23e8be52f92f9d5ca Mon Sep 17 00:00:00 2001 From: Ace Date: Tue, 6 Dec 2016 17:13:56 +0530 Subject: [PATCH] fixing operations loading spinner and other ui issues --- .../public/js/device-view.js | 82 ++++++++++--------- .../lib/theme-wso2_1.0/js/theme-wso2.js | 79 +++++++++--------- 2 files changed, 84 insertions(+), 77 deletions(-) diff --git a/components/device-mgt/org.wso2.carbon.device.mgt.ui/src/main/resources/jaggeryapps/devicemgt/app/units/cdmf.unit.device.view/public/js/device-view.js b/components/device-mgt/org.wso2.carbon.device.mgt.ui/src/main/resources/jaggeryapps/devicemgt/app/units/cdmf.unit.device.view/public/js/device-view.js index 61c094c3b6b..0ca5ddc820a 100644 --- a/components/device-mgt/org.wso2.carbon.device.mgt.ui/src/main/resources/jaggeryapps/devicemgt/app/units/cdmf.unit.device.view/public/js/device-view.js +++ b/components/device-mgt/org.wso2.carbon.device.mgt.ui/src/main/resources/jaggeryapps/devicemgt/app/units/cdmf.unit.device.view/public/js/device-view.js @@ -51,7 +51,10 @@ var operationsLogTable = "#operations-log-table"; if (update) { operationTable = $(operationsLogTable).DataTable(); - operationTable.ajax.reload(false); + $("#operations-spinner").removeClass("hidden"); + operationTable.ajax.reload(function ( json ) { + $("#operations-spinner").addClass("hidden"); + }, false); return; } operationTable = $(operationsLogTable).datatables_extended({ @@ -142,53 +145,54 @@ function (template) { var getEffectivePolicyURL = "/api/device-mgt/v1.0/devices/" + deviceType + "/" + deviceId + "/effective-policy"; var getDeviceComplianceURL = "/api/device-mgt/v1.0/devices/" + deviceType + "/" + deviceId + "/compliance-data"; - invokerUtil.get( getEffectivePolicyURL, // success-callback function (data, textStatus, jqXHR) { - if (jqXHR.status == 200 && data) { - data = JSON.parse(data); + if (jqXHR.status == 200) { $("#policy-spinner").addClass("hidden"); - if (data["active"] == true) { - activePolicy = data; - invokerUtil.get( - getDeviceComplianceURL, - // success-callback - function (data, textStatus, jqXHR) { - if (jqXHR.status == 200 && data) { - var viewModel = {}; - viewModel["policy"] = activePolicy; - viewModel["deviceType"] = deviceType; - data = JSON.parse(data); - var content; - if (data["complianceData"]) { - if (data["complianceData"]["complianceFeatures"] && - data["complianceData"]["complianceFeatures"].length > 0) { - viewModel["compliance"] = "NON-COMPLIANT"; - viewModel["complianceFeatures"] = data["complianceData"]["complianceFeatures"]; - content = template(viewModel); - $("#policy-list-container").html(content); + if(data){ + data = JSON.parse(data); + if (data["active"] == true) { + activePolicy = data; + invokerUtil.get( + getDeviceComplianceURL, + // success-callback + function (data, textStatus, jqXHR) { + if (jqXHR.status == 200 && data) { + var viewModel = {}; + viewModel["policy"] = activePolicy; + viewModel["deviceType"] = deviceType; + data = JSON.parse(data); + var content; + if (data["complianceData"]) { + if (data["complianceData"]["complianceFeatures"] && + data["complianceData"]["complianceFeatures"].length > 0) { + viewModel["compliance"] = "NON-COMPLIANT"; + viewModel["complianceFeatures"] = data["complianceData"]["complianceFeatures"]; + content = template(viewModel); + $("#policy-list-container").html(content); + } else { + viewModel["compliance"] = "COMPLIANT"; + content = template(viewModel); + $("#policy-list-container").html(content); + $("#policy-compliance-table").addClass("hidden"); + } } else { - viewModel["compliance"] = "COMPLIANT"; - content = template(viewModel); - $("#policy-list-container").html(content); - $("#policy-compliance-table").addClass("hidden"); + $("#policy-list-container"). + html("

This device " + + "has no policy applied.

"); } - } else { - $("#policy-list-container"). - html("

This device " + - "has no policy applied.

"); } + }, + // error-callback + function () { + $("#policy-list-container"). + html("

Loading policy compliance related data " + + "was not successful. please try refreshing data in a while.

"); } - }, - // error-callback - function () { - $("#policy-list-container"). - html("

Loading policy compliance related data " + - "was not successful. please try refreshing data in a while.

"); - } - ); + ); + } } } }, diff --git a/components/device-mgt/org.wso2.carbon.device.mgt.ui/src/main/resources/jaggeryapps/uuf-template-app/app/units/uuf.unit.theme/public/lib/theme-wso2_1.0/js/theme-wso2.js b/components/device-mgt/org.wso2.carbon.device.mgt.ui/src/main/resources/jaggeryapps/uuf-template-app/app/units/uuf.unit.theme/public/lib/theme-wso2_1.0/js/theme-wso2.js index 13f6bbcad08..21cfb7a6544 100644 --- a/components/device-mgt/org.wso2.carbon.device.mgt.ui/src/main/resources/jaggeryapps/uuf-template-app/app/units/uuf.unit.theme/public/lib/theme-wso2_1.0/js/theme-wso2.js +++ b/components/device-mgt/org.wso2.carbon.device.mgt.ui/src/main/resources/jaggeryapps/uuf-template-app/app/units/uuf.unit.theme/public/lib/theme-wso2_1.0/js/theme-wso2.js @@ -78,12 +78,12 @@ var responsiveTextRatio = 0.2, * A function to add data attributes to HTML about the user agent * @return {Null} */ - $.browser_meta = function(){ - $('html') - .attr('data-useragent', navigator.userAgent) - .attr('data-platform', navigator.platform) - .addClass(((!!('ontouchstart' in window) || !!('onmsgesturechange' in window)) ? ' touch' : '')); - }; + $.browser_meta = function(){ + $('html') + .attr('data-useragent', navigator.userAgent) + .attr('data-platform', navigator.platform) + .addClass(((!!('ontouchstart' in window) || !!('onmsgesturechange' in window)) ? ' touch' : '')); + }; /** * @description Data Loader function @@ -96,17 +96,17 @@ var responsiveTextRatio = 0.2, var loadingText = ($(this).attr('data-loading-text') === undefined) ? 'LOADING' : $(this).attr('data-loading-text'); var html = '
' + - '' + - '

'+ loadingText +'

' + - '
' + - '
'; + '' + + '

'+ loadingText +'

' + + '' + + '
'; if (action === 'show') { $(this).prepend(html).addClass('loading'); @@ -230,13 +230,13 @@ var responsiveTextRatio = 0.2, responsive: false, autoWidth: false, dom:'<"dataTablesTop"' + - 'f' + - '<"dataTables_toolbar">' + - '>' + - 'rt' + - '<"dataTablesBottom"' + - 'lip' + - '>', + 'f' + + '<"dataTables_toolbar">' + + '>' + + 'rt' + + '<"dataTablesBottom"' + + 'lip' + + '>', language: { searchPlaceholder: 'Filter by ...', search: '' @@ -244,6 +244,7 @@ var responsiveTextRatio = 0.2, initComplete: function(){ var ROW_SELECTED_CLASS = 'DTTT_selected'; + var table = this; this.api().columns().every(function(){ @@ -301,7 +302,7 @@ var responsiveTextRatio = 0.2, var search_input = $(this).closest('.dataTables_wrapper').find('div[id$=_filter] input'); search_input.before('').removeClass('input-sm'); - // Create sorting dropdown menu for list table advance operations + // Create sorting dropdown menu for list table advance operations var dropdownmenu = $(''); $('.sort-row th', elem).each(function(){ if(!$(this).hasClass('no-sort')){ @@ -313,19 +314,19 @@ var responsiveTextRatio = 0.2, if (!table.hasClass('no-toolbar')) { if (table.hasClass('sorting-enabled')) { return '' + '
  • ' + + '
  • ' + + '
  • ' + + '
  • ' + + '
  • ' + dropdownmenu[0].outerHTML + '
  • ' + + '' } else { return '' + '
  • ' + + '
  • ' + + '
  • ' + + '
  • ' + + '' } } else { return ''; @@ -335,9 +336,11 @@ var responsiveTextRatio = 0.2, /** * append advance operations to list table toolbar */ - $('.dataTable.list-table').closest('.dataTables_wrapper').find('.dataTablesTop .dataTables_toolbar').html( + if (table.hasClass('dataTables_toolbar')) { + $('.dataTable.list-table').closest('.dataTables_wrapper').find('.dataTablesTop .dataTables_toolbar').html( getAdvanceToolBar() - ); + ); + } //Sorting dropdown menu select function $('.dataTables_wrapper .sort-list li a').click(function() {