<html>
<head>
<meta content="text/html; charset=ISO-8859-1"
http-equiv="Content-Type">
</head>
<body text="#000000" bgcolor="#FFFFFF">
<div class="moz-cite-prefix">On 02/21/2014 11:57 PM, Aline Manera
wrote:<br>
</div>
<blockquote cite="mid:53077770.60702@linux.vnet.ibm.com" type="cite">
<meta content="text/html; charset=ISO-8859-1"
http-equiv="Content-Type">
<div class="moz-cite-prefix">On 02/21/2014 03:13 AM, Hongliang
Wang wrote:<br>
</div>
<blockquote
cite="mid:1392963235-8437-1-git-send-email-hlwang@linux.vnet.ibm.com"
type="cite">
<pre wrap="">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.
V2 -> V3:
3a) Fixed "Update All" Button always being disabled issue
(Thanks to Paulo and Aline's comment)
3b) Update REST API for update action 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 <a moz-do-not-send="true" class="moz-txt-link-rfc2396E" href="mailto:hlwang@linux.vnet.ibm.com"><hlwang@linux.vnet.ibm.com></a>
---
ui/css/theme-default/host.css | 6 ++++++
ui/js/src/kimchi.api.js | 5 +++--
ui/js/src/kimchi.host.js | 12 ++++++++++--
ui/pages/tabs/host.html.tmpl | 1 +
4 files changed, 20 insertions(+), 4 deletions(-)
diff --git a/ui/css/theme-default/host.css b/ui/css/theme-default/host.css
index 1342ade..884a614 100644
--- a/ui/css/theme-default/host.css
+++ b/ui/css/theme-default/host.css
@@ -248,4 +248,10 @@
.software-update-arch {
width: 190px;
}
+
+.host-panel #software-updates-progress-textarea {
+ border: 1px solid #ddd;
+ height: 100px;
+ width: 846px;
+}
/* End of Software Updates */
diff --git a/ui/js/src/kimchi.api.js b/ui/js/src/kimchi.api.js
index c3a9516..abbf00e 100644
--- a/ui/js/src/kimchi.api.js
+++ b/ui/js/src/kimchi.api.js
@@ -745,7 +745,7 @@ var kimchi = {
});
},
- updateSoftwares : function(suc, err) {
+ updateSoftwares : function(suc, err, progress) {
var taskID = -1;
var onResponse = function(data) {
taskID = data['id'];
@@ -760,6 +760,7 @@ var kimchi = {
var taskStatus = result['status'];
switch(taskStatus) {</pre>
</blockquote>
<br>
<blockquote
cite="mid:1392963235-8437-1-git-send-email-hlwang@linux.vnet.ibm.com"
type="cite">
<pre wrap=""> case 'running':
+ progress && progress(result);
setTimeout(function() {
trackTask();
}, 200);</pre>
</blockquote>
<br>
When the task finished you also need to update the messages to the
user.<br>
Otherwise it will miss the last update output<br>
</blockquote>
ACK<br>
<blockquote cite="mid:53077770.60702@linux.vnet.ibm.com" type="cite">
<br>
<blockquote
cite="mid:1392963235-8437-1-git-send-email-hlwang@linux.vnet.ibm.com"
type="cite">
<pre wrap="">@@ -776,7 +777,7 @@ var kimchi = {
};
kimchi.requestJSON({
- url : kimchi.url + 'host/packagesupdate/update',
+ url : kimchi.url + 'host/swupdate',
type : "POST",
contentType : "application/json",
dataType : "json",
diff --git a/ui/js/src/kimchi.host.js b/ui/js/src/kimchi.host.js
index b6a5878..d4016b5 100644
--- a/ui/js/src/kimchi.host.js
+++ b/ui/js/src/kimchi.host.js
@@ -144,9 +144,17 @@ kimchi.host_main = function() {
disabled: true,
onClick: function(event) {
var updateButton = $(this);
+ var progressArea = $('#software-updates-progress-textarea')[0];
+ $(progressArea).removeClass('hidden').text('');
+ !kimchi.isElementInViewport(progressArea) &&
+ progressArea.scrollIntoView();
$(updateButton).text(i18n['KCHUPD6007M']).prop('disabled', true);
kimchi.updateSoftwares(function(result) {
$(updateButton).text(i18n['KCHUPD6006M']).prop('disabled', false);
+ }, function() {}, function(result) {
+ $(progressArea).text(result['message']);
+ var scrollTop = $(progressArea).prop('scrollHeight');
+ $(progressArea).prop('scrollTop', scrollTop);
});
}
}],
@@ -189,8 +197,8 @@ kimchi.host_main = function() {
initSoftwareUpdatesGrid(softwareUpdates);
}
- $(softwareUpdatesGridID + '-update-button')
- .prop('disabled', softwareUpdates.length === 0);
+ var updateButton = $('#' + softwareUpdatesGridID + '-update-button');
+ $(updateButton).prop('disabled', softwareUpdates.length === 0);
});
};
diff --git a/ui/pages/tabs/host.html.tmpl b/ui/pages/tabs/host.html.tmpl
index 1de4fcd..71f72c7 100644
--- a/ui/pages/tabs/host.html.tmpl
+++ b/ui/pages/tabs/host.html.tmpl
@@ -132,6 +132,7 @@
<div class="section-row">
<div class="section-value">
<div id="software-updates-grid-container"></div>
+ <textarea id="software-updates-progress-textarea" class="hidden" readonly></textarea>
</div></pre>
</blockquote>
<br>
<br>
<img src="cid:part2.08090700.00070207@linux.vnet.ibm.com" alt=""><br>
<br>
The user can increase/decrease the size of the output panel.<br>
We need to make it fixed in width and height<br>
</blockquote>
It's a improved feature of Chrome/Safari browser and I think it's
user-friendly. Think about it: if there are hundreds of lines to
read, or user wants more height (because his screen is big enough),
I think there is no need to force the height in a relatively small
value. Though, the width will break our layout.<br>
<br>
I think we can allow re-size height and disable re-sizing width,
right?<br>
<blockquote cite="mid:53077770.60702@linux.vnet.ibm.com" type="cite">
<br>
Also I'd suggest to have the panel silver - like a disabled input
box. That way user is sure it is just output.<br>
</blockquote>
It's read-only now. User will know it's output.<br>
<blockquote cite="mid:53077770.60702@linux.vnet.ibm.com" type="cite">
And add a label to it<br>
<b><br>
</b><b>Update progress</b><br>
<messages><br>
<br>
</blockquote>
ACK.<br>
<blockquote cite="mid:53077770.60702@linux.vnet.ibm.com" type="cite">
<blockquote
cite="mid:1392963235-8437-1-git-send-email-hlwang@linux.vnet.ibm.com"
type="cite">
<pre wrap=""> </div>
</div>
</pre>
</blockquote>
<br>
</blockquote>
<br>
</body>
</html>