[Kimchi-devel] [PATCH V6 2/2] Added the generating progress indicator

From: Wang Wen <wenwang(a)linux.vnet.ibm.com&gt; V1 -> V2 Remove the generating progress indicator when debug error appears Have the generating progress indicator added, which will be removed after generating progress finished. --- ui/css/theme-default/host.css | 6 +++ ui/css/theme-default/report-add.css | 9 +---- ui/images/theme-default/kimchi-loading.gif | Bin 6181 -> 6181 bytes ui/images/theme-default/kimchi-loading15x15.gif | Bin 0 -> 1653 bytes ui/js/src/kimchi.report_add_main.js | 49 ++++++++++++++++++---- ui/pages/i18n.html.tmpl | 1 + 6 files changed, 48 insertions(+), 17 deletions(-) create mode 100644 ui/images/theme-default/kimchi-loading15x15.gif diff --git a/ui/css/theme-default/host.css b/ui/css/theme-default/host.css index 5c9a119..96e78b7 100644 --- a/ui/css/theme-default/host.css +++ b/ui/css/theme-default/host.css @@ -219,6 +219,12 @@ width: 200px; } +#id-debug-img { + background: url(../../images/theme-default/kimchi-loading15x15.gif) 12px + center no-repeat; + padding-left: 23px; +} + /* End of Debug Report */ /* Software Updates */ diff --git a/ui/css/theme-default/report-add.css b/ui/css/theme-default/report-add.css index 236029a..3e52f63 100644 --- a/ui/css/theme-default/report-add.css +++ b/ui/css/theme-default/report-add.css @@ -12,11 +12,4 @@ box-sizing: border-box; margin: .5em 0; width: 100%; -} - -#button-report-add[disabled] { - background: #c0c0c0 url(../../images/theme-default/loading.gif) 7px - center no-repeat; - color: #DDD; - padding-left: 26px; -} +} \ No newline at end of file diff --git a/ui/images/theme-default/kimchi-loading.gif b/ui/images/theme-default/kimchi-loading.gif index af92bfdc0a44170c71fb7406d2c6bc359e176e91..233bd5f140d63a30b1944cce33bcb68aedea2efc 100644 GIT binary patch delta 88 zcmV-e0H^<@Fr_fCm;;k$7rv8U1SFGw6zr2G7eJGc53{o%6$S#cH52OrvqKOD0<&-o uF$0ru3=or#2XC`H3Pb|4j|Z&+ll})}v#kcT0h6r;3zKmLNRyZY#{oNnW*-Fr delta 92 zcmZ2#u+(6~4CcwP;>R}&2(dFx<`NH{T);nJ@>_B4$@_#Nfqd@G38JeQH;W73V%#L) w!n8SoN0E7Q70aT{UR-QUK*pQR@f@!iC(E#UZC=c_hjDTmtHb0O%=;Lv0m~sDe*gdg diff --git a/ui/images/theme-default/kimchi-loading15x15.gif b/ui/images/theme-default/kimchi-loading15x15.gif new file mode 100644 index 0000000000000000000000000000000000000000..aaa4f85a0560dcb59d4bb70154a9144417aae926 GIT binary patch literal 1653 zcmZ?wbhEHb6krfwcz&0`fx$V3fzy*s(30KRoyj+pP0*a%B9B4Xkl)0X$H9|dJd8D} zo<ZDBSSFF7*jZT0OhTc9Q7nTgk3rREDud*7MxI>8&Ju=(ISf+93MQOdag7Y~1hic{ z8T#{u6)cohTNtM^7+W$J#50+i$>`cj=^O84k`pyFn#{1$Ur8%a&i6QjtgEuCfQhw> zh77A6gQ$gokA@_-E$2dp^>Sv?oMy2Rvbjr`S1FsTIOwZtnQE_R*m$2oUC1KhF@wT7 z#vS5TPBXdYi#jqhIC*|#&}Xr)`pY25?86wZk@$x}Azj<#4}*rAu{Vcnu(UhJUj}_& zGsWW!mvn9Irz#jqI|d0m<_4Kq$D4?%x#%8bJFV#KwS(tqvz9fdTmMyIV-~+CKU<>^ zTODbStQ;$e9OEp8kfaJrQB(IojUXN?PfLA&1ruKlE$<Ybz{O>Dnh|c+IZj3l84L_z z+ZiGkGQ_8gg)Ec{ZB|VbVu;;p8Ir+}TJcZ8St};J)7e)ugI_wAy~kUSA^Gq;v#nzB zo6<uZ9TN=&l6EuXHCx41&a>X&p6tkweNrgxtWY&KLrITauKX0wDL;*ZSPITdWuHCl z7S2#|o1wN-skGcGd-j}YNrw7v?ff;HUH7htly%83WoVk=SR=P3TA8QnVNZtdt|Td^ z4tBRT;l<gOCKJSuq^f)gOk<w3o@>%d>z1S5joVY2V;E+x4Cszxn7#dGQiZ}|@k{wq ze5<)H#@>~ixp+mvx~nC^*GqKvReGJxyd=J8Z|Hp0)LG8{Q?7j|(|J;(^S(;?X-VtX z{Ej0{$vo>WNUb@RHtpd12Emt&YTJ7ve>HRaY*WxWB$BmO<7<oVrMfE&d+u577yI7H zdv${AuTG6`J!)PD74G*(XRN&WpI$)mKewN2NU*bGfUA+70W%{51B2pE7EU3C{|q`n zHZYS2Ffee)GW_S1@z}87U^9oXR?LYF3lFyoD0|KE*tqCuBO@a=9coY=j!k!j<aB0i zc<9u4hfS*nq@!EHIP1=djf>s;v1`@Ep>^V-!(BqkNq@`*laF`Fn|H~0Zd!7(0h{Hf zM42F;^~FLc<zy?bzucZ38xtI`nPf?{Nk)rZI#dI#a%KcAJ>AR3%!JJ}Tb!mjcL>V+ z&Dl|qe5_B>QtnB`#6;Il`9QBD85<TlO;@&EX5(p~fXzf_h=~b~c^s@tPtrczcWUF8 zl$)Y)G4W`lxU|rj6$Xj!z4E$EBA!9O@K)2-%Q<1V)NzW4rQ4Q{qQ@s^Df6<iU^CYa zVJ@$f%ZvcUgKd2BZZRt+Jap&~-N|`mN5EtIK6cxtnin4*pO_@<TefG1V5)aFPwc)q zGcP6L3rdhvk&Uz{R5;QluAbJjV`8#<o~Uk<jm4+?Cwh5=mxY`NNH{%#3wux+Vs{|2 sX~(-16pJpOC{Q`pufUDnn>s|9;tWh`McC5^G?`;~3OSj#0+YEl0GD)I?EnA( literal 0 HcmV?d00001 diff --git a/ui/js/src/kimchi.report_add_main.js b/ui/js/src/kimchi.report_add_main.js index 8759c2b..45b7e57 100644 --- a/ui/js/src/kimchi.report_add_main.js +++ b/ui/js/src/kimchi.report_add_main.js @@ -1,4 +1,5 @@ kimchi.report_add_main = function() { + var reportGridID = 'available-reports-grid'; var addReportForm = $('#form-report-add'); var submitButton = $('#button-report-add'); var nameTextbox = $('input[name="name"]', addReportForm); @@ -13,12 +14,45 @@ kimchi.report_add_main = function() { return false; } var formData = addReportForm.serializeObject(); - submitButton - .text(i18n['KCHDR6007M']) - .prop('disabled', true); - nameTextbox.prop('disabled', true); + kimchi.window.close(); + var reportGrid = null; + $('#' + reportGridID + '-generate-button').prop('disabled',true); + $('#' + reportGridID + '-remove-button').prop('disabled',true); + $('#' + reportGridID + '-download-button').prop('disabled',true); + $('#' + reportGridID + '-rename-button').prop('disabled',true); + $('.grid-body table tr', '#' + reportGridID).click(function() { + $('#' + reportGridID + '-remove-button').prop('disabled',true); + $('#' + reportGridID + '-download-button').prop('disabled',true); + $('#' + reportGridID + '-rename-button').prop('disabled',true); + }); + var textboxValue = $('#report-name-textbox').val(); + if (textboxValue != "") { + $('.grid-body-view table', reportGrid).prepend( + '<tr>' + + '<td>' + + '<div class="cell-text-wrapper">' + textboxValue + '</div>' + + '</td>' + + '<td id ="id-debug-img">' + + '<div class="cell-text-wrapper">' + i18n['KCHDR6007M'] + '</div>' + + '</td>' + + '</tr>' + ); + } + else { + $('.grid-body-view table', reportGrid).prepend( + '<tr>' + + '<td>' + + '<div class="cell-text-wrapper">' + i18n['KCHDR6012M'] + '</div>' + + '</td>' + + '<td id ="id-debug-img">' + + '<div class="cell-text-wrapper">' + i18n['KCHDR6007M'] + '</div>' + + '</td>' + + '</tr>' + ); + } kimchi.createReport(formData, function(result) { - kimchi.window.close(); + $('.grid-body-view table tr:first-child', reportGrid).remove(); + $('#' + reportGridID + '-generate-button').prop('disabled',false); kimchi.topic('kimchi/debugReportAdded').publish({ result: result }); @@ -32,10 +66,7 @@ kimchi.report_add_main = function() { var errText = result['responseJSON']['reason']; } result && kimchi.message.error(errText) - submitButton - .text(i18n['KCHDR6006M']) - .prop('disabled', false); - nameTextbox.prop('disabled', false).focus(); + $('.grid-body-view table tr:first-child', reportGrid).remove(); }); event.preventDefault(); diff --git a/ui/pages/i18n.html.tmpl b/ui/pages/i18n.html.tmpl index 25b81c2..375a37a 100644 --- a/ui/pages/i18n.html.tmpl +++ b/ui/pages/i18n.html.tmpl @@ -124,6 +124,7 @@ var i18n = { 'KCHDR6009M': "$_("Remove")", 'KCHDR6010M': "$_("Download")", 'KCHDR6011M': "$_("Report name should contain only letters, digits and/or hyphen ('-').")", + 'KCHDR6012M': "$_("Pending...")", 'KCHVM6001M': "$_("This will delete the virtual machine and its virtual disks. This operation cannot be undone. Would you like to continue?")", 'KCHVM6002M': "$_("Power off Confirmation")", -- 1.7.1