[Kimchi-devel] [PATCH 4/7] [WOK] Refactoring new-ui JS due to merge conflicts

sguimaraes943 at gmail.com sguimaraes943 at gmail.com
Tue Sep 15 19:56:39 UTC 2015


From: samhenri <samuel.guimaraes at eldorado.org.br>

Adding new-ui assets again due to merge conflicts.

Signed-off-by: samhenri <samuel.guimaraes at eldorado.org.br>
---
 ui/images/Makefile.am                  |   2 +-
 ui/images/logo.ico                     | Bin 1214 -> 15086 bytes
 ui/images/theme-default/Makefile.am    |   2 +-
 ui/images/theme-default/logo-white.png | Bin 9879 -> 7438 bytes
 ui/js/src/wok.grid.js                  | 395 ++++++++-------------------------
 ui/js/src/wok.line-chart.js            |  70 +++---
 ui/js/src/wok.login.js                 |   3 +
 ui/js/src/wok.main.js                  |  42 ++--
 ui/js/src/wok.message.js               |  34 +--
 ui/js/src/wok.window.js                |  31 ++-
 ui/pages/login.html.tmpl               | 155 ++++++++-----
 ui/pages/wok-ui.html.tmpl              | 136 +++++++-----
 12 files changed, 377 insertions(+), 493 deletions(-)

diff --git a/ui/images/Makefile.am b/ui/images/Makefile.am
index 297c0bd..6627b50 100644
--- a/ui/images/Makefile.am
+++ b/ui/images/Makefile.am
@@ -19,4 +19,4 @@ SUBDIRS = theme-default
 
 imagedir = $(datadir)/wok/ui/images
 
