Re: [Kimchi-devel] [PATCH v4] UI: Software Update Support

On 02/28/2014 05:02 PM, Royce Lv wrote: > Just some humble suggestion cause I'm not a UI expert. > > 1. The selection effect on grid confused me, whether we can update a > single software. ACK. It's a good point! I'll disable the single selection in grid widget. Single selection is designed for cases when there is action for single record like: update a single package. > > 2. Is that possible to select multiple software and update it? Because > on our system, especially when our server is a virtualization server, > we only focus on virtualization related software and don't want to > update others. But of course, for a period of time we need a full > upgrade. I mean partial update may be more convinient. Yes, it's better to allow user select whichever he/she wants to update. @Adam and @Aline , seems the back-end API only supports update all action. I think we can add this feature in the next release. > > On 2014年02月28日 11:33, Hongliang Wang wrote: >> Added UI support for software updating. The Host Tab will initially >> list available updates to user if there are any; or we will disable >> "Update All" Button if no updates available. >> >> V3 -> V4: >> 4a) Added the last update output >> (Thanks to Aline's comment) >> 4b) Disabled horizontal resize function of output textarea >> (Thanks to Aline's comment) >> 4c) Added "Update Progress" label to the output textarea >> (Thanks to Aline's comment) >> 4d) Added refreshing the software grid after updating is finished >> (Thanks to Aline's comment) >> 4e) Added software updates grid cleanup when host tab is unloaded >> >> V2 -> V3: >> 3a) Fixed "Update All" Button always being disabled issue >> (Thanks to Paulo and Aline's comment) >> 3b) Updated REST API calling according to back-end change >> 3c) Added in-progress message when system is being updated >> (Thanks to Aline's comment) >> >> V1 -> V2: >> 2a) Fixed "Update All" Button always being disabled issue >> (Thanks to Paulo Ricardo Paz Vital's comment) >> >> Signed-off-by: Hongliang Wang <hlwang(a)linux.vnet.ibm.com&gt; >> --- >> ui/css/theme-default/host.css | 29 ++++++++++++++ >> ui/js/src/kimchi.api.js | 53 ++++++++++++++++++++++++++ >> ui/js/src/kimchi.host.js | 88 >> +++++++++++++++++++++++++++++++++++++++++++ >> ui/pages/i18n.html.tmpl | 10 +++++ >> ui/pages/tabs/host.html.tmpl | 17 +++++++++ >> 5 files changed, 197 insertions(+) >> >> 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.api.js b/ui/js/src/kimchi.api.js >> index fdd9cfc..beaf314 100644 >> --- a/ui/js/src/kimchi.api.js >> +++ b/ui/js/src/kimchi.api.js >> @@ -727,5 +727,58 @@ var kimchi = { >> success : suc, >> error : err >> }); >> + }, >> + >> + listSoftwareUpdates : function(suc, err) { >> + kimchi.requestJSON({ >> + url : kimchi.url + 'host/packagesupdate', >> + type : 'GET', >> + contentType : 'application/json', >> + dataType : 'json', >> + resend: true, >> + success : suc, >> + error : err >> + }); >> + }, >> + >> + updateSoftwares : function(suc, err, progress) { >> + var taskID = -1; >> + var onResponse = function(data) { >> + taskID = data['id']; >> + trackTask(); >> + }; >> + >> + var trackTask = function() { >> + kimchi.getTask(taskID, onTaskResponse, err); >> + }; >> + >> + var onTaskResponse = function(result) { >> + var taskStatus = result['status']; >> + switch(taskStatus) { >> + case 'running': >> + progress && progress(result); >> + setTimeout(function() { >> + trackTask(); >> + }, 200); >> + break; >> + case 'finished': >> + suc(result); >> + break; >> + case 'failed': >> + err(result); >> + break; >> + default: >> + break; >> + } >> + }; >> + >> + kimchi.requestJSON({ >> + url : kimchi.url + 'host/swupdate', >> + type : "POST", >> + contentType : "application/json", >> + dataType : "json", >> + success : onResponse, >> + error : err >> + }); >> } >> }; >> diff --git a/ui/js/src/kimchi.host.js b/ui/js/src/kimchi.host.js >> index 6e7f333..df27313 100644 >> --- a/ui/js/src/kimchi.host.js >> +++ b/ui/js/src/kimchi.host.js >> @@ -128,6 +128,87 @@ kimchi.host_main = function() { >> }); >> }; >> >> + 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'], >> + 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.updateSoftwares(function(result) { >> + reloadProgressArea(result); >> + $(updateButton).text(i18n['KCHUPD6006M']).prop('disabled', false); >> + kimchi.topic('kimchi/softwareUpdated').publish({ >> + result: result >> + }); >> + }, function() {}, reloadProgressArea); >> + } >> + }], >> + frozenFields: [{ >> + name: 'id', >> + label: ' ', >> + 'class': 'software-update-id' >> + }], >> + 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: softwareUpdates >> + }); >> + }; >> + >> + var listSoftwareUpdates = function() { >> + kimchi.listSoftwareUpdates(function(softwareUpdates) { >> + $.each(softwareUpdates, function(i, item) { >> + softwareUpdates[i]['id'] = i + 1; >> + }); >> + >> + if(softwareUpdatesGrid) { >> + softwareUpdatesGrid.setData(softwareUpdates); >> + } >> + else { >> + initSoftwareUpdatesGrid(softwareUpdates); >> + } >> + >> + var updateButton = $('#' + softwareUpdatesGridID + >> '-update-button'); >> + $(updateButton).prop('disabled', softwareUpdates.length >> === 0); >> + }); >> + }; >> + >> var shutdownButtonID = '#host-button-shutdown'; >> var restartButtonID = '#host-button-restart'; >> var shutdownHost = function(params) { >> @@ -186,6 +267,8 @@ kimchi.host_main = function() { >> kimchi.keepMonitoringHost = this['checked']; >> }); >> >> + listSoftwareUpdates(); >> + >> kimchi.getCapabilities(function(capabilities) { >> if(!capabilities['system_report_tool']) { >> return; >> @@ -199,6 +282,10 @@ kimchi.host_main = function() { >> listDebugReports(); >> }); >> >> + kimchi.topic('kimchi/softwareUpdated').subscribe(function() { >> + listSoftwareUpdates(); >> + }); >> + >> kimchi.getHost(function(data) { >> var htmlTmpl = $('#host-tmpl').html(); >> data['logo'] = data['logo'] || ''; >> @@ -464,5 +551,6 @@ kimchi.host_main = function() { >> delete kimchi.hostTimer; >> } >> reportGrid && reportGrid.destroy(); >> + softwareUpdatesGrid && softwareUpdatesGrid.destroy(); >> }); >> }; >> diff --git a/ui/pages/i18n.html.tmpl b/ui/pages/i18n.html.tmpl >> index db6166e..4223403 100644 >> --- a/ui/pages/i18n.html.tmpl >> +++ b/ui/pages/i18n.html.tmpl >> @@ -89,6 +89,16 @@ var i18n = { >> 'KCHDR6010M': "$_("Download")", >> 'KCHDR6011M': "$_("Report name should contain only letters, >> digits and/or hyphen ('-').")", >> >> + >> + 'KCHUPD6001M': "$_("Software Updates")", >> + 'KCHUPD6002M': "$_("Package Name")", >> + 'KCHUPD6003M': "$_("Version")", >> + 'KCHUPD6004M': "$_("Architecture")", >> + 'KCHUPD6005M': "$_("Repository")", >> + 'KCHUPD6006M': "$_("Update All")", >> + 'KCHUPD6007M': "$_("Updating...")", >> + >> + >> 'KCHVM6001M': "$_("This will delete the virtual machine and its >> virtual disks. This operation cannot be undone. Would you like to >> continue?")", >> 'KCHVM6002M': "$_("Delete Confirmation")", >> >> diff --git a/ui/pages/tabs/host.html.tmpl b/ui/pages/tabs/host.html.tmpl >> index 23b9853..f6ecd47 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"> >> + <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"> > _______________________________________________ Kimchi-devel mailing list Kimchi-devel(a)ovirt.org http://lists.ovirt.org/mailman/listinfo/kimchi-devel