Added software update grid in host tab. Signed-off-by: Hongliang Wang <hlwang@linux.vnet.ibm.com> --- ui/css/theme-default/host.css | 29 ++++++++++++ ui/js/src/kimchi.host.js | 104 ++++++++++++++++++++++++++++++++++++++---- ui/pages/tabs/host.html.tmpl | 17 +++++++ 3 files changed, 142 insertions(+), 8 deletions(-) diff --git a/ui/css/theme-default/host.css b/ui/css/theme-default/host.css index 470ed1b..0f8b941 100644 --- a/ui/css/theme-default/host.css +++ b/ui/css/theme-default/host.css @@ -224,3 +224,32 @@ width: 300px; } /* End of Debug Report */ + +/* Software Updates */ +.host-panel #software-updates-grid { + border-color: #ddd; + height: 300px; + width: 850px; +} + +.software-update-id { + width: 30px; +} + +.software-update-name, +.software-update-repos { + width: 220px; +} + +.software-update-version, +.software-update-arch { + width: 190px; +} + +.host-panel #software-updates-progress-textarea { + border: 1px solid #ddd; + height: 100px; + resize: vertical; + width: 846px; +} +/* End of Software Updates */ diff --git a/ui/js/src/kimchi.host.js b/ui/js/src/kimchi.host.js index 7974054..46b37ee 100644 --- a/ui/js/src/kimchi.host.js +++ b/ui/js/src/kimchi.host.js @@ -22,6 +22,85 @@ kimchi.host_main = function() { $(header).attr('aria-expanded', toExpand ? 'true' : 'false'); }; + var softwareUpdatesGridID = 'software-updates-grid'; + var softwareUpdatesGrid = null; + var progressAreaID = 'software-updates-progress-textarea'; + var reloadProgressArea = function(result) { + var progressArea = $('#' + progressAreaID)[0]; + $(progressArea).text(result['message']); + var scrollTop = $(progressArea).prop('scrollHeight'); + $(progressArea).prop('scrollTop', scrollTop); + }; + + var initSoftwareUpdatesGrid = function(softwareUpdates) { + softwareUpdatesGrid = new kimchi.widget.Grid({ + container: 'software-updates-grid-container', + id: softwareUpdatesGridID, + title: i18n['KCHUPD6001M'], + rowSelection: 'disabled', + toolbarButtons: [{ + id: softwareUpdatesGridID + '-update-button', + label: i18n['KCHUPD6006M'], + disabled: true, + onClick: function(event) { + var updateButton = $(this); + var progressArea = $('#' + progressAreaID)[0]; + $('#software-updates-progress-container').removeClass('hidden'); + $(progressArea).text(''); + !kimchi.isElementInViewport(progressArea) && + progressArea.scrollIntoView(); + $(updateButton).text(i18n['KCHUPD6007M']).prop('disabled', true); + + kimchi.updateSoftware(function(result) { + reloadProgressArea(result); + $(updateButton).text(i18n['KCHUPD6006M']).prop('disabled', false); + kimchi.topic('kimchi/softwareUpdated').publish({ + result: result + }); + }, function() {}, reloadProgressArea); + } + }], + frozenFields: [], + fields: [{ + name: 'package_name', + label: i18n['KCHUPD6002M'], + 'class': 'software-update-name' + }, { + name: 'version', + label: i18n['KCHUPD6003M'], + 'class': 'software-update-version' + }, { + name: 'arch', + label: i18n['KCHUPD6004M'], + 'class': 'software-update-arch' + }, { + name: 'repository', + label: i18n['KCHUPD6005M'], + 'class': 'software-update-repos' + }], + data: listSoftwareUpdates + }); + }; + + var listSoftwareUpdates = function(gridCallback) { + kimchi.listSoftwareUpdates(function(softwareUpdates) { + if(gridCallback) { + gridCallback(softwareUpdates); + } + else { + if(softwareUpdatesGrid) { + softwareUpdatesGrid.setData(softwareUpdates); + } + else { + initSoftwareUpdatesGrid(softwareUpdates); + } + } + + var updateButton = $('#' + softwareUpdatesGridID + '-update-button'); + $(updateButton).prop('disabled', softwareUpdates.length === 0); + }); + }; + var reportGridID = 'available-reports-grid'; var reportGrid = null; var initReportGrid = function(reports) { @@ -192,18 +271,22 @@ kimchi.host_main = function() { }); kimchi.getCapabilities(function(capabilities) { - if(!capabilities['system_report_tool']) { - return; + if(capabilities['update_tool']) { + $('#software-update-section').removeClass('hidden'); + initSoftwareUpdatesGrid(); + kimchi.topic('kimchi/softwareUpdated') + .subscribe(listSoftwareUpdates); + } + + if(capabilities['system_report_tool']) { + $('#debug-report-section').removeClass('hidden'); + listDebugReports(); + kimchi.topic('kimchi/debugReportAdded') + .subscribe(listDebugReports); } - $('#debug-report-section').removeClass('hidden'); - listDebugReports(); }); }; - kimchi.topic('kimchi/debugReportAdded').subscribe(function(params) { - listDebugReports(); - }); - kimchi.getHost(function(data) { var htmlTmpl = $('#host-tmpl').html(); data['logo'] = data['logo'] || ''; @@ -468,6 +551,11 @@ kimchi.host_main = function() { kimchi.hostTimer = null; delete kimchi.hostTimer; } + + softwareUpdatesGrid && softwareUpdatesGrid.destroy(); + kimchi.topic('kimchi/softwareUpdated').unsubscribe(listSoftwareUpdates); + reportGrid && reportGrid.destroy(); + kimchi.topic('kimchi/debugReportAdded').unsubscribe(listDebugReports); }); }; diff --git a/ui/pages/tabs/host.html.tmpl b/ui/pages/tabs/host.html.tmpl index 52f849b..179deba 100644 --- a/ui/pages/tabs/host.html.tmpl +++ b/ui/pages/tabs/host.html.tmpl @@ -120,6 +120,23 @@ </div> </div> </div> + <div id="software-update-section" class="host-section hidden"> + <h3 class="section-header" + aria-controls="content-software-update"> + $_("Software Updates") + </h3> + <div id="content-software-update" class="section-content"> + <div class="section-row"> + <div class="section-value"> + <div id="software-updates-grid-container"></div> + <div id="software-updates-progress-container" class="hidden"> + <label for="software-updates-progress-textarea">$_("Update Progress")</label> + <textarea id="software-updates-progress-textarea" readonly></textarea> + </div> + </div> + </div> + </div> + </div> <div id="debug-report-section" class="host-section hidden"> <h3 class="section-header" aria-controls="content-sys-reports"> -- 1.8.1.4