[Ovirt-devel] [PATCH] changed tasks flexigrid to use icons (with mouseover text) to show task state.

Jason Guiditta jguiditt at redhat.com
Mon Feb 2 19:27:50 UTC 2009


On Mon, 2009-02-02 at 17:25 +0000, Scott Seago wrote:
> Signed-off-by: Scott Seago <sseago at redhat.com>
> ---
>  src/app/views/task/_grid.rhtml         |    7 ++++++-
>  src/public/images/icon-canceled-11.png |  Bin 0 -> 436 bytes
>  src/public/images/icon-failed-11.png   |  Bin 0 -> 419 bytes
>  src/public/images/icon-finished-11.png |  Bin 0 -> 241 bytes
>  src/public/images/icon-paused-11.png   |  Bin 0 -> 405 bytes
>  src/public/images/icon-queued-11.png   |  Bin 0 -> 406 bytes
>  src/public/images/icon-running-11.png  |  Bin 0 -> 470 bytes
>  src/public/stylesheets/components.css  |   27 +++++++++++++++++++++++++++
>  8 files changed, 33 insertions(+), 1 deletions(-)
>  create mode 100644 src/public/images/icon-canceled-11.png
>  create mode 100644 src/public/images/icon-failed-11.png
>  create mode 100644 src/public/images/icon-finished-11.png
>  create mode 100644 src/public/images/icon-paused-11.png
>  create mode 100644 src/public/images/icon-queued-11.png
>  create mode 100644 src/public/images/icon-running-11.png
> 
> diff --git a/src/app/views/task/_grid.rhtml b/src/app/views/task/_grid.rhtml
> index 5e2a3d5..de428f7 100644
> --- a/src/app/views/task/_grid.rhtml
> +++ b/src/app/views/task/_grid.rhtml
> @@ -20,7 +20,7 @@
>          {display: 'Item', width : 120, align: 'right', process: <%= table_id%>item},
>          {display: 'Action', name : 'action', width : 120, align: 'left'},
>          {display: 'Message', name : 'message', width : 180, align: 'left'},
> -        {display: 'State', name : 'state', width : 60, align: 'left'},
> +        {display: 'State', name : 'state', width : 30, align: 'left', process: task_state},
>          {display: 'User', name : 'user', width : 60, align: 'right'},
>          {display: 'Created', name : 'tasks.created_at', width : 140, align: 'right'}
>  	],
> @@ -41,6 +41,11 @@
>      {
>          $(celDiv).html($(celDiv).html().split(";;;")[2]);
>      }
> +    function task_state(celDiv)
> +    {
> +        var state_name = $(celDiv).html()
> +        $(celDiv).html('<div class="state-'+state_name+'" title="'+state_name+'"/>');
> +    }
>      function <%= table_id %>_select(celDiv)
>      {
>          //nothing now
> diff --git a/src/public/images/icon-canceled-11.png b/src/public/images/icon-canceled-11.png
> new file mode 100644
> index 0000000000000000000000000000000000000000..c1b3d85a476a16a0c3165f496aba5de9f67cf2b4
> GIT binary patch
> literal 436
> zcmV;l0ZaagP)<h;3K|Lk000e1NJLTq000XB000XJ1^@s6sjPP<00004XF*Lt007q5
> z)K6G40000PbVXQnQ*UN;cVTj606}DLVr3vnZDD6+Qe|Oed2z{QJOBUzMoC0LRCwB4
> zkiAaBFcgKa9n+*sq$VjKQYs-)F#<vgUGfINh<FHw4juXk9T at r?6%!z_B6XqdKqeM`
> z1QINWKZUAIh!f)*nhZHoV&8MW8=shb9UTDb{^r`IRB6XNYQbCzTj(W8e6qgXe8rmL
> z>%kj3B1v9YNzFkN4x*2JtjTy|(MAIc-LSms>RN|@7ziNl^R3tCQKY9Jr8PzgZ8J at U
> zlBRj)(sI*0y$rEAYFNiOuQ2Avoa at NZIOeS|m_fy;bgE}p8F((2J^5VN_4;8NNpdvL
> z7fuI7(7AixkAr_d|G^Xvrfw0Of5gpUN}z|Ex6hw`5q#QNQNR63mnj60Bjbi;3xM=C
> zq~RN7z>IjbJNbofz+o%B4S*VX+_d0h296Lggo2n1$rA|@*fq;AN;BgIC$mVI5+RS4
> eKK8Nx6JP-SLWS=%B?V3Z0000<MNUMnLSTZ=pt0cq
> 
> literal 0
> HcmV?d00001
> 
> diff --git a/src/public/images/icon-failed-11.png b/src/public/images/icon-failed-11.png
> new file mode 100644
> index 0000000000000000000000000000000000000000..346e5234b54af6800d5588d5f35145a07c3b9e1e
> GIT binary patch
> literal 419
> zcmV;U0bKrxP)<h;3K|Lk000e1NJLTq000XB000XJ1^@s6sjPP<0000PbVXQnQ*UN;
> zcVTj606}DLVr3vnZDD6+Qe|Oed2z{QJOBUzMM*?KRCwA<Pt7g^Q562}bWl=^F%nX>
> zp%ymcuf#i$bXObCFpEBhMW4Ydcmg}E1Z%;n5{aUz>P)9|?{&Z1R-DY4bH1N@?mgnG
> zatg-N{Y~C+GF6!lLX0BgPSli=7aKcAufz_2&kyyIR;rov{IIxp41c8nR$}tht(g;*
> zl=Z^q7MAjBNOt$Jetl;vF?s64n}t)I^?bM)2QrCZl;ImpB_>auK3B>#T<|@}e(%r3
> z(AI1?4fsa?ZhwX at g|Sg{sefh_{g_VJk0BbxKraV#L#H9Ty}r%d%#_VB|JLfjycxB2
> zrwcWRp^_M0xq^eocg&a1ES7@^)aetq#UO7EH at z(2I-~1O&Y`a^ZJ#Qj9oyln;$=I)
> zM}(5rsAtUvxk>y*Hv!_*7zGX&r_r#p*zjZ`QEQo9$4N|{I(@$a3;?6-p2(4D5NQAa
> N002ovPDHLkV1fmuyLkWr
> 
> literal 0
> HcmV?d00001
> 
> diff --git a/src/public/images/icon-finished-11.png b/src/public/images/icon-finished-11.png
> new file mode 100644
> index 0000000000000000000000000000000000000000..bd1156a0296dbfc539d5b4388ae79c039838a39d
> GIT binary patch
> literal 241
> zcmeAS at N?(olHy`uVBq!ia0vp^+#t-s1|(OmDOUqhk|nMYCBgY=CFO}lsSJ)O`AMk?
> zp1FzXsX?iUDV2pMQ*D5XCVRR#hE&{2`t$$4ee-uNSvDpG#*Xrh1_ErK8*j*ToZl$0
> z at B)8FtHTUVtqg`EzZ)YMd>3kmJY-d{V+gL{=#Xu&VDVgNE8y)cYSqM&c<u-H(*2Ad
> zV-&tIBylR#F@*kLj5Iv+OG9B=qZW%MM~kLQ7!UKkfM3j4j&PrtWMD4uAar<@K;%a!
> lCoabZL6PPoObrao3<=GO+4JNDl7P-*@O1TaS?83{1OWM-P1FDY
> 
> literal 0
> HcmV?d00001
> 
> diff --git a/src/public/images/icon-paused-11.png b/src/public/images/icon-paused-11.png
> new file mode 100644
> index 0000000000000000000000000000000000000000..f6ba04ffa265f1d5c1526d51d5915d56790d259c
> GIT binary patch
> literal 405
> zcmV;G0c!q<P)<h;3K|Lk000e1NJLTq000XB000XJ1^@s6sjPP<0000PbVXQnQ*UN;
> zcVTj606}DLVr3vnZDD6+Qe|Oed2z{QJOBUzH%UZ6RCwB4kTH^iKoCWH28u|eFcYZ4
> z)P!)YBC@=P2at%sV{E`dJOf3#h9n*U2q6MQ7+||+)hhQV)BpFIrWtm*T!0kEv8}4=
> zx$pZBp3*ce5<+|*4u^s~BRENtFARTd+lK9S`(ojCyFpPDfJ1is{r<{=Ah4%t%0176
> z#bN>fRo6A7X$qWkhbxM5w$>III3ADS`#xk at CQtH=F|e#P5XXmM2say7P9Tlr2$<nH
> zN#8ULxbB9skW+B)9x{BvxIc`Oc*BpbleL7q?hb9+eohvn^pxLUFzyoNc at Fqwf3SE?
> ze!`SfpE!0po$Ps at b2Rd2NL14oNZ6A#_8e}Ss{)H11u8;@v6N3}ESK*~)HhdV!G#z=
> z*Yzt7aUOjim1PBGSwdM=v_eEV^~E6ISAYQke}%MAx4X<-00000NkvXXu0mjfDuk%t
> 
> literal 0
> HcmV?d00001
> 
> diff --git a/src/public/images/icon-queued-11.png b/src/public/images/icon-queued-11.png
> new file mode 100644
> index 0000000000000000000000000000000000000000..159e763892533ceb20e34c6a5d95f22a0827467f
> GIT binary patch
> literal 406
> zcmV;H0crk;P)<h;3K|Lk000e1NJLTq000XB000XJ1^@s6sjPP<0000PbVXQnQ*UN;
> zcVTj606}DLVr3vnZDD6+Qe|Oed2z{QJOBUzI7vi7RCwBA{Qv(y0|;ow)k-rkvz9RY
> z{$9WU1FW1A82<k5xxT3RDTvDmQmmO!Z^rQF*GYCcU4~G99|ofrXBo~(7&ENixP{^8
> zqst5oENtf27c`z?(1@*()`+h7pTF_O|F_@&{s)1Ftu<g8#0QCk<U#6~KvsiHtaDRk
> zxODs=*!C}Hj)Q3szwFIk2184G29P=?kQ+f(3vn<pI5;}Oo%{XnEe5g4tqg+pE)3cx
> zRtz9 at Odtsz5f+A3D_1fggZrgf46>EY3 at 0Bw1<Qi~n7s1l4?}f$I9wrzvKoVESS$mt
> zsU?F0kl%Xp6Ih%H6g(hbzx(lz;lTd=U_qtsX<&sQK1duS4^qbj3P(`zH0`?0pa=2@
> z5Wt)S;)BG&!3R`_HJm|i1UU^ooEb at pL4W`Q0HnjIr!FTu)c^nh07*qoM6N<$f?~m^
> A!T<mO
> 
> literal 0
> HcmV?d00001
> 
> diff --git a/src/public/images/icon-running-11.png b/src/public/images/icon-running-11.png
> new file mode 100644
> index 0000000000000000000000000000000000000000..461241902b1e28b91c6d5aa8728d06fe929feca1
> GIT binary patch
> literal 470
> zcmV;{0V)28P)<h;3K|Lk000e1NJLTq000XB000XJ1^@s6sjPP<0000PbVXQnQ*UN;
> zcVTj606}DLVr3vnZDD6+Qe|Oed2z{QJOBUzcu7P-RCwA<kWViIK^VrLo!M<xORQF+
> z$yP*MI5<cXEAi*xTQtOHaOeSv_yP{Sal$uoC_+Dgii94tLK|$m^v}-j)Vzzvdzg9W
> zd44nV<kj}daZp`c&)J;IybydFzhxL<Aq?5!%2K&TXN};?o7qJ}4{v6sUyw?Ae=OeK
> zNAOTdLj>GecJ4~r+G*A{jG($OUjb(lFLev)2^Z+oQ$V|I;`ZK#5PF6wAU`$PKwoNj
> zeof+R{R!6B27-Vi5FD|X0Qtl*^~Lt^P#3;3LcyZ%cNUM4>gDJ)_`VMEiHlqkL{CQ$
> zvO(Tm=Lln+T%?mv6|H{n=Mesb53V**4bD}^2O4EAxXpyR&7+)D`^7Chwu&m69_el?
> z0j4-@^(1R^)~}9RP3W4$XU{~!?5aViQK*pwlA+;_LP{;eQo~*?l$z7{7=_m{5o02n
> zg6}hUUnWRbphH{~QZ*$hS;lL}3-zXjSJwjVUMF54J(ciE#C;1e00?HSPo;3$k^lez
> M07*qoM6N<$g3AleZU6uP
> 
> literal 0
> HcmV?d00001
> 
> diff --git a/src/public/stylesheets/components.css b/src/public/stylesheets/components.css
> index 228ff7b..9a913c6 100644
> --- a/src/public/stylesheets/components.css
> +++ b/src/public/stylesheets/components.css
> @@ -316,3 +316,30 @@
>    width: 40%;
>    padding-bottom: 15px;
>  }
> +
> +/* classes for task state icons */
> +.state-canceled {
> +  background:url(../images/icon-canceled-11.png) top center no-repeat;
> +  height: 11px;
> +}
> +.state-failed {
> +  background:url(../images/icon-failed-11.png) top center no-repeat;
> +  height: 11px;
> +}
> +.state-finished {
> +  background:url(../images/icon-finished-11.png) top center no-repeat;
> +  height: 11px;
> +}
> +.state-paused {
> +  background:url(../images/icon-paused-11.png) top center no-repeat;
> +  height: 11px;
> +}
> +.state-queued {
> +  background:url(../images/icon-queued-11.png) top center no-repeat;
> +  height: 11px;
> +}
> +.state-running {
> +  background:url(../images/icon-running-11.png) top center no-repeat;
> +  height: 11px;
> +}
> +
ACK, this works/looks good.  One comment, the naming of the png's seems
a little odd with '-11', which I realize is to designate size, but that
might be clearer if it were something like '-11px'. I am fine with it as
is, just a thought.

-j




More information about the ovirt-devel mailing list