-dist_image_DATA = *.ico
+dist_image_DATA = *.png *.ico *.json
diff --git a/ui/images/logo.ico b/ui/images/logo.ico
index 446143f066a60f479b2cb8f8d04ab3c97ff60e56..cb3a3dc2f9c9ce0e5d3e14f0adab89c28c729ce0 100644
GIT binary patch
literal 15086
zcmeHO30PBC+78mXO<TJ-wrXqG!cEvi*mt=svWSWsTC~_2chuI}=`vNP&eNGrXa2F%
zTD!XM3sgaiS_KzeKtMKuge5EqBtS^WzJBxFX!wDmg at W_X{Lkch&hwpf?)RPZo^#K3
z-|vJ*v!U72o_&^v(vG(32^!6hMx)u;-A^CI{N0%6<@F%VpwVJ}OQSJS2Opuu{d^QO
z8tVO;AKA3qmTcbh9ND<r_EGkdD}=rD4zWbRBUWl!ox_X at r*V`%DLI%%N{<wvTo+mY
z-GC_CuMrcw?h;p3jZDyWxSDlRSE;VUeW$LK^K4|t;V($l37DbDl+BT4#0-R?;|4KN
zevio2w6a9HPR<{d^_)a?i|;y}z$-LZu-`ta>*yD=^jYd9`U_tTWKZRFlrW}rm9d!8
zQa1}mS*fRuw8+iU2LI|Wo=B3P+POe??(|Z{**<N^SvFymWTj_N>&DRSw>Gkuo>(_^
z!a#MziVw!b$&YVlX2BS*T-^lUOtlTAcaQ6sDp|#r2-f>#6uiT+`*O{1Mh#?7@^(%Q
zEY5avy>9q2wA`3CyWHq~h5M3A4VS?et>MV-rF&3A<B>ndQ!2X0ErTGT-fURPGc76L
zzLMI&Wg1%7`ZV6#=xzT<V|?g%TI1?_#~@CwHPyUv&&a&Zec7p=OY9S_a(n+wbjH;E
zKKEXDSQ$>oRWA^^y6*xjP2%Jl(;};033r;MKl6hcS6=X|jj-nTmX5o-$2gu*C$MfA
zwggm}f>H|fKkK90{!M$Y_}1_G-nD2nWgAQvjt{1bEPd>6-!d-TsWoVZqsXCmxxM50
z{terUgPS$^Aq{&o0?GqOdRKHTUH)dIUB{w$hwg6{d8riX at v6MvEml0&+s+!lz~Qm)
zhBY_xXNsY4R^#<|y+jTPcIq$ZIBKLz*?QPK(`fi;nf}!KuPL9l+Vq!KL+fT&&27C=
zvY`1dnPkc6Bsz>;z|{G at 9;8WGm#Bz;dvW)~{x-eS7fGH?>AaR_Z_jTW+dKbZaR3?(
z8fY}Z-)Xewn;37U(Yi3NL`S3Tc at T0Hn2&j_7$_b27#dB7aVn2mXY4RUV4&6~%a2-k
z{-6KIvM<Jw<vRz}$Ajq#(K%vN`*mV`X94ka=PklAeh0E6dEeNQqJ0Z-ExkatA38 at 0
z_a&3nU-em!2C{otp7<wXoFtb>Y|kflNsEZf@=D@{f=^^C8;HNCn~7+(h_I}GR(rB#
zZy+f?ASPu;fs`KuQhcxr^VUSyefP8ZXtjBmY`Z`_f$RQuY_nQkL4dNJ08J|ax=sQN
z-2 at nwgu<X8_G=}CowW>X_Zw8bQR<Trr9A~ChUl)N;<(m>kyf3-%J!?cUlkGp+^;|*
zBtYNE0;9qm>-Izp?*AJko;kX9pO>g|$+rFeh at qA2MhyB)h%skDqW%obm1P`%ReTC(
z#^8UrXW7Y0iF#Edwz-39vnv?nK5|W)|C#O at -#^MLeg2@}`R><>1NhoDzmH8h6GwT}
z9UDc~eV0bI?yrhcp3uh|vtT})ho$-p;@1>sJqKSqjfQ=1+gV6_*i}Y!E9#jBRg)`U
z-ONr^w}kh!qqAW8D77%qzPp<JmbA##i7KBg`N9Uz15=~h53P^uJ|UTB{1MVjm&|GE
zoMl6)pVAfQ5o6nL5FyeMR+6m3#j&%{#j;-aFQ at ai%lOXQtUl|e_x0^IF_J?YXDKrc
zsiuptM3eJ=f4j$>j;{ZHVuIwzjk)@>Fi&@O!%*rg=Q`T9tn+=j`OV;fyKnhM{Irqj
zow@$y=Z8`Tr5oFN at S}KDhAL6}L&RWhd0a<k`wGv0$k&JRS~o{3i{JLCKL4ik?=#Y;
zxE)P at VZe9ru(G3C_NGO59L|YRoqUGUalfb?>v>r>ft{lr at Vt1JYezP6Srv+vz93Ey
zfa<sXuNS}L=bP~XG2}Ibs*kMMl|nXr8&AcFA2eQWS9B*ig@(e=Tlzo6-qQE!&wTEb
zplYsDZO2MB$kzlw#Tu8&%j at WFl<lwikwrUf$h)7}#oqgPwBu3jc;~a4Gj4Z`5Xd(}
z+&!atc7<`XwcPXEiO=5PPPu^RCFoqmftGbXrn0pztF6z6E1gcNorxc{LeDZIgbM)X
z)texdZ#uB(uEFv?uW~2PzQdiSY2ms+`)Ur<t>=i#*1P}ew)e;DbV^Mp&TH#ArACOs
z`d`KRU+0-VvFhPjb4NMX9>iRCkgoOx!3IA`<wo{M)<2bbUd!{x_9qI=u#|67Ew3_K
z#>I8+OE!hvS9Vu&9iW5j30+u!{d!Jg`9 at F6nr6i~9O-mglgP@`slsbaFsI%ODP at K;
z%Zl|qYt}99)H!8b`%VeAU%b-GRI}FYZw0 at bX8Wo8y(d2NF0{;@Ut2$8pK=o8tmcAi
zG4_1}zI(o at YR(<Kckl9Yxi3CZ%%#URaEVU^D_E;4RykSDu}A$X!uR-;PVcQdlsF?(
zJ&BQ}`JR=pH*;#t5M5)cNUk&vYCpakE*g6!L~!U_0DsO<>ZEiTUw2Pn>`}~NWT?+N
z=jpmUN{!V4)uzuPN{!U9bWp!LK`m~DK`m|Pe0W3NJFx!ojC~4E#t-TU=c_tjw*tcy
z-+cXmYu>}a-12XlT@=t_`q7)0f7qk!k!Smdl`)+BJm30-g at Mh+8~y_0c at FRW9n4#O
z at CVUbp2slYIX8gbG!DP9V#6Ip?~+X6!dRB at si9&y at 52kd86fB`4HiOvK!fa at PxZEw
z-W9~xE`^plv3&0cx?~f6hdG2y6Isr=E-&A+37^*fQUtyI(`dU+<t$bgEb^1;(;_-Q
z`qO&NkoJ%)@2cNk at vAE;4Q_#|uvWMm-eSBI#1|d*Dc!S&Q}psHlRKWALGRubPge>e
z=^dG2^tN3Qbn*TeJh>$~s11u;46r851Ru;d!Uu~r<?k#~Od4t*oa0o#QyAE2u8kCf
zAg&#165Aj at t^v-G)jMJNDVumZB|XkwnVV>@f|>SeNODlY0zwDN*d|y%9pJ-x0H1Kp
z at P{|FH#aX<4EgKpq*wXmEB<v?E2j%VkR$=&qE2W?l|X({eL?2*N(+}U!(L&R?4bW{
zzN1l^;%tO8FC(_w2%D1(@ZqaE^S0MDbswZD=MA;(R{b;Vdp?(f`FAR33ZY at K1j-i)
z;nGb0w|fJNd%kUw?A2ptJE;Taxu`ZT at l}8OMwsdtH at f@Vl?k%7>yo>i*DvfG(z(T2
zw^g1EsbbtsYW_z}O55$i1x;U_pUJbcKI<=&rZ?Ek4Q{iI<unbe&i>^V&1$l(Tp)V7
zU|wTSyZh_>C#Iq2rvMn!2u2$L7- at p7M%u=$=5XUy0CP{!ZiTHffaXSkYu5m-P+>d9
zseti6bpcE;gPCr|GJCA(+Hmt|S~%EJVcS;NE(f^TQz=jz0#c;3Gz>jF#fa_vSm=L$
z|Is}_o_K#0dF~Hm$WtE-Y5(}YZZygNW)$*4VaQ8-jhsLZax<S}+J~&(HKOa%K<#YJ
zA#B9C#B<17d34?;Vvs*d>MA8jSvlb at s~{$#FQCs^VxTg}raiMs(S8xxc^E955+z0Z
z1n6s6LJA)3Zy2b&!RCoC5zdHxD{>$=kZ)`2Dz<P?y6$R1h5T0=a#2O924a`0iHOB8
zexP!Z19={?<|7YxAG_lCeNL<c)1rM+eE!-%cEin+<PqVByAp8&`b?m^3c0g70+6o*
zP1}7gN#BKhmJEX&IW#$O2>B&e|9Y|C-N=r^?IhxkQX!wFIcee3C{B&ai<TU0oFUvF
z(BE!2Y2+H8LF^ZBYykRe9^htzR?Gywl!Y7^a&RgZm^2u4EHE2TYFYS<S*#JU{Cn3;
zwjHoX{0*c6c}VpM3-%~OCPbM|Lo|jN-6tVYeB^kt at JJsHvv(OojU#q99P45VyQ+a{
z;SF`|h+XD_e5D6sXM?`W3)|y~@50j}we83!N~pjt(26<ep}YUX`Dz;_-1}FQKz1F$
zHsCuj{9xe};~^Vn>9b+J{D-cEof+X)o8e0299?jpw&EBEbqo61+9}?ViMZV`_+UE%
z3~Hf&1M-i#@(Q0bvT~mb at +#kQRinRL*BOAEsQ+$N6Q}2UAiDP3m&n?0k0A$apyqG1
zE(79BS&#(hV1fBOEHNNAsXY7F;o`R1BTxMla<*B>Q-ezIV7zxyK0`OqN;r+$wt)32
zL6C#&ZqWFS8zE12+z1 at obvJO5vOX|O+ZOmg>So`X?rN_jYk8C;YrcLS*P1lsb&n&L
zER9oVz${}nq`(D8Ghc>f+Vh2}($jr-q~7*Jjd$E60y=IHccdkRNnXtaMIB48;JX$o
zYCQ(@ZCcA$w*-%pS9ndA-f{h~^EUHmW11B19Ua|vU~Ww35kZ1F6Bd|qAPo?|?t)}#
zceaPMoRN@{s{|e2MVhpTwMka)nk=huoif;Rk;k2ep=S*Bx5G9pnjt;bovh7*CFY;t
zHT?zk5=Hi}<|q1>|G3kU!o6c+MF;jI$xcCv={zhpoY$l%vj)Y7JZ@}*EkCwlcUZjm
zaMx^HgOZKsI+B&A*@LwmjNa|#^ij3zIAiZ^@Ec#bDSS-Zhp8iaUWws-^9;U&E7Uwd
z|4d<G_sL<;-)qY!jS{SIVYIFFT_N5W`fc;3u$=NuetB2la{uw%2FK4b)2Gfol|FgM
z9LU4^D_Xe!^BDPYh*h2Z_+dJO%`fHBUu@(OTcj)4waRrNrtY_+LHIio?r!!|=5BI5
za`sKfIf$KgGX158&db5pW!1xbBU_^+2Zea|qK{w7<C5-4^bb7covVA&s{1He$erd|
z#dXR--q at sG=?~rMA<(iZ1gbU%))l|wo09(?r^jFQsB(t-jO2awF)8?Ndn8=6j7_J#
z%2BK=O{`m<?kM}F{<`0F{lSo{x~SNzx`%!<;Qa`<3a-PgrWLNxjs6bR>Og2*%Z7q<
zqCS5k>#?l~WXWg0A<O=;fvnouvo1SlsN<MFYTMik48W;0K?w5nQFxal?v7zV?)5Tv
z(ksZBU#>%cMf*xGP$G8e+5jkD!&2m~o|Zb){v3)vS-fL3S+b*N&N5D^e}g=0HZxZT
z9*Et)0f4MCLsFFqkZaDHU23rKRMtAOS3GZveD~jw?}lddcXX`uhA#B?pw9(L*SZ|J
zy4vn%`={0RaY)8VHH&dtBV=9EgBM~BLjOn{`Y0CEnqV>C)ch*nWZ%19?0cVU+{q#w
zJJ8B?wcu}E>kIsJwzf3gZNT@{+kT|u*#Dl+S(<j2>w4fI{xHO!g!ohIOpwMm at lvad
zQ+wBm*tg@@hZ?Sv#oyDpk^`c2U#QvO-B!B6{b%1Iy=@;y9DNj%owGHSZiwFx at smg{
zB_sYc#Qz4*^y9)i`krq*^btOd*soAyr;h84{vr?PTIB<6=&P*V=+j=Yk=<uKdmMQC
zm+6$Lo{0Tl;*R4d2=T`v{`n1NSjIO2`ncZht&ek-j($EtDc24JTqa1lULap}-`9%x
z<>+$@?ydi?h-3eIqHna->xLe}&_9-l_^GkKw8GH%dYPe*4-oNB!B9itZ{o5*#${X9
zP7%)C>h)gy(hVMV{|d~#>%h7Dp7SLga7v62jlR7(jb at lvX*A)u*|zS6rq9_WpF7$1
z7Wd^H)c9${{+A<u8IFI!8V{&g=lbWHo7p}3JA4X$kt6Ai<JZI)M^qk+Yz^P}wgLRG
z?-L%3o#ax(53{c82J|_hpL#0#YY(8WT+zmL1JMdM6>k;uVCfpdau0^WvD3R~(&yfV
zGrsV@^U(e8*Wm4K!#J#ZiE%=mMfE)k{knm*W=O>TpI2kbpL5sX+*`MQ{3dtmQ|NDv
zz&V^&%XKCzS2*<eVkzBY{*`a;^C?}`-)^MRIOge$Gn%8sMXj0g%X;ITfKZ;<G^4_J
zepZRWbvX6h3~Qoa4yiBC4&ZTzQ%-+d^l6S`e6Mg|98{(u{vyUtI$+{?!K>0_^yist
zLn at 40A`1;K_O}~qx+ql0y&cjF=lpovhHCpLeZ<d1{O>UiDKoI|a~XNMEaq*)F3%F<
z8@?q*C%+5YVUN{A?qyGw1PPC#?-;VYtIzFmE9u!g9))eN&lpElw%GS$7&+Q;jGwfl
z8Ala8>&0Npc$6OcnkN<q2#YX4HoK<duzOj^qxApXp5=J+><avwYD)rzkn39qr`c5p
zGTHY=^gPG*Zn5$9Xnun2Cmhkfr}{FBUH!^+zlNG396v>Y&2Yu9UY+e-z2+0=`~k-%
z`oLcZrngKR%zFr=H;+Sq{mf8%(avxu(dkI0 at Uv)^&?nVXGGgsG?pgj!u5azN!oVh=
z{Psmb&2Z6|-+qc+nSRWx{Ac%Ag6P5*F?<q67yCuhI|pnd)i!)SA(Y<wSM;x|qU|~$
zk?4Rq9_=ufBd%K%BpERd)cvX5HWz*PpWg})SnyYbh at dFA3GxE!H0S+!mri<@f3(M=
zIP6Q;!k+KbaJpo5G`*`nj;{DDiY|>uoR0WjeoKWAy2t_VA|yr9r5Q1FnQo at N5*9Eu
z at VcKC(xWx7K0yiVle$mf-GCAMPQ^O|Gx6Snss#I<y0^fKXoH%_HYka}cM-&cBR*xF
zyS<Cw+2>m_n(AA`{#+tmbvBW%2E?ewI~7fMm!S+pDaIS4?WCFnJ0;9@(!r}PMp*7^
zhPPq>wk`zNo at Rs(mue~yf6v}el{uW>Nw13Munm`~cTkP^>!`aAvF%VFkG}snAzX{8
zhcn?-ic_H#Db{)t?3En62T_UlApqkLZ>NAb`)){ZP{14~4WzIPcrU>Os{+mNW;EW5
zm<#ad*YR$|N+WDZ(-h#{h at S6BYnj858SKghd49F3sxT4MMTwy?p&gp%bU at RB4ya!w
zf#Nw$a50wmLq>RI&wG!ymxU$Rt4iiN7-7DH8G{KHGK`Swir*m|Gpr3Y!{&H^E%VXQ
zz03 at st}(&(6<X7KOBGv&gLNR=Lms8$ayZpr-^P#8DpCaXGbPYGzXOD+ozU`HCsd{g
z;c`6xYR2 at 6KAcvfgW7qngW;Qbj>h)+P6k-SG{9?~M&Je*VO^vFHYFP1-T69rf3XHW
zSgMjD_8o68mOu1=Ap>C>Y+j~U#guGLRc2mjt+^rr?~W{xKx1k<@Rx|;)?5Mn7+3xI
zZoi+OPZR7Fqmvv}ezTpGzn|x-I`b+=b$3~iTChA^)v`RQo4-6(mb)UM>ytIJyF%6`
zOD%I~u$YFbcf_l7%Gu!RuM6WFmHhc_z+a5>IHd)0XV(^=nNj8bOXVfAyT+vW$|o%i
zRye#CCMT9gbWK|v(ed<xaPf$(`M-qWY-rUu#6P!sUhA>yMXi_bENuE)UUHqwFWLRO
zJugUVe6n((Xzb-g{zLbve>cqk#WQj}aR0^-_1`Ay*GJ+dB}-ZxPD$AW8J&`Owz3J7
z+-4&iW05qgeAm{JHgB=WE4YtRY5ZO5Cz~InEfV!C(iT92`NjzVt$(M{v~)DYT|^d+
zcb<?j5Lo5b`{}&i67?+Ue$t2xDbjYJrQgRP3rC5UsRUI0tq*Wn?o46YD)GV<P|s1`
zq~sM7*itetY>N#g1=DEv<%IiEHfEdUxok|HMQX=rE&W3^gwhB41Bt?t?koQZl_DPK

literal 1214
zcma)*3rLeu6vyu=X_;nPV)$&PPF)r(wTQ|dTGOUtnOdf0mZ=cR#99xbub1{BqnD9^
z^Z>PV6h)fUny6#CN{3di2P{*h2ek at Oq0a4o*=I}2Iv?krbAR`oKi_vQA0faVCr83o
zF{!X2#Dx$Nz}$(sm^sgR<Jj30yCMGpMl1z837jm3H1$<DU4IV>Tbdw<FM-;Hi<#et
z=I}n~iB^qh8{XzCNyvT<I;$&znmT~?eFXZgAE at Om?1h(6Iq+2e1-ca!zOAO7n3*};
zXq6n?2kF<!f%cez;-Fgx4$e+xo{WR;oqhc_OW;#nF!Zm|JK}m8gi6aC+##`QA5PmJ
zfeZ(o(}%&&1P5#*1vVbnssk~XhN5bNz=T)>5^+BS=V54SJ|^z)5I7%kU;>-skiq*{
z5B^=eF<T)pK9+)bV;9UCK>t-HOi+bkR-wK1xpfXL;S<?ho1pQ5gYzxiHR~=e+XHS(
zYe7QMZb3IjWV72H-JpD~6z(tbgwn1o$D2s!YteWNJS!i9l%iW?+34Lvr*KL(6{_X|
zobEjAb{lD|4qsmYvGF;~r0Aunc#>=c)0W4s|D{#(q9~vaX{rGms=((Wn*~LeWqIu}
zkGvlzwaxjL25hey2bVweu<xK*t+ at Oa_)UKTK^x4IwmKMOjm at oL`l)}_NGPy}tdb}w
zHa>H`ji2N7m}Xsj#j7-`#=Dv}`)h&)9th^&^dR%>WH_MB8KcIXVf8p&s1xD|_k)R-
zrk$Z0-|Gf}&4Au$KhU$k?3YR5by~D9M&-q$=ocNz4!IY&p7%OxuJf&+Ei-G(23hU;
zHTLhMtjFR9ExVbPQVLzBFlROcIZ|#jmX6fm_hsVa3XP<aKAeAt8dqp&oBW=V^+d>Q
zkcNnm%Ds?ggd^Rv2~9_o82cv;p6LSBD_g_s-n1uZ8#<EeLwTm~LE9J!Zdo at M&*jFU
zoM+Z%F5)(8$8y`Wz~%Pd;Nlx at aH{<lk}}CcRMRXZMD&%Uhz3Ze$jpg#uec1IlFMPW
MDQ4iZEk#_;cNAJoqyPW_

diff --git a/ui/images/theme-default/Makefile.am b/ui/images/theme-default/Makefile.am
index 336729c..bf594d7 100644
--- a/ui/images/theme-default/Makefile.am
+++ b/ui/images/theme-default/Makefile.am
@@ -17,4 +17,4 @@
 
 imagedir = $(datadir)/wok/ui/images/theme-default
 
-dist_image_DATA = *.png *.gif
+dist_image_DATA = *.png *.gif *.svg
diff --git a/ui/images/theme-default/logo-white.png b/ui/images/theme-default/logo-white.png
index 8ef8ae15aa40ceb7db5170c9806ac74b840eaa0f..0add8428122507bd2993aa01a939b9247294a0f9 100644
GIT binary patch
delta 4768
zcmV;R5?}3?O^!MtiBL{Q4GJ0x0000DNk~Le0000o0000i2nGNE04L+?TCpK>3JnBj
zK}|sb0I`mI`%#mVkqRz<5-CYUK~#9!q*{4!9Mzrv-s{)bbkC_7X(Wv#OO|!`kStr+
z#@Il};$U#(1MI~R9LIseWXW!2!<LsK6xnQTV6#*Xs3ay~If at WAUcynNLJpF!!GISW
zb8LJe-?DX$G#ZWO>htX%^msdpz>2r4Ud at bV-s|_h-}U{z7QyU)E&_l8VBV0u!MyJr
z044y-_v(0a>9o0mH!7Fw4ci-)&z1RnHXCGr0T2d20-yj00FXsd)G4Q7*X4u|6d+*8
zvaAf}oO&Ce07P%D;=LEV^~khMSAdw_YX#)2z|00nWit{06 at U&v(se!2m}pw7l+->e
z=QdH5Wt1e_eQe}^=<e~c at sbaK>Vc2}5F!YoCMzKkBp`q=8*agbn=Kl~1RU4(?nAwM
z+p`73E?@=t+(HJR0g%JNP-DH;usJZH_eljc5pzS}rl>1AyH#mY-rHZ?_i~|FBpwJ2
zfFvqPKoi8dK}l+ at QMGo-bZTTmf)>G;AqfMc#lqo9%RE$nFv^E4)8wAz901UD9amp{
z^+j8xvRK8X0s!PlB+}TTwcII=D(k{l6e%<#j(Rv?m^?StqBOMLa6EYI^+NHC>CGdt
zSgbKAscUN-tPSML?aE}9hCmSnfdC4F5ENwQW+VDLr!{BKfNT78e01~-04~cifB4~t
zv3>jYiv~h}eQqTKkTqS8%ni4GRy(J!t8tQOChe%<DM-*^f<Ux$hzo(5Vy>hBC<CzS
z6E!`}O!<dUCU<$<a4-il8W2JP3?UGRASl5_wrJ7OVsYu20G9SQ)GY3=N#6CDn{OIS
zrBd|fn{UR2+>6a3K0dSv0clJ$UKtvW^ffq5m at h7WK*FjAg$M&2lb8Zy0#a?s!5`eQ
zyY$7sztbR=+tE&>e~t`|EuII4B~Z};2}v*nAcGOvi+C3XI11dsxndsgpB&wKYU4HU
zZo6gMw`=QaD*&9210u`<gbYBAClbj<xAE^9vQ5oB>Jl`&^B{8-C2k;x63TEffAgF}
ztG~Q|=%MAG>^*e&$YI?+dg9y3bb9p?2v`$HVp%X at G-xp^7*MEGwkYE{FbEKd1O)^k
zA|OrzsCP@?HA!Vaa9`={T~hV{@Qbww@#TD{I+*B)r>p08$eoxg%!6VFFy>~#8OPjD
z)(<4FsD7<|bK{<9Yw!;M+?eTZkEKV}bO&pHovW9vI?%Cn>09!$g{L_Y?eh4z&i5Z$
zNDm#kl)d$CgJ9;sNeBc45^U6P3*8;_C*2jxE3OS+O1>!9A^^B3iU{#gXT4Rgv`DRp
zA&M!p1UV*}U0-Q?Y0eD|d$by*pGtHBKzYxeJ at v<a`P*CDlFj2+?%46|o-f`0iV#qL
zO|Hr|KwQDGIc~gePx08PRN+5f{+#~rdp3*X0}`OZ#U$JXz1jF at u76SQT3~nwX;wD$
zzylB9vBw_!i!H(d at PMQ--3`{(kR(lr)exo>h%u|Y?EBqMq&6j=q>SVN6ako=^TPkU
zy7y)RB7gFpyY9Z^^SAs?P*n~<AfB&(6UJ-=nXUEAA2SlMd(vI4?}dK;YM*%IWCF{(
zhWO^b=R+&HUhx2!0BqZ~`9lvqg!}Hh52k6(8VK>dI;yA;T?xgiNJ7xK1`vm*zF7O~
zhRw;x2_XdlhL@#EM?W|!jE;_oy_@>}^@?p<e=Vx2<DIJIxksgny9D4>sbm>{H?RMG
zc24RA=iUBrV9lzWG%qzaHa2E?bF7zNewpvsv4cB~LpbL%W-m5F at vHEv3YFj-yc}Ta
zc!&mFp(s+ZQ_Re{v+fB($b>hq=nX at aWOl{1YoA%Wq0iJp!OB{dtYbNj<D58g;=^i9
zh(iIFG6r!@vR{~6ixLMi2M=O@;lhRR>X7W+!|}$9m7e){PleP`-w*)Mf|)Ns#VJNa
z2NtJQYeWCdLi7XgWDO5Q8Gzl?+)SF9n=Rj3=lN7VpLf3Zz3;iZcI~Phni^51l&b0V
zRY9#PCUP07W}P}an2AS1lX=4)G0LS$&kByus(%KC`O<KOPl-No0KoHq#e!MV3h$RC
z!*a?lQ##~70(8<_yzGJT-++3b{b|!37#QHYcI~QI$w^klg3YznpQh#F`lQBsNqI`)
z<vgnDb;D%J$($qp*V%OTm&23AeWgM^=k3#-DHSsx2-zcdOjZ;Lgb4(0xm+q100=|I
z$i7^|#8La8+2z>Im?*J-vbToiGdcIMT0aOrH8q8&o_fkp-O<|CHgUtoje7!$@{4DF
z_}$K>3l?tZ6tWwg$su(TM#qFv>KF<I`i>RjPaZmx{=s;9YyjZQcVO7EWecLw=y~%q
z01{&?P?bn at P(886bcCqP+#$)zy>#m2$^F-F*?7i2Zaz76Wa^uLQ|Wxnv?7iqO7LwO
z)2R2KTq7eRxc~n90RX8~3b)>REBSO^pRuH;=L`Upnf%8kJzX!0!$)3E9(?JmZu)Q{
z;|e&H$=3EyX8*A+TwlNUnD&+7!Lw%^+hzc;efxGi{`lkPgIw`gs;udu1 at XB(|1 at d@
zR at zh|3~+0M&H*QXedP87Z at qaSGm%Zbedqf>stU!``ma at QS<umundZA6S$U5gJBE4l
z=Aovh2G2eB99FJeNv0(h05C>#c?=);&5k+y9{!GOj_Ol_h~e=uyq|XPyVAVxKKkOD
zcW>Q%eg29oF2`-R-Nq at U1OOMjxR3yV%GxD%yz7hQU<;9d>$_ovTF8VGs;f&z`HkzY
ze0xq))8x1^dOUq>e05fwI9J_J^+6yI;J$$V$V*Wa^!D~*=gys2v0?>g$c_X6)nv)J
z at s2MY?Ck1ouFf6l(N%&-P)4<shbFoU(^BgFyYBhgq3buSr-YF6Wx`)aTn7Rr;YI`-
zR)NMEL2L_ug^4lb?GF~ZREhvFm#yu6Z*O7Wy}8M(Z5cM14F~`T1OnK&apUwh!5>#-
z+qP}a@#Dwo8*jYf>}jfdGFlzq&}xjtm at 1<>8bmJ{3#?z%{+Xbr?gKFBg at gkya4L&(
zLIp<%)q=#DK>}g$(iEr~LreXFvZ5#i010RsF5hy0**mV~5=B#-*|edhQVHGN-5=NY
zZ~*A<@2_wx`jcm07+Ah-Wq-9YxI8M`0F#i=T=cl<OQWLE4&a<;O%A|e{^p+oHf0hV
zra~YTa5)G#>T0ToB~daflN42Pp`NeOAInV3<uaO^n=vvnf?4!FtkTy{<qJ46Qasm_
za1oAwcs?jeNU2lRL7|xNky;mk%Y0SWrW8d=0E=@l;<LYHfPgzb25S3Lu4P$#a&nT)
z1g5jI6JujzAIInXEW6T?QqDm~vIQ%nJFp!Wk|=<KLKjLzAy&}O%qw-|yow=GOaz#d
zEjV^W0tX?0V{w>Pd2XpxAYn}^pEz-XI*#LirwVxHnP+g{efP~uwwVzG0iyzC-~_JY
zcr?is>~g8LXu5D*0&orx23Y_YaTT9PK`X(|E2&due4sw)>>si0zp^YBj1mw5c=t at H
z^Jl-^+t^m4pT6SCtEQ(+f57sK073;O&_q+LQzD8wcyj2FZQBmv;EdZbxDGg>;DmsG
za~A at 4Kt1Z@Q(Mk+A;&9PCvonrN9P2K`N@(C5CTaOaAL%c{O)je=jOlOs(Sz=pGGD4
z7rY3oP;j`xK%^y_(jRPSX<Q1xa0#*o(_WJqfoM)bu<{^<Q8-GK>#9{nU)ny;v3MvH
z!uIXkc~8$0x4AZaq9$1#Jv13yQ7ChNNX&s_m>3)$o40ml+i+=o;1A=Oi3%w^pF&$(
zTd{fbX7u*<VsvyAxm<2GKqvslUCx4mNKS7gI}**2UVD=LqF5*mefgfRo`#iQ(x8<S
zB6FD|>qcquZNHS-uYG|rY0}pcSb|rq$lkqsd0*eB>8Gw)Yq8?cL79}Qk4;E_UHJ(E
z5FHc?CL76SFYRoM7%1iXGZPcJ4;Lctn(O-b!{7N9cJACs)~#EIS6_V<M~@!8kR|?v
ztXj5h%<Z1jMCY8{v~cd~vyIhr-}w61 at 1HWFE$_I|mSLJ``+zUn`YXA6>(jETouMBd
zV1=wYZ1?Wn2!%r2=d;q<D_0JGH8q^RcW$bD_NDjbTlO9<*27jXT#Cegp9wtBnCiZ~
z${^26jDKJ{e7JAZ4d<3GUtY;*#4rp#Lo7_M9mJn at ZPOH7Lz)!zk`=1X-LklK?N0$@
zx_U0@&*$3DF_<z7gl)#e3KcSa*%R#c+i#zK0}v+5^XIjWG&h#M)!meT-TU?;ZOz-q
z!<WB%D$p at 9C@4qMWP_H(wKB5r#EJDIZkC?#79;>%S(g1x+H at e!w3I6X5CuUH3;BFB
zY%;>@hdUW}mjd_|08tNxDw;6yxs&N at wm6&Nq+9?lp_Bzwt#s7_<@Z-DtT}KpU3_97
zzaYlg<@$*;=a|a#HZ at Cs*@!Hhy=>_s699Ja-t9j1)KmP>p+o*8;Fp~2X)Q#hb&!>S
z7BZY%7k8<^)B+6ztnQ)V;osCIlg>1;+yCB~sb}~15*70ikqH2hZcB!SK6lwFjE;`L
zvK at R#IteHtL=Y(DoC|}4gS1d6`1>4ozSR{3TZ_e%LONaWzN=_|$vOZx7!6)xN|POm
zst{2HXIi;#Fnvy`O(x6J)OtRxb>K6J4<B~+oI8%=ICtH37k~Qcrz_g8Ha0dUHFYhi
zL$oSnWhchZzPJDE3_ZW#YnurGmoY}?b$4H#E);}9I{k#V`HHeHR>c!>8nHf0gH}|J
z#vmvZkQ|YUg6IW*v^x#Rg;f;Ww)uk(K8Snoy_Y(UBXQ1U0IH%Wk-9}an+-Lz!L)fw
z2}e)0^)7!lee(DV+01ys>#GG{eE|V+1(A`ed2OG{F!65_k;vD_{_h!!N(hyMkzi7*
zQ*O6H6U%B-LFfq)jJXJ_aXTJK_+#zkA1n0t_y5TsUVQO?McjS&-G0eb6a*^OwzjQL
zhvWAYw5Y;jaZC_eBNuZ^>%vtl+3~|qPYj;x2j>9i4hUg{Ql<q%dbmEdE=|biLwc}3
zTsD3VAV8_0Fp<S0Rgp!3diAD)G<sRAK at zIw1)zjE1R^7<HV at XulkN-|Z)PBEZEY9&
zjjP2HvJtF*y2hw&Qlj&FK<nnfrWE<HQFi9kk&RVqaCKGn;C|$De-y0p5ClQvirQfi
zbe(aWg;Jv0T-DY6$g|)4Mkb(XDLo!ut=1?v<;lddjFJh(np7lvLI^ji;LJimZYss~
z)+3Awm}ZTO(tgitQB+oJ8i|UmtsBzfOTmLtxTXPrHCl~wD2fq18mEECHF9S78kF-T
zZd-y0NUp?yNElnMyYBhVc69#u*>8SB>b$gT&B at ZSe;E)4tMzID(Z(QZ+BHO)6i6C@
zWtY$ryJ~+!Bz0_>oOIDotj<gM*|VodYrB^GHeZ`sRSL%;3k0w&5K)F0Pk>7dc2yju
zv0)&8KcT`b0+a)K2pd-{+4qfg*WF)858D7@<v?kD2I*>jzJz$2j!2z?U|51A3n<%J
zG^ib=#qqx9W15oj?cx6g1OS}%>(@JrySt6X_KqL^$`RUMbNQBWmlHS+;8 at _C!;w{>
zss_-*fL#R21%!hN-`=(8m0imh{aZp7hXgBsDtzH at z99Vg;7`I>1O%4{pw>!|B?bzL
zqMb#8#jv{W&Y!e|T3?$%kmIxAJTqRKHf<u0KKdw+Mxz1%=lH;2)AJeY`ZrB+^IN&n
zlJR_ADwm4j<q}XXfx<yl6^vE2u_N2sn}2p~WAYaY!5MEune^DW+ImCBBf0CwwnP?x
zD at bZVXby+q7-(QA+}LpMPd`<6!^1&Q90X7TkoN>Y^Fq47M_OdVh7EY+kw<tm8m*+i
zz}$wq^c{)vV>h|<&7)IB`@soq;n7^7W_YTgCnce at I3CV)MgvD%BKq;9BAxVV04nq%
zpUdZZ>Xtt<7&^T?Bb;h-;X*<Hiz1(Y7+hbo?fFk6uKiDy(LwL`WgnlqptwO^fBp3t
zzi4Y~Lp&ZQ)3jm92VN|jR&=yv>XViwheXj$1p{S)lDv0w;#s2P0kSO9vi7}mAoA$`
zr|&p7zyDTS&x9_~R-f3A{M>WPA`4y-DJHx*#c5J3zo2V*h3rDEH~l{!&Wi+N;GBYh
z0)+ZHMnAFh`?&ysWpdf5BiTup*a21098C!31acm5*#kf8_?QilKWj^;DIU{XPCgBY
uGwmU!;QL1cf0xO9z>VqR#%wnDzXJe=Ubi?BbN!$I0000<MNUMnLSTZKN+Emz

delta 7231
zcmV-F9Khp_I+sl$iBL{Q4GJ0x0000DNk~Le0002&0000m2nGNE01_{jK(Qfn3X`M?
zD}NipNkl<Zc-riJdzci}nfLG1wY&P>Gd=e!12fD8hG8xk?pM)h1OY`!48{#a#nt5T
z%SPi0#>aSzNpvL<*UwL*(QJHJU9xW6XarVd6-GocT;x8?Fc;>2>05PIo$rr6)l<_9
z3h1-qQt$Jer at O1_)TypIzxuuBec$sQLVqa*01!fOmO=n<00dTK01^NZ01toyhyzdo
zMA>H?fX?c3ruw|87#Bd<u{x`#nSN`gW6ny9|7VFM{~JU&$K%all^9s<0Br0x&p at TJ
zV-3)8Ca?;o`Xc*ofS9tPu at YnTjZc_>Zz0hV3$W(^RvQ2XfWmQ{lAn`b=H<Ls#ee%y
zrBlj_KA|xtM;_mQXx{-=muGct4Cn?k3p~dO0^xX`5Dp-^20a?nw1`e=jDg<(v}y+J
zjJb2^w#}QZr)Y@<*ipc0W=NTV)d|2}kWnzfPt$KCJ$$uIl{_3|kbW-9IZik^kkkLb
z$<~uFfmLBe1|Uh2Bo}36SJ+fN+kXa<2|x?;v?(HRCt5l>_J$*opovj6lgey~B^F>m
zL--VSwF9t~7njddx}CQP15%z3=?EYPHn=gQM!e{V-7>vA?XQ1qees=Cz-9yjnT3jb
zv3)Q+Q|cVdlr&vdKxB~+XoL%^JRce344fLwv%lWd)AQoVp00M2YHf)n7Jp#RQXQ5V
z at N5+&6|>!^JpV@?RMNAMi+mKphb#!hju4Hbr>(~$R)(qoY&Gih94}Ul9XHS0*?+6j
z(vk1ch>#8eX^`Lp2L&7`;2MJF>I;SfT?3)gERXZ*j at qJi+jo7iiLonX#w0=rvBt8N
zSb$9dt1$)@8N*5i`GqCket-Y>orCW5VxbrXdI`LGItXN_pirU0&84AmOtGQDQkyJu
zlM0Hz<2v4cr&o;&g|MR(GKz?V07N)IAcF%1MFbRs(9omC#ABU(r3ZBKo3#0t^=x|U
zjlZ&M0RWv+3JbKBSb#kpw1!G7NU|(vNm*CBPkP6X6-zOmD~Cr<hkp(r0u7YL5Jniq
zmt>!;np3!+{)Q4lh*mqcY`Np$@qfsUQBn;DY9OH)B7BsC9TXe{5F#+E5>1?s*iZ@^
z#&&o5KY;C~=YRY3$2Z>kgFy_tcr@!VT4Diqq!?CO9spmMQ!v)m>zP+T3s5OnA}f{)
zjSvhW1QjYYfuOi9uYYasy*0lbGe7$y0Q|Quy|f~_eb<lkVli?FJh&vUAY9<j=yve-
zI7i|<1_pfOaH|t^0Du!b;lYDK1c3q at e2`!xwuz^L(HsEBkgynA#wSZGz at 9-R=GZ6v
zlD{%Nl%6%tUWR;92njNJwLxfzq4<it6FKt(+jC}SypcKCzkeM7?H?Er$dTr|0>L4F
zUBUS784DJ^TUc53K0mAGm`+4BuEzzvabE!rH8t>!A5Isx?a1M&3`%4G1RPX2prWXH
z(&79o7KYh%YZ&&;T4IR>*ik?Wm*NtfnrnPcJQsz|B6z49p?DM^6qDChyj}F|!rytv
zIsXPA#8^<f?|;WXY2cgNuPCdm-7{^~O^=Pg<L|b!u`q$*uBolu1z=<6>sxB2%JRQg
zHoP!fq(cA%=;((wd3KL$#iCc;6=fj|yO}Jp!~*OYgaV*0$!&AQ9T^#1Cj3Gg#IPNj
z7RKbqEB{oqI`?tGF7yG2u%ZIckG}uGx3kBUd^+#`yMKN(amlw1vvy+`8P%i#&;wV_
zdG|zq#;4&)<G%0u%RAHf)-DHTH#F15m%r++8Nb<d-q at EpekFwDAmLY50rUb0V%YD?
z18 at LHL&7Z;H60_ddOUz3R^qrYBC)an%mgq7z)1ifvf)JdbFPnP|H;LU8#3+(wPHOl
zXuy&bHh<F`vLZNSSGpf*P&frzFow+Urhi;;W6pZPF7&VtA7Y(CeSOm=S#~+YHM8g3
zGj++g_OZ^Oo4}eHFN}if$`i4Q(w}v at lmc5zk8E4EpkEo2+l}EE<ro0X6#s0FLq1=b
zeuj=s0Js561W?O5@=<ooDF8)m9|zz7E4`G`uYcSaMhI~LD4>)+1OSbVjmzun>-VM{
zGg?(AfNB60>{;#ua0tL4tdP*JRJhL=ubKn%jpKBHgdKvT*Uh=WheU7z0VQ`8{Ilc{
zTN(2hU=0IMT at Gh-&XPsH{J{fj-(f(DvVB2TLZ*`3E{ft{&Wfw{`Tya at -O8BUBLI2`
zA%8=J5S<Vr5<-mlWx;fPUqn?dpp-sDDSct*&YhL)dMFYBB4YteeeAKvE~AwGj8gg{
zrSvKQT>#SVyYIfsB9X`wAAR)EwE%(_0$5EFHonx?*AK9J_IUv)3V@>LpMU<^NF?&q
zwr$&{vFBnL`7R)aO$9556zebm64pWkqJJW`h(rPn>hLe}d at Sb*A2a4t&0qzf&ze6^
zn>Bx)is6X?hF><R3eTB3g>HRsCkKG at y4{jP5(IZ<wk=bUJzj~*n(WjM9y!wQut{1l
zq9TQzjmZJ*g_0Z>f1!>|DU}EzDu8?d^@|rTuDI>C+orKYUI6e6rBo(_oVfMYTYtyM
zvaD2BSN}bw^lo-vF9d^_&R&q_=gptRwM79mtz5Zs4ggG_K7A3T^cmBAx8wp*iH&F`
z5yR8vI1_W}EnO`GdQJR*iWoFX;cQU$P>OE$kd306z)3MO{?|Nxjxv=j`EsZjS5ha&
zqpL_XI92TH$yPZk5P=I7y14FaZ-4%wA!_?`YwO8(TD$r>P2e<C?DGXHM(Nlb8?#Q%
z&(E)T?z!hKmt|Q2um`~1rvG&?5D5Gfz)u1E2NIEBv9Ec*7y!@+;2r=A0X)L`gK9zM
z!U3$oq#}lA)EFJtV8kc at J*b4<3#A1^dP`i<IK9R0u??A+E at om+m_S5Q0Dp|x^^@so
zpwr?lHn;Cz{r1fFecIqRmH5y!G1}*g6U`UW!efIPcX>{+e_uyI!Q%&x9DAd`f6!>l
zJU#Er5Dh>LfQhfY_Szh;*P8~Q3BYxxae9ok`xbzAP0Si6gg62C*!_&K^C`@DMHwgz
z1D(vq$zJw7%J%iM{kqxMLw^Y2*l`|K6!z>?HqJB*Vq_G<VT=%x&#p~PZO8PicmNLr
zSkHc2e(wtqutspd9e~}N7RZ3)Oan+<&?9YK9jz?@^pFtT6{;S3BhnIHss<xSQBU<0
z(3}RMxzndnJsJi^8ayZf>Qt2D|M||lO{`;Xc=Zqe?~05=+t!LrJAdkjbf8C7(cIlv
zaV#AEXaB@;|Frj5+b>SEwDsc4b at fm}hzCIZv(G*|wYIjlf_3bh*|;?XKqZN=tRg~4
zEd%0yRx|*40O}c_y4nBB1(43}Qxh{#^#RBLFpkx+Gq4>6u$O%f5JHR>pvahiEP!%W
zM`8Pd?7VxJktkK-gny7~01Mc446*a?GumO-?gucH5RwhxFgxEMdvRE(xj>9gBPOO7
zj~!Rz$|=2{^W^=Oc=9$VStXCu)K9qtK<r;PZXD33sJ{!Q2O~Yr{iSU!?Pkj_1wdy{
zolWO9e1p!L+(74jV>+ETV<w$9JyFaTFspttH43E^f7$+ia(~QBDdn%e?t6dM7JUEO
zz>KAvYcdID7CW(UVh*k>;V|FZa{ILElAq?~=Sg2OyT$?3-E+ at 9Q*OHHrkQNpPXO#@
zW8EkrL}&Laux8DgZ&FJCFQs%lhBIvVZ@>Na*_6^Jj~qF&4nXEhFTJ#&r>AE%rSu<L
zTU*zzUcGugfPWbPW~^PicEQ1e2d|@)-bpE4yJydyJMO&m&KV5MGJ7Ej4D_=AT(N4^
zss)XWjmsjD$Sp>_uCA_|+uPe0QA+z$RoFdy_Bem|!ynH1=%bH}cGi9J$tOlT0aH6p
z040>t-%v{bvUBIonHIZVm<*c)OWdCI!{&&43bA`Z1%EqwqiU|MgvKnqGW!sKV|Uzp
z$F`TcUfIz036^*7?kvjA%lg|0z}R_E*g=NEXN9A!J9n9lUYyx7J at b;O%`dmL-aIw)
z#J^?sHdZ)&G6F6?vfMrJb~fECPp>=h{2y9=!x$jxiaOs(0eklBajsmsvf<u)?_Iz)
zJpf=61AlA8#C8Cn+3ohhBsEhSXKib;EQbNW>-F~c_V(6!z21cYHUlWm&dx4=`st_F
z`ThPUmMvRWU0Yi_o4pXW0GKmj!i1Vf9(kmsuCDIL_19nD%>GjvfZF{0{OKDvZk*rH
z&``#jJ<gaFX=!P*7-Kq^CXkeg6DN-Q^{;>Z5PuRbt1SQ~RaI3 at e&mry#x^uG9A3VB
zd5h^`oo0l?$W%X;e8mhq!sj|jyp!dOQh3T{z*DgRQu#czIckf;-f`b!EX-FfANNo3
z8g+BmzRsHcf7>sZALiD#-zMrn9J)@<M_Hw*<=acHIr1)7wxL^BLPU$fEfExFyD=>*
zOn;{P+Hbyb)!!9TN=LY%7<kWFy1TmzAAR)EYnhR0Gl0i1>~_*pu2Yj`IWmgDN|Pih
z3IKk;zrpMEUdaqN*8`YADSaCNe*W{HFJfSQ0KgRht_4sD;3&`Y?rW~O=DU>AAp2j1
z0LH)i>Z@}ZSo_%drn9m2awLK!)?;+n&3{7xehy$7Yo`jpE}rMzOP4NPiG)k)v#iUO
zTtI*wX>hUmM0 at Te2s!m2fpQ2LWe{^FK=+je*aIY!rq&GQEXZ8vaN6E+*c|Z`YcSOQ
zFoFXy#I at 7mNK;sMc0;W>pHtFZGjrDT7)h9t#aFgAzW%A6(Hx1!K`DjAamYz`qJQ4i
zTw0YSt}t~h4qsrh`<yv*R%B#k6tSN*0Mbo9;PXB00{{&7SL?=&8(#qcj^m1ua1*V^
zuv={3wr$&<1OT4rmzw at p(Ji;!QeIbASI)qC9TIbmLu`y`l)Vga_LOUQF{Pc>EnBv{
zY_vlu6<~#Zer;4 at m;j at 3HW%Q|0e`3XK;kjbSPY`#qm>ozFovU*^h+*l=td&q=QM*8
zC4i>speafe;W_YjCun#mfh*QU<}}pOt&JZhT}UP)ivU3Q_t#z<n3=WsK)yoD^6WZz
zo<fvl<SYGrmC`>4z!Nx+%!;E(Ed$X605#EQ^jQEan2{!g^YgL3#y}D#gnwiK=rS2_
zUV|x|lMs?!Q&ZFN;fEg@`xgLs6M%d5>eW?j+a at HUts?Ba at f2;zxOZlG)pWedj7mpL
z*RcS=UoExw>%p+*RHCZDbI>>$gdfJVz;kM5MrJEUW;Zn0&~UF%0JOfWJ~5a~Wh4SX
zkf3rRP7ob!LJ!*bKD6<DFn at v7Jpb142}=NkBb`I7?L(R#(~~|9*kl3uQdcpCGcu<7
zkI#7+3*asQw*i1G%d=WqTGk-p?h?+Ey*n|S{n2pAnD4!@j{=Z(@7`?&8^_!_dU<*I
zShj5oW6{VcFA(GTr2c>1WE7+9p88Vy1COu2ANisHtQmkYk;j0RVt>Ndsg8IggcP8f
z0h^2mPDb;CB2H;?hbo8wVabaLpb<S;MlpVgCgAb__|E=NtUDCfBe7vOFX0Hh{7{C8
zjrlLA+TG7O?atob-X{SdCnx9D4I4I;AmKteAJs86z=KZ#lG)15rLd!6jEk^wHIQ%>
z#m<opM{8%aXg7;tzkfyy8v_t?iuw^v8)*~_M|FuK(P9jTA;vI@|24OKGVS0rbZ{C@
zi4?~ML+GUhy at VT~r<$!?hu=F+FftttZvv~qmQ;_1GlNl0i0gpyJ|RSejgKeOrkX&1
zzMzdU=AsWh^w5)<rZo{lyen6(e3${&b{;Q<b9FnBQJz(=>3_G|xbNf(46H5r`ZKHs
zAeP~XHww_8s(Rw}P6$+8Cyj^utKZ(TMMA<C8D)kTjuj9>(0X7uNurMqqmYc!hbeUE
z!-L#pEVHDDa at N>DK_ENe!*CRnCg`yoN_7|pV9MS#;;^6ci?S<BLj(Nc7r!{MckkXi
z0l;Rn&1`9Dxqro^8k7IwXVu=>*}04To=6Dc*(3;_42$tBED&D=3~OZDSJSwG=SrMI
zCxelMb)O>u#}PCh36KA;Pnwpo4k2M=2LI&v?&N{p<nsteqdWxSf?M>YG7BdNqUiDY
zzLi;+cE2ypZ!^Z$oXv4qA{0EKARI|VOU1*WcK?7$&42vTIxD4At*);AOLuqodP6mS
z=9y>4uyH8=KL}a^;6z(n+je$cKX~e?r>;U`YTra8TtO3&h<?gqFBJ>47YoDw+be(A
zF*mp8Nhb+oNYz0IAn-hTf>7Q%5V>vD&1(v9dit0%lj&)_k3y#+qM8?WE<LqllF&d%
zQ#jYB at PCF@R5X;WX6j!=%o?+vWR7d$)P8W0ZU}?z&_SS<E`1v#=f!>*kxxeb(1Q;?
zm{g5#xZ#F}zXFyel+y0s|Ni&ubzMJB2=T63wd$Gs?z?X>fJ>3^t1bmFW6hd1Q`ogx
zW6}TRfKAwz5<<$dm8X}E>wlS#hcOTVc%Fc_Nq=ZOjtTq2zTYlcwk$Jc44a&VlRLhK
zo=xLnEr!0>&}h3zM at PrL^z5`9LdmH+uDWhn9f0VIFTT8AnDU)F2C8rT&v5bOht;yH
z4u at wx_y?hC#RiPDbe}6=J5Aq{KqQ1vN-6!-uYT3i)YNo8kgyt4N at ue%Wsl$Q?-`|T
z at P7>3frNFp^9=hwYd`nsqmLfuIPO{i$9SH1uUoh7u3#{Dds9=>lIG^-#gx*g)~{cG
z8KpFgL{R_vv=jN9dX{`eBAl)PCPVx9)i+!pDcZ8-p8PBldHkK&O+DRF5J3QS`tjc<
zyDl3qyZ?CUm5UyJ^Yu-CGER^?zJ|8!|9>#avU%l`M}TJg*3G9q`1aGSp&S4{G!)bw
zw(=vvjDweCW=P+?<0p6T06>;}`}^BZ9NK#%8g9#w?RL(YKdD`^If59OI_6yGZSFLE
z7gJtlU;uayiD;xH05(uc{~N&3W5<qtVmee}Kxn at D>Z?cF4hHnkYHzgt=H*g8Mt>p(
zc@==gilS5(6cl755lrzX0G|S|Q%d^@A?Ml-$IkPa_rsE}Mo8*%lMJxtB_V~~2abA=
z_iKw^{vdkmrpC7MvB4oA)&uk%ghxHz?}~M8cL=d<vOo?gitF9?-g>>u%y8LdlW6<F
zkI5*;VYB*bSci?NeKxnx<E*=4(to|A>cbUf{`xN0shNu&zGvND3@@a`o6Zr(@LXK;
z5|?MovOI>@{n3z^`C<h58~4SyK0CWVM)nM9vL34#&g&$kZYPAOrh7bUd!MzRwPl{D
zk(zbGxEEo at lsM0J$Qia<YW4-hu&E%@0nnQ9V}@#gKf2`R&9}@=pY{5l-hWFQ4|i2{
zcDh_WZ5~nWZTf}~>nwK5bW3?r&Tarb=K2h*T*`PCINdjCUW!r at M8O#f4Q4o05!Bt8
z?h(bwNCdW1!#KvyV=!vm#IQP3XU}E48Z`kuZh+OK8XGaT8oS=O>3i6;&m5+ix;?38
zpQ*ji+mGR7Xoiu{yj-U_n}3Iqf#aOoF}>tYt7lEGyYK;PbVxdXQhpnNe<{y$z0y*j
zA$XmW?1xTt5Jl2dPKyswO^c1o%`lw#M%=C0ugaycV)EQ<pLwAzS#i2D!&*<ZixVM8
zQMjFY<=+nMwN;I;G^@Q@%J^Bw`K2+ at kun`^l+J1PRi{e)4BO&oIDhBowRblAb$ou9
zBt6%5&a$2*7Xo0}Th|=zk~*bI%l0|69KUlkwlo`!1dLon%e>M$1rYb-=X?5_n~llm
zA_J;}eG0BL$NUK25^y-uz{wPnGoIcxaLNu;su-EiiKeQ*)_OaZTr>=u0$SZP#x>H%
zNC1TLZ_Lb%xxF4K9)IiK_x2mdQ$TA@=w=RR&;e)@>*_A=rnIELx%pQZUKP*5#!Pbl
znBuaq-2EMwhlAo(z{@JAs0pGh3NR-iXBJ@#pq5<BDzTZN43$=5pt36tr#rp0d|AKF
zEs72f6^I;Zt(-dZ&)p}Ez0}^)+=tOa3=Ocxaw at B)wdnL`d4C?y3nxb|5Ul{P2XZq@
z`1IJ1<BtCHw7dWuehvap;IjGS0dEFUnB8JiODw>qFlBNvXHgU#xus>-wAwxQ1#M1_
zcYC4nLPlpKIH}O?no{Ub|6S9b-S1;$x>N!{^Z3)mKw;50PwDy^&2AS9(=z_JCvl7n
zz|L`;qiFn?Ie#%{_&Y&+XL(kU3*KT0l8b^PBHU7bdtPQi9A_DvVTmOdBVb2}D<jJj
zR=kVDY1y22Y&p2>Lg=E1;6Oi)o;W-&%i*4w?{M#k^!0uq#-hh*EIPp1?3u)7FO3pR
zJ`s;kQ|)%)(z+?@|NV(yHUV(k>~<w*Y{8<K6kgEBpMR>Qj<7SW$caFu1I}z2;5A4>
zI($mWr;5#%ntRw{S4%9wrifwGi9vCRn%kQul}>;>X$q(>192 at 5dpHE*Pe=O^Uw{b8
zm5Qxn0UsLdA(|S|G~F2?G!Pef!0E)es>;K6UbFm{Z$9x$t$fl%x9W)gv{h|htlJ|F
zyH9|>(0_?QsRQm}8IprXOdmj=r(u7tyXaGlOqXi;1TC=udj_z^0l>zi)0dWhv^Rfj
zA(xd0U64Q`i6v-+^ejLWp?Z7>wl~Y at JC%*_5TL~Xn*=BhWEbWPZMbIn-E$|5?*yQE
z at _h?;ckj4f&4_URB0IbVc6f7baHWfo6agAkIDdFID$*CdmFM%E#7K9O#jciEfIS0f
z;{de&mJ=tY%vYX^d6XG#L=t3bLJiLY4i~tbJm?-T5E%rbAs`+Gc#6{O+`%U<pZl}9
z1v&4r at vYt$>KYsMM>uD-4USS9903V-y8wab0ir?E!>9_Z{Gi;^u!-lmQRm-UVu=OV
zk$;k0W at Bh@kn8B|eC7FVyM#9-{U1NkxcmsHsOuW2t|g)vI02AsfGmQiF1UEAE*w+1
z at 80^F^_5<En_)0oxMYcbeCS{td4O2PL(CPxi-{ahal{ePBbem7>iC?T at 2&USqz(-G
zU6UCuEDNzE7n7V8OMFI(HBAZt%dxciXn#xY0Zm@{X0Lkb(ZOI&PbegZLqU<K5o*`9
zxK|M)<v#nd>r2OMy&^BLN#e*LhF7Q?0uY+Mc)|6bRPA~pRMX4l2E1?)9*R!j;_R5^
zU37Rw(b`8#T!9^?dLblYWMgLoSSvcml8YIzM$D>_6ioskg<^60q25r{(NHvZUw_|F
zx((1P{O<m`bWdAA5e{KEoX<!amIU38?!L!!H2wI4`$`*E at cy9FOY9gUj_p{Ob;FJY
z>6bm1V^2G3s$*UmPn$Yt9(`}?W>|o=!~*P at 8P=R2Em`84E(X<@6pCviN5DBmkt&j)
zbBQeZhAOLKcm?(3>gEqT`^2P<{C~C|HTyp;%a;AIS!q}AnCYMUA2~Lq8N+Eg!zN~p
z1E3aQEwKRm*?<L34>>fK)Fj at ct>bEZH%}9jk%%8Q!XAwk^HdWn8(=-Bv8x4GOD;yE
zQ!@O|w3I_CAkAPkCj-|_$BgEVN#;UkzhkVvW at 2U4GBjCY3Gn|10FA-W9uVxF!F2!t
N002ovPDHLkV1m24&0PQh

diff --git a/ui/js/src/wok.grid.js b/ui/js/src/wok.grid.js
index 84f8d33..6fbe22f 100644
--- a/ui/js/src/wok.grid.js
+++ b/ui/js/src/wok.grid.js
@@ -1,5 +1,5 @@
 /*
- * Project Kimchi
+ * Project wok
  *
  * Copyright IBM, Corp. 2013-2015
  *
@@ -23,85 +23,50 @@ wok.widget.Grid = function(opts) {
 
 wok.widget.Grid.prototype = (function() {
     var htmlStr = [
-        '<div id="{id}" class="grid">',
-            '<div class="grid-content">',
-                '<div class="grid-header">',
-                    '<div class="grid-frozen-header-view">',
-                        '<table class="grid-frozen-header-container">',
-                        '</table>',
-                    '</div>',
-                    '<div class="grid-header-view">',
-                        '<div class="grid-header-wrapper">',
-                            '<table class="grid-header-container">',
-                            '</table>',
-                        '</div>',
-                    '</div>',
-                '</div>',
-                '<div class="grid-body">',
-                    '<div class="grid-frozen-body-view">',
-                        '<div class="grid-frozen-body-wrapper">',
-                            '<table class="grid-frozen-body-container">',
-                            '</table>',
-                        '</div>',
-                    '</div>',
-                    '<div class="grid-body-view">',
-                        '<div class="grid-body-wrapper">',
-                            '<table class="grid-body-container">',
-                            '</table>',
-                        '</div>',
-                    '</div>',
+        '<div id="{id}" class="grid wok-grid">',
+            '<div class="wok-grid-message hidden">',
+                '<div class="alert alert-danger fade in" role="alert">',
+                    '<p><strong>{message}</strong> ',
+                    '<span class="detailed-text"></span></p>',
+                    '<p><button class="btn btn-primary btn-xs retry-button">',
+                        '{buttonLabel}',
+                    '</button></p>',
                 '</div>',
-                '<div class="grid-resizer-leftmost hidden"></div>',
-                '<div class="grid-resizer hidden"></div>',
             '</div>',
-            '<div class="grid-footer"></div>',
-            '<div class="grid-mask hidden">',
-                '<div class="grid-loading">',
-                    '<div class="grid-loading-icon"></div>',
-                    '<div class="grid-loading-text">',
-                        '{loading}',
-                    '</div>',
-                '</div>',
+            '<div class="grid-content wok-grid-content">',
+                    '<table class="wok-table table">',
+                        '<thead class="wok-grid-header-container"></thead>',
+                        '<tbody class="wok-grid-body-container">',
+                        '</tbody>',
+                    '</table>',
             '</div>',
-            '<div class="grid-message hidden">',
-                '<div class="grid-message-text">',
-                    '{message}',
-                    '<button class="retry-button btn-small">',
-                        '{buttonLabel}',
-                    '</button>',
-                '</div>',
-                '<div class="detailed-title">',
-                    '{detailedLabel}',
+            '<div class="wok-grid-mask hidden">',
+                '<div class="wok-grid-loader-container">',
+                    '<div class="wok-grid-loading">',
+                        '<div class="wok-grid-loading-icon"></div>',
+                        '<div class="wok-grid-loading-text">',
+                            '{loading}',
+                        '</div>',
+                    '</div>',
                 '</div>',
-                '<div class="detailed-text"></div>',
             '</div>',
         '</div>'
     ].join('');
 
-    var CONTAINER_NORMAL = 0, CONTAINER_FROZEN = 1;
-
     var setupHeaders = function(header, body, fields) {
         var colGroup = $('<colgroup></colgroup>').appendTo(header);
-        var headerHeader = $('<thead></thead>');
-        var headerRow = $('<tr></tr>').appendTo(headerHeader);
+        var headerRow = $('<tr></tr>').appendTo(header);
         $.each(fields || [], function(i, field) {
             $('<col class="' +
                 field['class'] +
             '"/>')
                 .appendTo(colGroup);
-            $('<th><div class="cell-text-wrapper">' +
+            $('<th><div class="wok-text-header">' +
                 field['label'] +
             '</div></th>').appendTo(headerRow);
         });
-        headerHeader.appendTo(header);
 
         var totalWidth = 0;
-        $('col', colGroup).each(function(index, col) {
-            var width = $(col).width();
-            totalWidth += width;
-            $(col).css('width', width + 'px');
-        });
-        $(body).append(colGroup.clone());
         return totalWidth;
     };
 
@@ -124,14 +89,11 @@ wok.widget.Grid.prototype = (function() {
 
     var fillBody = function(container, fields) {
         var data = this.data;
-        var tbody = ($('tbody', container).length && $('tbody', container))
-            || $('<tbody></tbody>').appendTo(container);
-        tbody.empty();
         $.each(data, function(i, row) {
-            var rowNode = $('<tr></tr>').appendTo(tbody);
+            var rowNode = $('<tr></tr>').appendTo(container);
             $.each(fields, function(fi, field) {
                 var value = getValue(field['name'], row);
-                $('<td><div class="cell-text-wrapper"' +
+                $('<td><div class="wok-cell-text"' +
                     (field['makeTitle'] === true
                         ? ' title="' + value + '"'
                         : ''
@@ -141,38 +103,8 @@ wok.widget.Grid.prototype = (function() {
         });
     };
 
-    var fixTableLayout = function(style) {
-        $.each([
-            this.frozenHeaderContainer,
-            this.headerContainer,
-            this.frozenBodyContainer,
-            this.bodyContainer
-        ], function(i, tableNode) {
-            $(tableNode).css('table-layout', style || 'fixed');
-        });
-    };
-
-    var initResizing = function(event) {
-        var resizer = event.data.resizer;
-        var pageX = event.pageX;
-        var tailPos = $(this).width() + $(this).offset()['left'];
-        var atResizer = Math.abs(pageX - tailPos) <= 2;
-        var isResizing = !$(resizer).hasClass('hidden');
-        $('body')[(atResizer || isResizing)
-            ? 'addClass'
-            : 'removeClass'
-        ]('resizing');
-    };
-
-    var clearResizing = function(event) {
-        $(event.data.resizer).hasClass('hidden') &&
-            $('body').removeClass('resizing');
-    };
-
     var stylingRow = function(row, className, add) {
         var index = $(row).index() + 1;
-        $('tr', this.frozenBodyContainer)
-            .removeClass(className);
         $('tr', this.bodyContainer)
             .removeClass(className);
 
@@ -180,8 +112,6 @@ wok.widget.Grid.prototype = (function() {
             return;
         }
 
-        $('tr:nth-child(' + index + ')', this.frozenBodyContainer)
-            .addClass(className);
         $('tr:nth-child(' + index + ')', this.bodyContainer)
             .addClass(className);
     };
@@ -211,20 +141,10 @@ wok.widget.Grid.prototype = (function() {
             });
         }
 
-        $('.grid-body-view', this.domNode).on('scroll', {
-            grid: this
-        }, function(event) {
-            var grid = event.data.grid;
-            $('.grid-header .grid-header-view', grid.domNode)
-                .prop('scrollLeft', this.scrollLeft);
-            $('.grid-body .grid-frozen-body-view', grid.domNode)
-                .prop('scrollTop', this.scrollTop);
-        });
     };
 
     var setData = function(data) {
         this.data = data;
-        fillBody.call(this, this.frozenBodyContainer, this['opts']['frozenFields']);
         fillBody.call(this, this.bodyContainer, this['opts']['fields']);
         setBodyListeners.call(this);
     };
@@ -235,106 +155,6 @@ wok.widget.Grid.prototype = (function() {
             : null;
     };
 
-    var startResizing = function(container, event) {
-        var grid = event.data.grid;
-        wok.widget.Grid.beingResized = grid;
-        if(!($('body').hasClass('resizing')
-                && $(grid.resizer).hasClass('hidden'))) {
-            return;
-        }
-
-        grid.columnBeingResized = container;
-        var pageX = event.pageX;
-        var gridOffsetX = grid.domNode.offset()['left'];
-        var leftmostOffsetX = $(container).offset()['left'] - gridOffsetX;
-        var left = pageX - gridOffsetX;
-        var contentHeight = $('.grid-content', grid.domNode).height();
-        $(grid.resizerLeftmost).css({
-            left: leftmostOffsetX + 'px',
-            height: contentHeight + 'px'
-        });
-        $(grid.resizer).css({
-            left: left + 'px',
-            height: contentHeight + 'px'
-        });
-        $(grid.resizerLeftmost).removeClass('hidden');
-        $(grid.resizer).removeClass('hidden');
-        event.preventDefault();
-    };
-
-    var endResizing = function(event) {
-        var grid = wok.widget.Grid.beingResized;
-        if(!$('body').hasClass('resizing')) {
-            return;
-        }
-        $(grid.resizerLeftmost).addClass('hidden');
-        $(grid.resizer).addClass('hidden');
-        $('body').removeClass('resizing');
-        var leftmostOffset = $(grid.columnBeingResized).offset()['left'];
-        var left = event.pageX;
-        if(leftmostOffset > left) {
-            return;
-        }
-        resizeColumnWidth.call(
-            grid,
-            $(grid.columnBeingResized).index(),
-            left - leftmostOffset
-        );
-        fixTableLayout.call(grid);
-        grid.columnBeingResized = null;
-        wok.widget.Grid.beingResized = null;
-    };
-
-    var resizeColumnWidth = function(index, width) {
-        var width = Math.ceil(width);
-        var widthArray = [];
-        var totalWidth = 0;
-        var header = this.headerContainer;
-        var body = this.bodyContainer;
-        if(this.containerBeingResized === CONTAINER_FROZEN) {
-            header = this.frozenHeaderContainer;
-            body = this.frozenBodyContainer;
-        }
-        $('col', header).each(function(i, colNode) {
-            var w = index === i ? width : $(colNode).width();
-            widthArray.push(w);
-            totalWidth += w;
-        });
-        $.each([header, body], function(i, container) {
-            container.css({
-                'table-layout': 'fixed',
-                width: totalWidth + 'px'
-            });
-            $('col:nth-child(' + (index + 1) + ')', container).css({
-                width: width + 'px'
-            });
-        });
-
-        if(this.containerBeingResized === CONTAINER_FROZEN) {
-            var headerView = $('.grid-header-view', this.domNode);
-            var bodyView = $('.grid-body-view', this.domNode);
-            $.each([headerView, bodyView], function(i, view) {
-                view.css({
-                    left: totalWidth + 'px'
-                });
-            });
-        }
-    };
-
-    var positionResizer = function(event) {
-        var grid = event.data.grid;
-        if($(grid.resizer).hasClass('hidden')) {
-            return;
-        }
-
-        var pageX = event.pageX;
-        var gridOffsetX = $(grid.domNode).offset()['left'];
-        var leftMost = $(grid.resizerLeftmost).position()['left'];
-        var offsetX = pageX - gridOffsetX;
-        offsetX = offsetX >= leftMost ? offsetX : leftMost;
-        $(grid.resizer).css('left', offsetX + 'px');
-    };
-
     var showMessage = function(msg) {
         $('.detailed-text', this.messageNode).text(msg);
         $(this.messageNode).removeClass('hidden');
@@ -366,11 +186,6 @@ wok.widget.Grid.prototype = (function() {
         }
     };
 
-    var destroy = function() {
-        $('body').off('mousemove.grid#' + this['opts']['id'], positionResizer);
-        $('body').off('mouseup.grid#' + this['opts']['id'], endResizing);
-    };
-
     var createDOM = function() {
         var containerID = this['opts']['container'];
         var container = $('#' + containerID);
@@ -385,118 +200,91 @@ wok.widget.Grid.prototype = (function() {
         })).appendTo(container);
         this.domNode = domNode;
 
+        var theTable = $('.wok-table', domNode);
+        var theContainer = $('.wok-grid-content', domNode);
+        var headerContainer = $('.wok-grid-header-container', domNode);
+        var bodyContainer = $('.wok-grid-body-container', domNode);
+        setupHeaders(headerContainer, bodyContainer, this['opts']['fields']);
+        this.theTable = theTable;
+        this.theContainer = theContainer;
+        this.headerContainer = headerContainer;
+        this.bodyContainer = bodyContainer;
+
         var height = domNode.height();
         var width = domNode.width();
 
         var title = this['opts']['title'];
         var titleNode = null;
         if(title) {
-            titleNode = $('<div class="grid-caption">' + title + '</div>')
-                .prependTo(domNode);
+            titleNode = $('<caption class="sr-only">' + title + '</caption>').prependTo(theTable);
         }
 
         var toolbarButtons = this['opts']['toolbarButtons'];
         var toolbarNode = null;
+        var btnHTML, dropHTML = [];
         if(toolbarButtons) {
-            toolbarNode = $('<div class="grid-toolbar"></div>');
-            if(titleNode) {
-                titleNode.after(toolbarNode);
-            }
-            else {
-                toolbarNode.prependTo(domNode);
+            toolbarNode = $('<div class="btn-group"></div>');
+            toolbarNode.prependTo(theContainer);
+            if(toolbarButtons.length > 1) {
+                dropHTML = ['<div class="dropdown menu-flat">',
+                    '<button id="wok-dropdown-button-', containerID, '" class="btn btn-primary dropdown-toggle" type="button" data-toggle="dropdown">',
+                    '<span class="edit-alt"></span>Actions<span class="caret"></span>',
+                    '</button>',
+                    '<ul class="dropdown-menu"></ul>',
+                    '</div>'
+                ].join('');
+                $(dropHTML).appendTo(toolbarNode);
+                $.each(toolbarButtons, function(i, button) {
+                    btnHTML = [
+                        '<li', button.critical === true ? ' class="critical"' : '', '><a data-toggle="modal"',
+                        button.id ? (' id="' + button.id + '"') : '',
+                        ' class="', button.disabled === true ? ' disabled' : '', '">',
+                        button.class ? ('<i class="' + button.class) + '"></i>' : '',
+                        button.label,
+                        '</a></li>'
+                    ].join('');
+                    var btnNode = $(btnHTML).appendTo(toolbarNode[0].children[0].children[1]);
+                    button.onClick && btnNode.on('click', button.onClick);
+                });
+            }else {
+                $.each(toolbarButtons, function(i, button) {
+                    btnHTML = [
+                        '<button data-dismiss="modal" ',
+                            button['id'] ? (' id="' + button['id'] + '"') : '',
+                            ' class="btn btn-primary',
+                                button['class'] ? (' ' + button['class']) : '',
+                                '"',
+                                button['disabled'] === true ? ' disabled' : '',
+                                '>',
+                                button['label'],
+                        '</button>'
+                    ].join('');
+                    var btnNode = $(btnHTML).appendTo(toolbarNode);
+                    button['onClick'] &&
+                        btnNode.on('click', button['onClick']);
+                });      
             }
 
-            $.each(toolbarButtons, function(i, button) {
-                var btnHTML = [
-                    '<button',
-                        button['id'] ? (' id="' + button['id'] + '"') : '',
-                        ' class="grid-toolbar-button',
-                            button['class'] ? (' ' + button['class']) : '',
-                            '"',
-                            button['disabled'] === true ? ' disabled' : '',
-                            '>',
-                            button['label'],
-                    '</button>'
-                ].join('');
-                var btnNode = $(btnHTML).appendTo(toolbarNode);
-                button['onClick'] &&
-                    btnNode.on('click', button['onClick']);
-            });
         }
 
-        var frozenHeaderContainer = $('.grid-frozen-header-container', domNode);
-        var frozenBodyContainer = $('.grid-frozen-body-container', domNode);
-        var frozenWidth = setupHeaders(
-                frozenHeaderContainer,
-                frozenBodyContainer,
-                this['opts']['frozenFields']
-        );
-        this.frozenHeaderContainer = frozenHeaderContainer;
-        this.frozenBodyContainer = frozenBodyContainer;
-
-        var headerContainer = $('.grid-header-container', domNode);
-        var bodyContainer = $('.grid-body-container', domNode);
-        setupHeaders(headerContainer, bodyContainer, this['opts']['fields']);
-        this.headerContainer = headerContainer;
-        this.bodyContainer = bodyContainer;
-
-        fixTableLayout.call(this, 'auto');
+        // var domHeight = domNode && $(domNode).height() || 0;
+        // var toolbarHeight = toolbarNode && $(toolbarNode).height() || 0;
+        // var maskHeight = domHeight - toolbarHeight;
 
-        var gridContentNode = $('.grid-content', domNode);
-        var captionHeight = titleNode && $(titleNode).height() || 0;
-        var toolbarHeight = toolbarNode && $(toolbarNode).height() || 0;
-        gridContentNode.css('top', (captionHeight + toolbarHeight) + 'px');
+        // var maskContainer = $('.wok-grid-loader-container',domNode);
+        // maskContainer.css({'top': toolbarHeight+'px', 'height': maskHeight+'px'});
+        // this.maskContainer = maskContainer;
 
-        var maskNode = $('.grid-mask', domNode);
-        maskNode.css('top', captionHeight + 'px');
+        var maskNode = $('.wok-grid-mask', domNode);
         this.maskNode = maskNode;
 
-        var messageNode = $('.grid-message', domNode);
-        messageNode.css('top', captionHeight + 'px');
+        var messageNode = $('.wok-grid-message', domNode);
         this.messageNode = messageNode;
 
-        var headerView = $('.grid-header-view', domNode);
-        var bodyView = $('.grid-body-view', domNode);
-        headerView.css('left', (frozenWidth) + 'px');
-        bodyView.css('left', (frozenWidth) + 'px');
+        //fixTableLayout.call(this);
 
-        var bodyWidth = width - frozenWidth;
-        headerContainer.css('width', bodyWidth + 'px');
-        bodyContainer.css('width', bodyWidth + 'px');
-
-        fixTableLayout.call(this);
-
-        var gridBody = $('.grid-body', domNode);
+        var gridBody = $('.wok-grid-body', domNode);
         this.gridBody = gridBody;
-        this.resizerLeftmost = $('.grid-resizer-leftmost', domNode);
-        this.resizer = $('.grid-resizer', domNode);
-        var gridHeader = $('.grid-header', domNode);
-        $('th', gridHeader).on('mouseover mousemove', {
-            resizer: this.resizer
-        }, initResizing);
-
-        $('th', gridHeader).on('mouseout', {
-            resizer: this.resizer
-        }, clearResizing);
-
-        this.containerBeingResized = CONTAINER_NORMAL;
-        $('th', frozenHeaderContainer).on('mousedown', {
-            grid: this
-        }, function(event) {
-                event.data.grid.containerBeingResized = CONTAINER_FROZEN;
-                startResizing(this, event);
-        });
-        $('th', headerContainer).on('mousedown', {
-            grid: this
-        }, function(event) {
-                event.data.grid.containerBeingResized = CONTAINER_NORMAL;
-                startResizing(this, event);
-        });
-
-        $('body').on('mousemove.grid#' + this['opts']['id'], {
-            grid: this
-        }, positionResizer);
-        $('body').on('mouseup.grid#' + this['opts']['id'], endResizing);
 
         var data = this['opts']['data'];
 
@@ -515,14 +303,13 @@ wok.widget.Grid.prototype = (function() {
             onRowSelected: null,
             title: null,
             toolbarButtons: null,
-            frozenFields: null,
             fields: null
         },
         createDOM: createDOM,
         setData: setData,
         getSelected: getSelected,
         reload: reload,
-        destroy: destroy,
+        //destroy: destroy,
         showMessage: showMessage
     };
-})();
+})();
\ No newline at end of file
diff --git a/ui/js/src/wok.line-chart.js b/ui/js/src/wok.line-chart.js
index 8b40288..6b60dac 100644
--- a/ui/js/src/wok.line-chart.js
+++ b/ui/js/src/wok.line-chart.js
@@ -80,6 +80,14 @@ wok.widget.LineChart = function(params) {
                 }
             });
         }
+        
+        var defs = [
+            '<defs>',
+                '<pattern id="patternbg" x="0" y="0" width="6" height="6" patternUnits="userSpaceOnUse">',
+                    '<rect x="0" y="0" width="3" height="6" style="stroke:none; fill: #eeeeee;"></rect>',
+                '</pattern>',
+            '</defs>'
+        ].join('');
 
         var canvasNode = $('#' + canvasID);
         canvasNode.length && canvasNode.remove();
@@ -87,25 +95,10 @@ wok.widget.LineChart = function(params) {
           '<svg id="', canvasID, '" class="line-chart"',
               ' height="', height, '" width="', width, '"',
           '>',
+            defs,
             '<rect height="', height, '" width="', width, '" class="background" />'
         ];
 
-        for(var x = linesOffset; x < width; x += linesSpace) {
-            htmlStr.push(
-                '<line x1="', x, '" y1="', 0, '" x2="', x, '" y2="', height, '" />'
-            );
-        }
-
-        linesOffset -= xFactor;
-        while(linesOffset < 0) {
-            linesOffset = linesSpace + linesOffset;
-        }
-
-        for(var y = height - linesSpace; y > 0; y -= linesSpace) {
-            htmlStr.push(
-                '<line x1="', 0, '" y1="', y, '" x2="', width, '" y2="', y, '" />'
-            );
-        }
 
         var maxValueLabel = i18n['KCHHOST6001M'] + ' ' +
             (type === 'value'
@@ -122,12 +115,34 @@ wok.widget.LineChart = function(params) {
             chartVAxis.text(maxValueLabel);
         }
 
+
         seriesNames = [];
         $.each(data, function(i, series) {
             var points = series['points'];
             var className = series['class'];
             var latestPoint = points.slice(-1).pop();
             xStart = latestPoint['x'] - period;
+            htmlStr.push('<path',
+                ' class="series', className ? ' ' + className : '', '"',
+                ' d="M 0,92 '
+            );
+            var first = true;
+            $.each(points, function(i, point) {
+                if(first) {
+                    first = false;
+                }
+                else {
+                    htmlStr.push(' ');
+                }
+
+                var x = xFactor * (point['x'] - xStart);
+                var y = height - yFactor * (type === 'value' ?
+                    point['y'] * 100 / maxValue :
+                    point['y']
+                );
+                htmlStr.push(x, ',', y);
+            });
+            htmlStr.push(' 310,92z" />');
 
             htmlStr.push('<polyline',
                 ' class="series', className ? ' ' + className : '', '"',
@@ -150,6 +165,7 @@ wok.widget.LineChart = function(params) {
                 htmlStr.push(x, ',', y);
             });
             htmlStr.push('" />');
+
         });
 
         htmlStr.push('</svg>');
@@ -158,7 +174,7 @@ wok.widget.LineChart = function(params) {
 
         if(!chartLegend) {
             chartLegend = $('<div class="chart-legend-container"></div>');
-            container.after(chartLegend);
+            container.before(chartLegend);
         }
         else {
             chartLegend.empty();
@@ -167,18 +183,15 @@ wok.widget.LineChart = function(params) {
             var wrapper = $('<div class="legend-wrapper"></div>')
                 .appendTo(chartLegend);
             $([
-                '<svg class="legend-icon" width="20" height="10">',
-                    '<line x1="0" y1="5" x2="20" y2="5"/>',
+                '<svg class="legend-icon" width="5" height="40">',
+                    '<rect  width="5" height="40" />',
                 '</svg>'
             ].join('')).appendTo(wrapper);
-            $('line', wrapper).css({
-                stroke: $(polyline).css('stroke'),
-                'stroke-width': $(polyline).css('stroke-width')
+            $('rect', wrapper).css({
+                fill: $(polyline).css('stroke')
             });
             var label = data[i]['legend'];
             var base = data[i]['base'];
-            $('<label class="legend-label">' + label + '</label>')
-                .appendTo(wrapper);
             var latestPoint = data[i]['points'].slice(-1).pop();
             var latestValue = latestPoint['y'];
             if(type === 'value') {
@@ -187,11 +200,12 @@ wok.widget.LineChart = function(params) {
                     formatSettings
                 );
             }
-            else {
-                latestValue += '%';
+            else {           
+                 latestValue = { v: latestValue, s: '%' };
             }
-            $('<div class="latest-value">' + latestValue + '</div>')
-                .appendTo(wrapper);
+            $('<div class="latest-value"><span class="number">' + latestValue.v + '</span></div>').appendTo(wrapper);
+            $('<span class="legend-label">'+ latestValue.s +'</span><span class="legend-string">'+ label + '</span>').appendTo(wrapper[0].children[1]);
+
         });
     };
 
diff --git a/ui/js/src/wok.login.js b/ui/js/src/wok.login.js
index 926d80c..0aa4b97 100644
--- a/ui/js/src/wok.login.js
+++ b/ui/js/src/wok.login.js
@@ -19,6 +19,9 @@ wok.login_main = function() {
 
     var selectedLanguage = wok.lang.get();
     $('#userLang').val(selectedLanguage);
+    $('#userLang option[value="'+selectedLanguage+'"]').attr("selected", "selected"); 
+    $('#userLang').next().find('.selectpicker').attr('title',$('#userLang option[value="'+selectedLanguage+'"]').text());    
+    $('#userLang').next().children().find('.filter-option').text($('#userLang option[value="'+selectedLanguage+'"]').text());
 
     $('#userLang').on('change', function() {
         wok.lang.set($(this).val());
diff --git a/ui/js/src/wok.main.js b/ui/js/src/wok.main.js
index f4c9940..bcbeae2 100644
--- a/ui/js/src/wok.main.js
+++ b/ui/js/src/wok.main.js
@@ -25,17 +25,18 @@ wok.main = function() {
         var tabsHtml = [];
         $(tabs).each(function(i, tab) {
             var title = tab['title'];
+            var cssClass = tab['css'];
             var path = tab['path'];
             var mode = tab['mode'];
             if (mode != 'none') {
                 var helpPath = wok.checkHelpFile(path);
-                var disableHelp = (helpPath.length == 0 ? "disableHelp" : helpPath);
+                var disableHelp = (helpPath.length == 0 ? "disableHelp " : "");
                 tabsHtml.push(
                     '<li>',
-                        '<a class="item ', disableHelp,'" href="', path, '">',
+                        '<a class="item ', disableHelp,cssClass,'" href="', path, '">',
                             title,
                         '</a>',
-                        '<input id="helpPathId" name="helpPath" value="' + helpPath + '" type="hidden"/>',
+                        '<input id="helpPathId-'+i+'" name="helpPath" class="sr-only" value="' + helpPath + '" type="hidden"/>',
                     '</li>'
                 );
             }
@@ -49,6 +50,7 @@ wok.main = function() {
             var $tab = $(this);
             var titleKey = $tab.find('title').text();
             var title = i18n[titleKey] ? i18n[titleKey] : titleKey;
+            var css = $tab.find('css').text();
             var path = $tab.find('path').text();
             var roles = wok.cookie.get('roles');
             if (roles) {
@@ -58,6 +60,7 @@ wok.main = function() {
                 tabs.push({
                     title: title,
                     path: path,
+                    css: css,
                     mode: mode
                 });
             } else {
@@ -106,7 +109,9 @@ wok.main = function() {
             DEFAULT_HASH = defaultTabPath &&
                 defaultTabPath.substring(0, defaultTabPath.lastIndexOf('.'))
 
-            $('#nav-menu').append(genTabs(tabs));
+            //$('#nav-menu ul.navbar-nav').append(genTabs(tabs));
+            $('#nav-menu ul.navbar-nav li.hostname').after(genTabs(tabs));
+            wok.getHostname();
 
             callback && callback();
         }, function(data) {
@@ -135,22 +140,22 @@ wok.main = function() {
          * point to the tab. If nothing found, inform user the URL is invalid
          * and clear location.hash to jump to home page.
          */
-        var tab = $('#nav-menu a[href="' + url + '"]');
+        var tab = $('#nav-menu ul li a[href="' + url + '"]');
         if (tab.length === 0) {
             location.hash = '';
             return;
         }
 
         // Animate arrow indicator.
-        var left = $(tab).parent().position().left;
-        var width = $(tab).parent().width();
-        $('.menu-arrow').stop().animate({
-            left : left + width / 2 - 10
-        });
+        // var left = $(tab).parent().position().left;
+        // var width = $(tab).parent().width();
+        // $('.menu-arrow').stop().animate({
+        //     left : left + width / 2 - 10
+        // });
 
         // Update the visual style of tabs; focus the selected one.
-        $('#nav-menu a').removeClass('current');
-        $(tab).addClass('current');
+        $('#nav-menu ul li').removeClass('active');
+        $(tab).parent().addClass('active');
         $(tab).focus();
         // Disable Help button according to selected tab
         if ($(tab).hasClass("disableHelp")) {
@@ -227,7 +232,7 @@ wok.main = function() {
          * Register click listener of tabs. Replace the default reloading page
          * behavior of <a> with Ajax loading.
          */
-        $('#nav-menu').on('click', 'a.item', function(event) {
+        $('#nav-menu ul li').on('click', 'a.item', function(event) {
             var href = $(this).attr('href');
             // Remove file extension from 'href'
             location.hash = href.substring(0,href.lastIndexOf('.'))
@@ -266,7 +271,7 @@ wok.main = function() {
         $('#peers').on('click', function() {
 
             // Check if any request is in progress
-            if ($('.popover', '#peers').is(':visible') || searchingPeers == true)
+            if ($('.dropdown', '#peers').is('.open') || searchingPeers == true)
                 return
 
             $('#search-peers').show();
@@ -281,7 +286,7 @@ wok.main = function() {
                     $('#no-peers').removeClass('hide-content');
 
                 for(var i=0; i<data.length; i++){
-                    $('.dropdown', '#peers').append("<a href='"+data[i]+"' target='_blank'>"+data[i]+"</a>");
+                    $('.dropdown-menu ', '#peers').append("<li><a href='"+data[i]+"' target='_blank'>"+data[i]+"</a></li>");
                 }
                 searchingPeers = false;
             });
@@ -346,9 +351,14 @@ wok.checkHelpFile = function(path) {
     return url;
 };
 
+wok.getHostname = function(e) {
+    host = window.location.hostname;
+    $('span.host-location').text(host);
+    return host;
+}
 
 wok.openHelp = function(e) {
-    var tab = $('#nav-menu a.current');
+    var tab = $('#nav-menu ul li.active a');
     var url = $(tab).parent().find("input[name='helpPath']").val();
     window.open(url, "Wok Help");
     e.preventDefault();
diff --git a/ui/js/src/wok.message.js b/ui/js/src/wok.message.js
index db1dc36..b838444 100644
--- a/ui/js/src/wok.message.js
+++ b/ui/js/src/wok.message.js
@@ -16,31 +16,37 @@
  * limitations under the License.
  */
 wok.message = function(msg, level, node) {
-    var container = node || $('#messageField');
+    var container = node || $('#alert-fields');
     if ($(container).size() < 1) {
-        container = $('<div id="messageField"/>').appendTo(document.body);
+        container = $('<div id="alert-fields"/>').appendTo($('#alert-container'));
     }
-    var message = '<div class="message ' + (level || '') + '" style="display: none;">';
+    var message = '<div role="alert" class="alert ' + (level || '') + ' alert-dismissible fade in" style="display: none;">';
     if(!node) {
-        message += '<div class="close">X</div>';
+        message += '<button type="button" class="close" data-dismiss="alert" aria-label="Close"><span aria-hidden="true"><i class="fa fa-times-circle"></i></span></button>';
     }
-    message += '<div class="content">' + msg + '</div>';
+    message += msg;
     message += '</div>';
     var $message = $(message);
     $(container).append($message);
+    $message.alert();
     $message.fadeIn(100);
 
     setTimeout(function() {
         $message.fadeOut(2000, function() {
+            $message.alert('close');
             $(this).remove();
+            $(container).remove();
+            if ($(container).children().length < 1) {
+                $(container).remove();
+            }
         });
     }, 4000);
 
-    $(container).on("click", ".close", function(e) {
-        $(this).parent().fadeOut(200, function() {
-            $(this).remove();
-        });
-    });
+    // $(container).on("click", ".close", function(e) {
+    //     $(this).parent().fadeOut(200, function() {
+    //         $(this).remove();
+    //     });
+    // });
 };
 
 /**
@@ -102,15 +108,15 @@ wok.confirm = function(settings, confirmCallback, cancelCallback) {
 };
 
 wok.message.warn = function(msg, node) {
-    wok.message(msg, 'warn', node);
+    wok.message(msg, 'alert-warning', node); 
 };
 wok.message.error = function(msg, node) {
-    wok.message(msg, 'error', node);
+    wok.message(msg, 'alert-danger', node);
 };
 wok.message.error.code = function(code) {
     msg = code + ": " + i18n[code]
-    wok.message(msg, 'error');
+    wok.message(msg, 'alert-danger');
 };
 wok.message.success = function(msg, node) {
-    wok.message(msg, 'success', node);
+    wok.message(msg, 'alert-success', node);
 };
diff --git a/ui/js/src/wok.window.js b/ui/js/src/wok.window.js
index 5542270..e1a88a1 100644
--- a/ui/js/src/wok.window.js
+++ b/ui/js/src/wok.window.js
@@ -31,14 +31,15 @@ wok.window = (function() {
 
         _windows.push(windowID);
         _listeners[windowID] = settings['close'];
-        var windowNode = $('<div></div>', {
-            id: windowID,
-            'class': settings['class'] ? settings['class'] + ' bgmask remove-when-logged-off' : 'bgmask remove-when-logged-off'
-        });
+        var windowNode = $('<div id="'+windowID+'" class="modal-dialog"></div>');
+
+        $('#modalWindow').modal('show');
 
-        $(windowNode).css(settings['style'] || '');
+        $('#modalWindow').on('hidden.bs.modal', function () {
+            wok.window.close();
+        });
 
-        $(windowNode).appendTo('body').on('click', '.window .close', function() {
+        $(windowNode).appendTo('#modalWindow').on('click', '.window .close', function() {
             wok.window.close();
         });
 
@@ -51,16 +52,14 @@ wok.window = (function() {
     };
 
     var close = function() {
-        var windowID = _windows.pop();
-        if(_listeners[windowID]) {
-            _listeners[windowID]();
-            _listeners[windowID] = null;
-        }
-        delete _listeners[windowID];
-
-        $('#' + windowID).fadeOut(100, function() {
-            $(this).remove();
-        });
+            $('#modalWindow').removeData('bs.modal');
+            var windowID = _windows.pop();
+            if(_listeners[windowID]) {
+                _listeners[windowID]();
+                _listeners[windowID] = null;
+            }
+            delete _listeners[windowID];
+            $('#' + windowID).remove();
     };
 
     return {
diff --git a/ui/pages/login.html.tmpl b/ui/pages/login.html.tmpl
index 12ca69f..5d98961 100644
--- a/ui/pages/login.html.tmpl
+++ b/ui/pages/login.html.tmpl
@@ -24,77 +24,110 @@
 #silent next = "?next=%s" % $getVar('data.next', '') if $getVar('data.next', '') else ""
 #from wok.config import get_version
 <!DOCTYPE html>
-<html lang="$lang.lang[0]">
+<html class="no-js" lang="$lang.lang[0]">
 <head>
 <meta charset="UTF-8">
 <title>Kimchi</title>
 <meta http-equiv="X-UA-Compatible" content="IE=edge"/>
 <meta name="viewport" content="width=device-width, initial-scale=1.0, user-scalable=yes" />
-<link rel="shortcut icon" href="images/logo.ico">
-<link rel="stylesheet" href="$href('css/theme-default.min.css')">
-<script src="$href('libs/jquery-1.10.0.min.js')"></script>
-<script src="$href('libs/jquery-ui.min.js')"></script>
+<link rel="apple-touch-icon" sizes="57x57" href="images/apple-touch-icon-57x57.png">
+<link rel="apple-touch-icon" sizes="60x60" href="images/apple-touch-icon-60x60.png">
+<link rel="apple-touch-icon" sizes="72x72" href="images/apple-touch-icon-72x72.png">
+<link rel="apple-touch-icon" sizes="76x76" href="images/apple-touch-icon-76x76.png">
+<link rel="apple-touch-icon" sizes="114x114" href="images/apple-touch-icon-114x114.png">
+<link rel="apple-touch-icon" sizes="120x120" href="images/apple-touch-icon-120x120.png">
+<link rel="apple-touch-icon" sizes="144x144" href="images/apple-touch-icon-144x144.png">
+<link rel="apple-touch-icon" sizes="152x152" href="images/apple-touch-icon-152x152.png">
+<link rel="apple-touch-icon" sizes="180x180" href="images/apple-touch-icon-180x180.png">
+<link rel="icon" type="image/png" href="images/favicon-32x32.png" sizes="32x32">
+<link rel="icon" type="image/png" href="images/favicon-194x194.png" sizes="194x194">
+<link rel="icon" type="image/png" href="images/favicon-96x96.png" sizes="96x96">
+<link rel="icon" type="image/png" href="images/android-chrome-192x192.png" sizes="192x192">
+<link rel="icon" type="image/png" href="images/favicon-16x16.png" sizes="16x16">
+<link rel="manifest" href="images/manifest.json">
+<meta name="apple-mobile-web-app-title" content="Kimchi">
+<meta name="application-name" content="Kimchi">
+<meta name="msapplication-TileColor" content="#4d4d4d">
+<meta name="msapplication-TileImage" content="images/mstile-144x144.png">
+<meta name="theme-color" content="#ffffff">
+<link rel="stylesheet" href="$href('libs/themes/base/jquery-ui.min.css')">
+<link rel="stylesheet" href="$href('libs/themes/base/jquery-ui.custom.css')">
+<link rel="stylesheet" href="$href('libs/themes/base/bootstrap-official.css')">
+<!-- <link rel="stylesheet" href="$href('css/theme-default.min.css')"> -->
+<link rel="stylesheet" href="$href('fontawesome/css/fontawesome.css')">
+<link rel="stylesheet" href="$href('libs/themes/base/bootstrap.custom.css')">
+<script src="$href('libs/modernizr.js')"></script>
+<script src="$href('libs/jquery.min.js')"></script>
+<script src="$href('libs/jquery-ui.js')"></script>
 <script src="$href('libs/jquery-ui-i18n.min.js')"></script>
+<script src="$href('libs/vendor.js')"></script>
+<script src="$href('libs/bootstrap.js')"></script>
+<script src="$href('libs/bootstrap-select.min.js')"></script>
 <script src="$href('js/wok.min.js')"></script>
-<style type="text/css">
-.topbar select {
-    float: right;
-    margin-top: 12px;
-    margin-right: 10px;
-}
-.login-area {
-    margin: 120px auto 0;
-}
-#login-window {
-    width: 315px;
-}
-.err-area {
-    height: auto;
-    margin-bottom: 10px;
-}
-.err-mess {
-    color: #C85305;
-}
-</style>
 </head>
 <body onload="wok.login_main()">
-<div class="container topbar">
-    <span id="logo"><img alt="Project Kimchi" src="images/theme-default/logo-white.png"></span>
-    <select id="userLang">
-        <option value="en_US">English (US)</option>
-        <option value="zh_CN">中文(简体)</option>
-        <option value="pt_BR">Português (Brasil)</option>
-        <option value="de_DE">Deutsch (Deutschland)</option>
-        <option value="es_ES">Español (España)</option>
-        <option value="fr_FR">Français (France)</option>
-        <option value="it_IT">Italiano (Italia)</option>
-        <option value="ja_JP">日本語 (日本)</option>
-        <option value="ko_KR">한국어 (대한민국)</option>
-        <option value="ru_RU">Русский (Россия)</option>
-        <option value="zh_TW">中文(繁體)</option>
-    </select>
-</div>
-<div id="login-window" class="login-area">
-    <div class="err-area">
-        <div id="messUserPass" class="err-mess" style="display: none;">$_("The username or password you entered is incorrect. Please try again.")</div>
-        <div id="messSession" class="err-mess" style="display: none;">$_("Session timeout, please re-login.")</div>
+    <div class="topbar">
+        <nav class="navbar navbar-inverse">
+          <div class="container">
+            <div class="navbar-header">
+              <a class="navbar-brand" href="#">Kimchi</a>
+            </div>
+          </div>
+        </nav>
+          <nav class="navbar navbar-default">
+            <div class="container">
+                <div class="navbar-header">
+                    <button type="button" class="navbar-toggle collapsed" data-toggle="collapse" data-target="#nav-menu" aria-expanded="false">
+                        <span class="sr-only">Toggle navigation</span>
+                        <span class="icon-bar"><!-- Hamburguer button here --></span>
+                    </button>
+                </div>
+                <div class="collapse navbar-collapse" id="nav-menu">
+                    <ul class="nav navbar-nav">                
+                        <li class="hostname"><span class="host-location"></span></li>
+                    </ul>
+                </div>
+            </div>
+          </nav>
     </div>
-    <form id="form-login" class="login-panel">
-        <div class="row">
-            <input type="text" id="username" name="username" required="required" placeholder="$_("User Name")" autofocus/>
-            <div id="username-msg" class="msg-required"></div>
+    <div class="content">
+        <div id="login-window" class="login-area">
+            <div class="err-area">
+                <div id="messUserPass" class="alert alert-danger" style="display: none;">$_("The username or password you entered is incorrect. Please try again.")</div>
+                <div id="messSession" class="alert alert-danger" style="display: none;">$_("Session timeout, please re-login.")</div>
+            </div>
+            <form id="form-login" class="form-horizontal" method="post">
+                <div class="form-group">
+                    <label for="username" class="sr-only">$_("User Name")</label>
+                    <input type="text" class="form-control" id="username" name="username" required="required" placeholder="$_("User Name")" autofocus/>
+                    <div id="username-msg" class="msg-required"></div>
+                </div>
+                <div class="form-group">
+                    <label for="password" class="sr-only">$_("Password")</label>
+                    <input type="password" class="form-control" id="password" name="password" required="required" placeholder="$_("Password")" />
+                    <div id="password-msg" class="msg-required"></div>
+                </div>
+                <div class="form-group">
+                <button id="btn-login" class="btn btn-login col-md-12 col-lg-12">
+                    <span id="login">$_("Log in")</span>
+                    <span id="logging" style="display: none;">$_("Logging in...")</span>
+                </button>
+                </div>
+                <select id="userLang" class="selectpicker col-md-12 col-lg-12">
+                    <option value="en_US">English (US)</option>
+                    <option value="zh_CN">中文(简体)</option>
+                    <option value="pt_BR">Português (Brasil)</option>
+                    <option value="de_DE">Deutsch (Deutschland)</option>
+                    <option value="es_ES">Español (España)</option>
+                    <option value="fr_FR">Français (France)</option>
+                    <option value="it_IT">Italiano (Italia)</option>
+                    <option value="ja_JP">日本語 (日本)</option>
+                    <option value="ko_KR">한국어 (대한민국)</option>
+                    <option value="ru_RU">Русский (Россия)</option>
+                    <option value="zh_TW">中文(繁體)</option>
+                </select>
+            </form>
         </div>
-        <div class="row">
-            <input type="password" id="password" name="password" required="required" placeholder="$_("Password")" />
-            <div id="password-msg" class="msg-required"></div>
-        </div>
-        <div class="row">
-        <button id="btn-login" class="btn-normal-1">
-            <label id="login">$_("Log in")</label>
-            <label id="logging" style="display: none;">$_("Logging in...")</label>
-        </button>
-        </div>
-    </form>
-</div>
+    </div>
 </body>
 </html>
diff --git a/ui/pages/wok-ui.html.tmpl b/ui/pages/wok-ui.html.tmpl
index a2fd4e1..8734c86 100644
--- a/ui/pages/wok-ui.html.tmpl
+++ b/ui/pages/wok-ui.html.tmpl
@@ -23,23 +23,44 @@
 #silent _t = t.gettext
 #from wok.config import get_version
 <!DOCTYPE html>
-<html lang="$lang.lang[0]">
+<html class="no-js" lang="$lang.lang[0]">
 <head>
 <meta charset="UTF-8">
 <title>Kimchi</title>
 <meta http-equiv="X-UA-Compatible" content="IE=edge"/>
 <meta name="viewport" content="width=device-width, initial-scale=1.0, user-scalable=yes" />
-<link rel="shortcut icon" href="images/logo.ico">
+<link rel="apple-touch-icon" sizes="57x57" href="images/apple-touch-icon-57x57.png">
+<link rel="apple-touch-icon" sizes="60x60" href="images/apple-touch-icon-60x60.png">
+<link rel="apple-touch-icon" sizes="72x72" href="images/apple-touch-icon-72x72.png">
+<link rel="apple-touch-icon" sizes="76x76" href="images/apple-touch-icon-76x76.png">
+<link rel="apple-touch-icon" sizes="114x114" href="images/apple-touch-icon-114x114.png">
+<link rel="apple-touch-icon" sizes="120x120" href="images/apple-touch-icon-120x120.png">
+<link rel="apple-touch-icon" sizes="144x144" href="images/apple-touch-icon-144x144.png">
+<link rel="apple-touch-icon" sizes="152x152" href="images/apple-touch-icon-152x152.png">
+<link rel="apple-touch-icon" sizes="180x180" href="images/apple-touch-icon-180x180.png">
+<link rel="icon" type="image/png" href="images/favicon-32x32.png" sizes="32x32">
+<link rel="icon" type="image/png" href="images/favicon-194x194.png" sizes="194x194">
+<link rel="icon" type="image/png" href="images/favicon-96x96.png" sizes="96x96">
+<link rel="icon" type="image/png" href="images/android-chrome-192x192.png" sizes="192x192">
+<link rel="icon" type="image/png" href="images/favicon-16x16.png" sizes="16x16">
+<link rel="manifest" href="images/manifest.json">
+<meta name="apple-mobile-web-app-title" content="Kimchi">
+<meta name="application-name" content="Kimchi">
+<meta name="msapplication-TileColor" content="#4d4d4d">
+<meta name="msapplication-TileImage" content="images/mstile-144x144.png">
+<meta name="theme-color" content="#ffffff">
 <link rel="stylesheet" href="$href('libs/themes/base/jquery-ui.min.css')">
-<link rel="stylesheet" href="$href('fontello/css/fontello.css')">
-<link rel="stylesheet" href="$href('fontello/css/animation.css')">
-<link rel="stylesheet" href="$href('css/theme-default.min.css')">
-
-<script src="$href('libs/jquery-1.10.0.min.js')"></script>
-<script src="$href('libs/jquery-ui.min.js')"></script>
+<link rel="stylesheet" href="$href('libs/themes/base/jquery-ui.custom.css')">
+<!-- <link rel="stylesheet" href="$href('css/theme-default.min.css')"> -->
+<link rel="stylesheet" href="$href('fontawesome/css/fontawesome.css')">
+<link rel="stylesheet" href="$href('libs/themes/base/bootstrap.custom.css')">
+<script src="$href('libs/modernizr.js')"></script>
+<script src="$href('libs/jquery.min.js')"></script>
+<script src="$href('libs/jquery-ui.js')"></script>
 <script src="$href('libs/jquery-ui-i18n.min.js')"></script>
+<script src="$href('libs/bootstrap.js')"></script>
+<script src="$href('libs/bootstrap-select.min.js')"></script>
 <script src="$href('js/wok.min.js')"></script>
-
 <!-- This is used for detecting if the UI needs to be built -->
 <style type="text/css">
 #buildme {
@@ -67,55 +88,66 @@
 </style>
 </head>
 <body onload="wok.main()">
-<div class="container">
-<header class="topbar">
-    <h1 id="logo"><img alt="Project Kimchi" src="images/theme-default/logo-white.png"></h1>
-    <ul class="nav-top">
-        <li>
-            <div id="peers" class="peers hide-content popable">
-                <span>$_("Peers")</span>
-                <span class="arrow"></span>
-                <div class="dropdown popover right-side">
-                    <p id="search-peers">$_("Searching")...</p>
-                    <p id="no-peers" class="hide-content">$_("No peers found.")</p>
-                </div>
+    <div class="topbar">
+        <nav class="navbar navbar-inverse">
+          <div class="container">
+            <div class="navbar-header">
+              <a id="logo" class="navbar-brand" href="#" title="Project Kimchi">Kimchi</a>
             </div>
-        </li>
-        <li>
-            <div id="user" class="popable">
-                <span id="user-icon"></span>
-                <span id="user-name" class="empty-when-logged-off"></span>
-                <span class="arrow"></span>
-                <div class="action-panel popover right-side">
-                    <a id="btn-help" class="user-menu-item" href="javascript:void(0);">$_("Help")</a>
-                    <br/>
-                    <br/>
-                    <a id="btn-about" class="user-menu-item" href="javascript:void(0);">$_("About")</a>
-                    <br/>
-                    <hr/>
-                    <a id="btn-logout" class="user-menu-item" href="javascript: void(0);">$_("Log out")</a>
-                </div>
+            <ul class="nav navbar-nav navbar-right">
+                <li class="dropdown hide-content peers" id="peers">
+                    <a href="#" class="dropdown-toggle" data-toggle="dropdown" role="button" aria-haspopup="true" aria-expanded="false"><span class="topbar-text">$_("Peers")</span><span class="caret"></span></a>
+                   <ul class="dropdown-menu">
+                       <li id="search-peers"><span>$_("Searching")...</span></li>
+                       <li id="no-peers" class="hide-content">$_("No peers found.")</li>
+                   </ul>
+                </li>
+                <li class="dropdown" id="user">
+                    <a href="#" class="dropdown-toggle" data-toggle="dropdown" role="button" aria-haspopup="true" aria-expanded="false">
+                        <i class="fa fa-user" id="user-icon"></i><span class="topbar-text empty-when-logged-off" id="user-name"></span><span class="caret"></span>
+                    </a>
+                    <ul class="dropdown-menu">
+                        <li class="critical"><a id="btn-logout" href="javascript: void(0);"><i class="fa fa-ban"></i><span>$_("Log out")</span></a></li>
+                    </ul>
+                </li>
+                <li class="dropdown">
+                    <a href="#" class="dropdown-toggle" data-toggle="dropdown" role="button" aria-haspopup="true" aria-expanded="false"><i class="fa fa-question-circle"></i><span class="topbar-text">$_("Help")</span><span class="caret"></span></a>
+                    <ul class="dropdown-menu">
+                        <li><a id="btn-help" href="javascript: void(0);">$_("Help")</a></li>
+                        <li><a id="btn-about" href="javascript:void(0);">$_("About")</a></li>
+                    </ul>
+                </li>
+            </ul>
+          </div>
+      </nav>
+      <nav class="navbar navbar-default">
+        <div class="container">
+            <div class="navbar-header">
+                <button type="button" class="navbar-toggle collapsed" data-toggle="collapse" data-target="#nav-menu" aria-expanded="false">
+                    <span class="sr-only">Toggle navigation</span>
+                    <span class="icon-bar"><!-- Hamburguer button here --></span>
+                </button>
             </div>
-        </li>
-    </ul>
-</header>
-<div class="content">
-    <nav class="navbar">
-        <ul id="nav-menu" class="nav-menu">
-            <li class="menu-arrow"></li>
-        </ul>
-    </nav>
-    <div id="main">
+            <div class="collapse navbar-collapse" id="nav-menu">
+                <ul class="nav navbar-nav">                
+                    <li class="hostname"><span class="host-location"></span></li>
+                </ul>
+            </div>
+        </div>
+      </nav>
+    </div>
+    <div class="content">
+        <div id="main">
+        </div>
+    </div>
     </div>
-</div>
-</div>
 
-<div id="buildme">
-    <div><p>Oops!  It looks like I am running from a source tree and you forgot to build!
+    <div id="buildme" style="display:none">
+        <div><p>Oops!  It looks like I am running from a source tree and you forgot to build!
     Please run the following command from the wok and kimchi directories and reload this page:</p>
-    <p><code>make</code></p>
+        <p><code>make</code></p>
+        </div>
     </div>
-</div>
 
 <script id="about-tmpl" type="wok/template">
     <div class="window about-window">
-- 
1.9.3




More information about the Kimchi-devel mailing list