From c30cdc29dabcf8b1ede0f9fe05049c72b8570887 Mon Sep 17 00:00:00 2001
From: "marcins78@gmail.com"
 <marcins78@gmail.com@eb7970ca-0f6f-de4b-2938-835b230b9d1f>
Date: Mon, 5 Dec 2011 21:14:41 +0000
Subject: [PATCH] Beautifying strength and vitality display on active cards.

---
 .../gemp-lotr-web/src/main/webapp/game.html   |   4 ---
 .../src/main/webapp/images/strength.png       | Bin 0 -> 8241 bytes
 .../src/main/webapp/images/vitality.png       | Bin 0 -> 5699 bytes
 .../src/main/webapp/js/gameAnimations.js      |   4 +++
 .../src/main/webapp/js/gameUi.js              |  31 ++++++++++++++----
 5 files changed, 29 insertions(+), 10 deletions(-)
 create mode 100644 gemp-lotr/gemp-lotr-web/src/main/webapp/images/strength.png
 create mode 100644 gemp-lotr/gemp-lotr-web/src/main/webapp/images/vitality.png

diff --git a/gemp-lotr/gemp-lotr-web/src/main/webapp/game.html b/gemp-lotr/gemp-lotr-web/src/main/webapp/game.html
index 2aad64825..2f89707e1 100644
--- a/gemp-lotr/gemp-lotr-web/src/main/webapp/game.html
+++ b/gemp-lotr/gemp-lotr-web/src/main/webapp/game.html
@@ -90,16 +90,12 @@ body {
 
 .cardStrength {
     text-align: center;
-    background-color: #7a6a53;
-    opacity: 1;
     font-weight: bolder;
     color: #ffffff;
 }
 
 .cardVitality {
     text-align: center;
-    background-color: #8a1f0d;
-    opacity: 1;
     font-weight: bolder;
     color: #ffffff;
 }
diff --git a/gemp-lotr/gemp-lotr-web/src/main/webapp/images/strength.png b/gemp-lotr/gemp-lotr-web/src/main/webapp/images/strength.png
new file mode 100644
index 0000000000000000000000000000000000000000..c0894d430aaf44866d97bc40d662327e6b665243
GIT binary patch
literal 8241
zcmW+*2RK{*_YO6JAV`V5OSDx~joPter@mCt+O_wtRbtd^iM^|+YN=YaM~ar(HB-A4
zgxY)k@9+O4H}|=pC&_c}J@0wXd*070Lw!wJYBp*R2t=!`rG^I14}k*>rT{+4Ir_MP
z6NwL66A7vs;#dbRC~R~z)j-$(dlj{nrvWQeo?2!;AP^1H{|*vRP97Xsr1aI+Q>Vm3
z$YD_F>PLhm5Qw`*TTR6{aQ5#Dv)2|=LGuAa3IW9Sw&TqkKOq^sD%3^d5#K?n>LZE9
zb%JrJY4TeBcG?w~zk>IUROjz}&O`l`O&5vv?surLcx$8iN-!tGDTa|MUP2vu!;nn*
zj(`|V+4JDw?e=p89j@RriaG?tTWf@_{se55uK9fa`eNYtav_}U<l63yLT&A}eBtl{
zr}`*2m^TAay1<OQU?p5ABEJ_}b_6}Tnv>Qut$a7>`T^hca!{F+?r>iU>zs3Bi4&t^
zjUfT)Xs6~a=LLX%VypxA=H`7{G)OzIX*EbeZ4J${%o0~DRa3ZM2Qs<|D&J4C#rE2V
zd?l{0QEO<>YqVk&7Fj(NWexvM*w;b#cVN*4g}Gb-VNdCg_nuv!cjuqoadT+Bki|DF
zEaq`j<2*%j2l+Awc(qdzrN82_-VX}v@uBxlvf0o2!q4W`l7l3ZS3J(zpOs^;*g(Ri
zMNVvGWo1Q9vk2sOg8QVoQl|X*<kWSPU*88&5KN+1lP0<wm%P&Y9e!S54HwQFn4X<Q
zw#@Yo1}7wDdPi>!6$J>n2QRcyJX-u-Bg+&)3&OmYB7~q(+0we43rdZ_r?#4_VRG?r
zl`fW|?*?f?>_Lc3?^q!rAwrsfEZO4iCJVYA8wM8_mo?vq?;Fqm=)+~@J~_RPl%V+Q
zpXC~S(Z?qKpTwGjP)5Md5|EhEeQ^i8KUCeQr(r8yK>M@Df}((SByp;mA502GCi@Ik
zPvI}m&YNbsEd;CW(8eeM^xo6StT<T$9YLPI)YUO(Rje0Q^r!ytNx0YX&y$Jzq%Apg
zqDF@=Wx;}Lz>5CD*4@p5(B_5haCqmh?ru^H^fmhJ`1;4^wKJw)GK%Rhb}VUnejdmp
zWYnLCm`FrhAn@$I-3MH4JQBWbomq$`Lk7Xgz7m-rmrw0;|AN{#o1aeqqwn?)hmt5)
zO7Hx0OirF$?iSTRTnb0r?eqFvUw^pDpCV7nOD6iXHO`@yYIr|`xOMfW!ugGxRLjNW
zv4O5`dbWdck+IOL(<r3(<BW;;8`mG*9c7W&t{{k<ty_%scRhzp5{z~#NEx_2UZj?&
zcIwnS?7T*aS6_UQKT*BZ_;IUu=vF<NxBS`Hy`%nig?&3ezr$}!xY(s;QQ=Y^jIO;K
zlQi+u_Dvmq!DpWSH>sn8`hMsezNSPN<zmN}OQ&O?MBS2`yiA6ubTlI$0}m)w#@dK+
z?~}uGF>#{|@f0}Nfr-mScj|L{{ao`3#=5R*{&7dh@w}|R+uzky%NPFPJzqX<ldDAR
z6NXp1D7ndOA;~Kd=wNElUh;hhu~jHo{Z%m5P`q4?PqpJ($i2hz#?k}96_&VEQ=Xo9
z*bh{9N&3ist{2pwGPEO8yr@;>Iu^FEV0J4(SGC1CyVo*cJD<I!<lR-@WnX(!Hlojq
z8jVsjI#?A_+@-RUV9k^Dp*RfYRDtrWj!H(Pp(=#lVWCK6eps`6w;04RC+4F)&WppY
z)(o6ogx`9L|JUhf>8rq^P5PMG@KZ)H_K7~@?p9Lp^{zt8Eqy3*6(j<>7;c<$o>z)5
zmP<cjF_GFJq|66wqpPRn&i~#EXKk)pIVBWo*3PI^TE;?2o2yFD6;@$k(nmiBOP+k{
zmed3Df+~uL58<{@BoBm?Oa)X5>x7+MDsCK7yu*I=-(m~o^B=?H$G`nknNv2WPKBpe
z_7c5H^by5CuV(!p%`vDR4-Y$65w9u-9gZuxo5I(%8u6inVvvig?Q2CTDJjpRO|#as
zey86rw%cTa4}_VIe&QtcAi<WuoF7QC(fU5*{CY_uLx_6|MuI<E7x3o}zLk6$Go-uL
zoLo~Q?%NV-i1PZo_n$?}k(9-hCB<4Jm83<R*^7|tp9d`Ouu3rGZ!CHi^ZLlS1hLRq
zT+4LR2Hu+qx===>SC~{j_i5sooSfYG&Y!Y4s>$7xeg8R>(sFaIg{2ftRS6WrtV{LM
z7IA8^h3nm)_r@Yx-QXElW(*X}3sq+bZX<z|@f&j#5O@oRZEZrRnV6WS+g@-@^uxQw
zz8$w8^PPpV%;|HtZ*v<_6EUwXQ4D;T$CR&mF|MF7G^(jGiF@0AYwl|LnDkHn&vL!-
z)+~V^X;nmhJ$?P<kz&=afxCQn29Txbu6c!)nx>{#gn}2$!wSb7Y<Tnc*aYEB9joRT
zdQO=LByY;AA5<_Mb=ZCojD}oh=FTl4p(6HMqzjt8Lq!vgORHykcM2^jN@3Z$6fc;M
zx+U+Bsl;_2b2GgP%wi-J{vsTm_g|{3m|pFJ4@nEtRUX&ITyt`5#7xO}QJ$;s#}qoJ
ztx@hRFKc$G6?YA|dr#DEo*!>(a`XkRmyXK>{NsS&IxjBd`~OOar1!^JEb?=of*Tqe
z8De;sWn#9^*N)G3Lb;PyI+NrrzIsyC*46^aoO5T%_h-r1r);tyDO5aV{p~ZX@Yu`@
z7fr+RKSTiWxk@DnXpbZaLiCiZ;LJq7w)AAYpT|In4kaA}>IX}zK$u8!2?8&{AVdO=
zDB)I&JXgA~-khn8xc_`;k$oYMnw^~;Xaq7LCt`FQG7&vJ>i^4YgPSV&Wpp&TaH%p_
z`+CBU6N?t>RhEo&Z;VA(NdERiTCGtCmwx}d_tkTWuj*Mx^5r>8P5AXyKFmxN9y20I
z`|WcP<|6-a@XUiCF{C<Sa~eFn)lpfzIhi1nJQLkmt=R4nyn$Vj5%Z;O3b{$S-9$-W
zaH4+l4`iTl2zwf`OTIZ<PZLYW+1(y`{`vVZ7pOCtBZ>#S7{t{rrUoSg9+qSM6RlLT
z9I4;tC<LDpGF2dM1#S&Tf=O^<R%XnSdN&9hgyBL>sM>T(z&)<OMG_F%^Wg$@m^!#~
z#2pe8T}32JHn?9+bA-kgTdxs8jJ#wL*$~B}gud5)uABLVedZpPJqz;ZoEA-cQvTZo
z-OI~-K<?fOcUy@?xZ!y)5$Jd^$msU5b&kV^3KA?s0K&=h$tt5l#FG19x=@HU-B^3G
z5kIC!j~?-07We)ReDz&tY@QRP<7}p<m)`-U3Utlrn2vsw{_NtscN;Z!Eq`C?LHp?R
z?=S;ZS{#%n?U9Z)2VY{yCccq=qK5J6=x^o@0086;JRyN5D?eYo6y4nwMLFs!^=8n)
z=ngZ0BnVDfG&2gz7}W*(WI}Tp#*Kjje2K9J5AS!%#zrV}^l7CETrz|>*4aCayr;v7
zi76^3yEi60FH}hC>g-XaS0KZQc`j{D<kQA?N$Ln;HpzG9V^9dfU3^3;6{wTm;$zj(
z?%u#Xdi$Yur=LSZ%5h}2wzfO+^Z-(UveA~XQvm8)Opgg502L^NMz{P13UOxuwf`UZ
z<>PNa+CJa8O=~UqQb5}(M{2K$55SckQ#y*=tMwJoOiC<7R~EaX7W1Nf=uo@=p#-dR
zGF})|wS>FB?Dd+Sl5``exP9|VWO*7$g7&_1=V$R0(Z=;-q-rdk3iu@txD&3kUVs)E
z>=TX$An;*Aq^!K$NF*ItP8j;`IV9UHrc0BKWkez1F+c!@cbLav?@cNJv{tvDiEJD`
zlpkhqyLt!h{tspEa69df5Sz1Ej5|C=1*{*b1#}e}mU-otxo;;YGStzebli%GA&Mzi
zMF}>DLUhaMkaJE9fX`;pFEe*CGBbgsjFa+Xl;JTr=v;9!|D@#D2lt6jKm^hfX+M-v
zuc9dF`M{)kashPh+o~uk)cUU-w~g>QSGS5ncr!8%t|l@h2<CN^+*tF^nQjc{O1B|N
zcV?~6C4$~~a!_hB7C#o|Nw$T@kRa@zC`?UG8dgu$)YXyo!k1+z2pr8-xQ4A?Stcz>
z4&$n~(nvr+kC-;0NEBByBD3TU_9GL@u<zQJPfSW$nyq)y$|4{50(xDZj-HT7CT^Sg
z-D^9{c=-AAi^j+ZC>3VWip>fyg(_u)M0JV9-g}-{CdWZW65PfGX4TNWm8N}rXLgni
ziv}bukV~Khr~Gtvbs-7}+uwdu|6m@`P^+8*q+YKS4+cb#=vgvymQ9Y@QUOs>>y39w
z_7k_Z78}ltc-73nyLDI&YQ{uyI|=6aQY7jdYl)n+0OAf1^YA{DjN~2GsmnT%7ov)>
zj_b0DI6U<GSY2)F;zCndS^0j#8F6qBtN^@E+6$Mf(bU*6Np(rRs4}M!KhEYVRq&gB
zc?`71#U|!Ab8@ftG{2e(KN;IZ5jz{)7WhWH(l_;9c&b3;_W6ziiwabE>JYoifCQk!
zs}X077sM!6OB?Gb3`Y@ytQwMaZ{0w}o^Q#}N%%8c!@DI1>sDBU($Lf>gn#g#r3Y({
zwh6?;q(S_iFz>fEBbR&h*)%};VHp9o5+1Vs=9Lxf@y!#=3lK&X@$D3`%g+)hQIykc
z6G*wqLZjGF>$a#ECKb3x0qr7UaR0~Pwx`WT{Hfv+fyVS2#^@<O#~lBahEmwT7g3Uk
zNZtK=OI}Y7BYEI4Hn0e1fxAc}SSdYIpO^E_cbXFDxFjv+HCDhe=ZH=<9qm*gmwaEs
z3TuMXxXKu8dr;?+G`J(gniKPHelE>;$}enqzM@nhIfKeb2h|HuD(Ll~!+5LC$qo)b
zC_1|(^<`%B{m*h)J2PhBB4ojU+f#EZ3QgU<9VH-1`w00R8f;VG{#}?>LrgM0k%4*p
z<6mQj?0G#CXO|73V98`#rq^kWikoW`UL4zhh+;55OM}~sYxVpUcGz$u7@!c!BXd?{
zoQm203KBQ~4jCUG&&tl$X3ZcrJ4)qhrP@u8!YLrO(-Xp_W3Stz?a5op{qH7wUjqMq
z6#Z}P`=}p9ftF#E3W_>v!?FJ12)M}U;X5+d+c)whz&AT-LL46g!CFuYcXdHHtF~2y
zspdFRqlM!;6Z4%b1hR^wDy-rC0vNaFyvtzy-k5Fjoe~*Ax<uCZZtlE^HsJN{{Sdo+
zd5Sp_Vf%$LY?7e%a-7=J7sDK!?CiGKF#|G{2;q298d*%He+$jRahI%S+k8Y75g|wu
z3Ci1-#Jb;wS;Na7v#YBbEl3XjN<)JG><4)&VjodNb$!;H+bwd+sSxsTgK5lf9-kxX
zKs?P=)!AicVFoFy@#No<JP)kHc`zrfiyU)ZhM)UaIi?%(nR7;QBBf|*c;7Bv=YHM$
z#JG!36WKlmM|oZx{PB$6#3^}k%irKp>h*O-U>qFdti?!zC^_J2$R{T!CtQeX?+`Gf
zS1;H^FoxK%>zp5U$+yH6DzKPs^3Rqm9#5Mg;}SeUkq#BKNEo2xQvX~B`WTCAPUV!9
zwkUp^w|h?xh;!N!tx-wZ0s=`90GOFX66$F8Mw(v8NqdTWH9c?4<_}3dVf9W)TD8=2
z5{`5<MWuP=vH~qFPV5a?yS*9F7&p%M%3y1zmNJ$u6r9n;qZa8y02s7RyyLT+;95z)
zOn*581RnFopC!*{^W8T&Hn)5dwu$lh+#fQZb=hOAc{~*iyZxKtbSMN@$WB-OhJoi&
zH+ieq*4?b12kiMrri8M9G<=Vd-(hbK8Wm~-bJmrPagBA73A>O%^+>QKF+Ulkdn=}`
zbFHNS|A9zev2t~VB-X$*WeEtb6p=bN`$xs*{k+wpFlwNkYo`L8-=X%Ee@jwy^#6--
zk@O`(PMK`?V+jStH#d>5@!dwH#t;yLK|}TY*QQpFvfz!4iOTY!)-wu$h~DSK?}P-P
z6HfnjwhD6(*yv#>bIPH>iJ>2}rJpmv5~)YQxtfMjk$C{i2$D=4@_t3adjTy7gmry&
z`9C395VR@>EMTCIdl)zHThf(1jQmi0(BScb<4-1W$Zfx1Yv+q&M&3D#s?YNG%~eY6
zmb*&_vU1Hqylg-cv)qBc30MksBFxm$b+kIEWI!`$aQove3!w3FM*5d*Wbtb$l4f_l
z!eQJ<>^$dTwyN8Y$Q2nmZxnZ;IE<P+D~5LH)LXXD9F5|1^vxZ_Q_tP@c$O)5I?iNx
z4`Y2oK)ngSivct_x$;u1_`fHuEKx6GpSaN!5LCt`Ws;*TL@B5I9(~~{#SnrV8}Uw6
zx3p7JW8RorPH95PoNR}(-Y_x@?|=UCCFb({A3(`pgAYZ{Lg~q7wH(hItl>ceU*>(j
zogBYcgU57>C02M>Y-kHxEV!o0Fu)-ezrWT*TJG-`VU~IiC+aG=SeIq!0LATCmxb&H
z>)^z6f1E-yVo)(|_z_|J%N($_#2rU34xE?7bVs;S&Y%<^Fo(RxoZE33CmNxZM~~Q_
zxYP;q9%M^<e5_xN8zxnT32GJzOSuD&=eEuI+Ksj2*!kJ{d5uOqIYIs|BX+EgT^z!H
zXvNXzw3hr~+wnpyRl7uZmiLlW1#08v#Q?}bpj!d*6_EQ_G<M)`AENX+3F>XG={xUt
zH1?0qt8tssl)0=|i9dSw7wu(WH9nUVOvfdU@gY2;gue7icCL^2ZpxD=V|X@bC*fqo
z#*oNx&Wnk#di;qddW_D1&fgBrVxjdr^q7R>VkGo`<L6N85gVxzTas`J#v02+#%`W8
zd0Xl5+xgsN(%@D{5tahIIJK-MANKDzQH${<lTa8{hJ9(<iq-+!;b(qZjd$T{>l!g4
zrT&kZ^rE+TorDlG9oJXqMxRW)fL}N^P-+SIYqdq9H^L239xr5cJqEU#=ab)_e6XJ}
z&?)xZT~_Ci^M}yT&;a&}Nu~9R7wlC;zWBGlUaX%7VD19hTr#qhMn92}!1~a2-E?qp
zh+z+1p`eH&Imn+b!4|MVC{Ar^gaN2`Ou24z<qoxZsIuCkz`NP$TfH+f$-5i$!;70P
z12UeA$|A-oWS`7)m&_?q{O?(vlwzz~`JbipAyiY*HrCc8z_b(iH{En(%ins9!kd+5
zVq@AAQ7Qt#b!aX=?{lC5-2%qnOw-BVu2SdA3j01fMSsLWGNEUZd#51}A#CflB}-#a
z?n9V}hUIt18ybmgCf(IoBs|6tW$o?FXj)~V^2r3S_xO3wvBc)_=Bk!FpHQ3D5Lf4q
zXEoWcehhEP2w1rMs+#i`51t}@04M9Qxq?s3?AQExw*BIt?JJf={yxPR9hNGqkpSMW
zq$Dqka~&JaN8ZOgZKOd6kQpdbu|6FjGg?zMv-kZC>e(Q3cYm<hN1FdKVK{t=X4<`e
zcaG&589drS>>FQ<z_Lzr&-~=wTV#Q<yinw;EY^<?)?VbY_EkYFrd}*?kw-+&AabF5
zpYjdmK480v)g5#LUp!BCtbJQl%}N&n06Qtql?yxe%ST1bnC|WXvX^T^B_sQ#)3l@1
zY#e{GNo`d4UZ>ZeJkp`N9dxRVMFJ!S0$C0mquJ|K9{#oqG%jSbW;n4SiQXX!70-qz
zh`W~peRB<(6{$$ntMsH#DqTN<+3}yk<uZmtX7^hw48r!(92@1ndjH)^UVK0nhWqtK
zfCC-RX$f9eM#S6rQmB3@#v)5bJ2yA)=;z7294|Lm=}*7C6B>>kmj&JJo!(D&lkb%+
zT+YL#*gjr`YUtsDby0_Pws;z|@sB~)!t<HMDtT6mlpmgWf^9#VBbaZ&QVM6L-(Mz|
ziE})Cn5cUz;jhng>n!GOVT|>YxHLGma(fmxSCtT~V4H7=>bEi<MAg;Rb#Z42Clj<M
z@IQ|)^H~_{VK8Nbo4hr=7h?NS9bpd=LHDNtG?}1&(LGv{m0h3$>xnCY&$)XDLLzCZ
z2=%T>n|iP(+agvALuix}23krytD~rNFq@nz48J-ZHWj%Ua#UNW-m%aJ7%gHgE)O{=
zZYY0cYHsf8Y*I@FJLV)e&Ii)~-a=oEZQtU#qJE)bl0$7;_ZXc}SfqGEHW%Ye3(NV@
z7EYs*YT*#wG$E-6#bpr>mwjFtdbHh3DJw`~G!yxw44#Q6t>)<Y5%5;#w2dfjQnU`y
z(M+-NbGvC;Js07=R>T%%o&6g0R)&;?^v0BW?L_b36DGj%d3LePvJ}Ks5VEKJ%Q<&M
zGV=W2ITUWI8M-h`#VaN)o%!NqDb|Nx;Q%mzPP*vBB78hrUk=XRdYI39VRwJ%5i35d
zc7ixbHh;R6SU5Yf^v0CM3{RF~Gth89V7+;_F;7TnYRY4|s)c2DHzl0olgW*IeHLqY
z=ZIcb842n^9iG#-g%c3^e-dm@4xe57fjVzjw?@*ii1O%1%(XlhQ&LK?Z1D$r+|tSJ
z%E{cqr6rJykS&*IxPbP3PKb|WBnS1%0P4fDROEw67xsbcBAbH%(_Ts85(pJb)P%-)
zPoCSAedAQ+sfy>@C!9FoDFYNHD2cx-47K}WW|(B{7J9Q_8z*)*WPPB6YT(N*OZe{H
z*0T*(z_eg5kXEjqik)6+F1+|t?z#L;HE^rG_5`PNaqqFYxn_lN3^7<tLMpJE9*WFG
zeaO*Z^;7U5CbMl&6pJ|2W*?fA%SxM=i7=z4{2U|!(~S#1`vLdmPRKz?N8D^L#RlH*
zAUM=c!Yr_gve)-wkH3RdY4K!Ly5kiv4hfe+`*xWUYqELbyrYp^X=!PI8TUW>F9_a1
z_&&_9b1K5}87+eZVOVFQ+L@rkKGxHMSgr+^xd)9dCMecEub-&`Z@f6_74DrdA$Lzh
z6ccc<+qiPYL&U|JCc$g<C+h*F0*8Dcv@eCb?{uHAdzMo5_Gxvwx6ZA!ptr^%p*c{A
z|3otZBZ8x^iyg?iemT9~jlEO(ci8Jh=$Of^7Sal4cKjU6f@!XQOXURdSV#Y<Gh0F`
z#&lUA83Vn}*ZB?U{$tlNp$zMJY+-?MqNBQOJN})(-FC%q5x7EXGUY5c{*X4qzQj<N
zW6+^i7Absoc{K#;?>QU1>o{v@yAjO$!+w(;jY?U|p^BEi&#H447Kdl-o8Jy@X<&fR
zzxY{SY?OH$L92KEr1<r<HI$6-OeT~~ZG4CQ*+nK`(_}v{=+aRNWCavKgHJ{LV<2Hs
zmHsaXR(AK?`e{z@03N|pqG2?Wq>9Kz6)0h#(qKLqc9F6%8sNF~^j_9`6MD90gkO{q
zzM;0kO**~%Ri$Zl(Ws-1{UJp`*qM{3sG+DSw2v=cNz?X+M#&rJp0;*M-qa;bCrvR{
z&HcFzkU?pgKbK?zOedr1a$_m;|56zh@D2B4+_w@|zK%QByPzuiZl{aOUtc(d9G|j)
z)R&rZ6}c-i-|ZxLFh%3*MRV@uoO*3@{G~Q@zyJj(jCfhFEcO{&5(P+DZ@fSdgWZ0-
z654W`p_N&!<^Z>tsh}kJptt=K`zm*=*TJRhkbiV)k*>KYY|Du}hb~n!s%-Rkv`>30
zuAA!-iWf{e-H?>%_WP`v1;jzRv%DqG-lf!?!&bSGQ<m;)*`frr()i`qfU?{T>tJ`z
zk*X%1X<JSi_&sU!^=`Od0?ZuPDx$%3gF>y()!KuFV<TZ0Fk;qx`4VX%Ds9ZbTEq|>
ziN32@oL}W3eXjIKHT-vuXoh#9_|2Fr+t4ZeJryPShvE+Qn*)iX*Iy@G+l)kSQX7w-
zA>*3#%Nx<3U>P9`N^$@NIE1p#xzqR9kTBbV(@u<w4KGZ}@k+lokJ>Y8TsLB0UNixl
zp0%ZsL(x3uq0&+>pMgM8>)#z}bAL*rq#GOWl`r5B1e)ZP5dh!Xi10qi!D@g;By;t?
zRwcxzsq&FO2`$u3`mf{HcFR4QQaiY&2g&xuZ2eKKR2{d*SdxwSqlQCBz1F1Uef{2c
z?^^u&p~5z&Z8T5Z+eEi{14J9@LFj;ATiMDVeX+8VDQ;yo@h|$!8AJLv6G|5ZFkz!Z
zc63bz=WkWK1aif7RPL}Tv81#Y)<3tN!dYY0RABSEsed$zEs%?vI}Pl@rU|dnyi1Iy
zA-muE2M_=5)}VT&4k8yvwNa_vUG!Vm1_x1A!v8r=I-4&@Lx|EgqA6<Pv5!PLB_$yg
zQTaY}5HF7F(SI|R)SYvc?B=;SWuf`#oQf$TeK?Q&!>9d3lx-}ZsB^PheqwaU!?eLk
zZ*5G{CxDKlcV8h~-P~|L2*o@Z58ew3(<SXOWxQIMrR*}imne|_h3nfcK^K3<Ua@oA
zh@&v?6Sf#U^6wyk4!JtQ4e9iCLp^7Ew+Q8X`hy@5e)tk>3G&2gF(R&-$DN018`z)e
zE$?VmPILp7+nu!HC!dy0!w*dXNAI-&RmcK2=L4DafxlNv@2;LVQD;05+doygbJF2;
zLrG!4yuujR3te4Z_1sxhv1mP@APo?Ec)P|z7#6Y>W%r(2Xz8)2Tq$u@@?D<D!zQMd
zRexNAn=sV(p{45t5t_<Rr%Kiyiz+>-SYO}O;m#Uq3-`_gMNnVrv1uASOe~slwQ+Ky
z>Nqs-h}Pr|g-umI>)Y56ksprQKL70YA}B0O(Tk&e=Oxu#r0m5WloqGXRZ$tEkT=wJ
zFs3s-?`~z|&6elmI?>n(?+GkTtoTtQ^kHH{q;%}E6Mpu4W5*n&J^*eL-lST<V=Oz<
zZ<~6qkL7;8PbYs*SuvAx93i!#=RN$gN3awYzE{!l2FCsQ!PD=QnF>oT779P$a&L*a
zN54@O_9(<z)Ri}|hb3mxf6pmrGI%3*_>3D)9Y_rJ4a<w+o0;11m8uf_X!yZ|88KlT
r+9C@sfs;NSlFcrCN$gNvxLlwXv#1NAto;Y<=YzD>_0_77R+0Y)ex9Hd

literal 0
HcmV?d00001

diff --git a/gemp-lotr/gemp-lotr-web/src/main/webapp/images/vitality.png b/gemp-lotr/gemp-lotr-web/src/main/webapp/images/vitality.png
new file mode 100644
index 0000000000000000000000000000000000000000..6ea82c8e15d27597fde2d20363398809593ce45d
GIT binary patch
literal 5699
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

literal 0
HcmV?d00001

diff --git a/gemp-lotr/gemp-lotr-web/src/main/webapp/js/gameAnimations.js b/gemp-lotr/gemp-lotr-web/src/main/webapp/js/gameAnimations.js
index 72c99e889..2e92713d7 100644
--- a/gemp-lotr/gemp-lotr-web/src/main/webapp/js/gameAnimations.js
+++ b/gemp-lotr/gemp-lotr-web/src/main/webapp/js/gameAnimations.js
@@ -710,7 +710,9 @@ var GameAnimations = Class.extend({
         $("#main").queue(
                 function(next) {
                     $(".cardStrength").css({display: "none"});
+                    $(".cardStrengthBg").css({display: "none"});
                     $(".cardVitality").css({display: "none"});
+                    $(".cardVitalityBg").css({display: "none"});
                     $(".cardSiteNumber").css({display: "none"});
                     $(".cardResistance").css({display: "none"});
 
@@ -721,7 +723,9 @@ var GameAnimations = Class.extend({
                             var cardStats = charStatsArr[i].split("=");
                             var cardDiv = $(".card:cardId(" + cardStats[0] + ")");
                             var cardStatArr = cardStats[1].split("|");
+                            $(".cardStrengthBg", cardDiv).css({display: ""});
                             $(".cardStrength", cardDiv).html(cardStatArr[0]).css({display: ""});
+                            $(".cardVitalityBg", cardDiv).css({display: ""});
                             $(".cardVitality", cardDiv).html(cardStatArr[1]).css({display: ""});
                             if (cardStatArr.length > 2) {
                                 if (cardStatArr[2].indexOf("R") == 0) {
diff --git a/gemp-lotr/gemp-lotr-web/src/main/webapp/js/gameUi.js b/gemp-lotr/gemp-lotr-web/src/main/webapp/js/gameUi.js
index fd5c8226d..219c9ffa2 100644
--- a/gemp-lotr/gemp-lotr-web/src/main/webapp/js/gameUi.js
+++ b/gemp-lotr/gemp-lotr-web/src/main/webapp/js/gameUi.js
@@ -1032,10 +1032,18 @@ var GempLotrGameUI = Class.extend({
 
         var tokenOverlay = $(".tokenOverlay", cardDiv);
 
+        var cardStrengthBgDiv = $("<div class='cardStrengthBg'><img src='images/strength.png' width='100%' height='100%'></div>");
+        cardStrengthBgDiv.css({display: "none"});
+        tokenOverlay.append(cardStrengthBgDiv);
+
         var cardStrengthDiv = $("<div class='cardStrength'></div>");
         cardStrengthDiv.css({display: "none"});
         tokenOverlay.append(cardStrengthDiv);
 
+        var cardVitalityBgDiv = $("<div class='cardVitalityBg'><img src='images/vitality.png' width='100%' height='100%'></div>");
+        cardVitalityBgDiv.css({display: "none"});
+        tokenOverlay.append(cardVitalityBgDiv);
+
         var cardVitalityDiv = $("<div class='cardVitality'></div>");
         cardVitalityDiv.css({display: "none"});
         tokenOverlay.append(cardVitalityDiv);
@@ -1057,16 +1065,27 @@ var GempLotrGameUI = Class.extend({
 
                 var size = 0.0865 * maxDimension;
 
-                var x = 0.09255 * maxDimension - size / 2;
-                var strengthY = 0.67203 * maxDimension - size / 2;
-                var vitalityY = 0.79074 * maxDimension - size / 2;
+                var x = 0.09 * maxDimension - size / 2;
+                var strengthY = 0.678 * maxDimension - size / 2;
+                var vitalityY = 0.795 * maxDimension - size / 2;
                 var minionSiteNumberY = 0.89135 * maxDimension - size / 2;
 
-                var fontPerc = (size * 7) + "%";
+                var fontPerc = (size * 6) + "%";
                 var borderRadius = Math.ceil(size / 5) + "px";
 
-                $(".cardStrength", cardElem).css({position: "absolute", "border-radius": borderRadius, "font-size": fontPerc, left: x + "px", top: strengthY + "px", width: size, height: size});
-                $(".cardVitality", cardElem).css({position: "absolute", "border-radius": borderRadius, "font-size": fontPerc, left: x + "px", top: vitalityY + "px", width: size, height: size});
+                var strBgX = 0.03800 * maxDimension;
+                var strBgY = 0.60765 * maxDimension;
+                var strBgWidth = 0.1624 * width;
+                var strBgHeight = 0.1650 * height;
+
+                var vitBgX = 0.0532 * width;
+                var vitBgY = 0.7465 * height;
+                var vitalityBgSize = 0.105 * height;
+
+                $(".cardStrengthBg", cardElem).css({position: "absolute", left: strBgX + "px", top: strBgY + "px", width: strBgWidth, height: strBgHeight});
+                $(".cardStrength", cardElem).css({position: "absolute", "font-size": fontPerc, left: x + "px", top: strengthY + "px", width: size, height: size});
+                $(".cardVitalityBg", cardElem).css({position: "absolute", left: vitBgX + "px", top: vitBgY + "px", width: vitalityBgSize, height: vitalityBgSize});
+                $(".cardVitality", cardElem).css({position: "absolute", "font-size": fontPerc, left: x + "px", top: vitalityY + "px", width: size, height: size});
                 $(".cardSiteNumber", cardElem).css({position: "absolute", "border-radius": borderRadius, "font-size": fontPerc, left: x + "px", top: minionSiteNumberY + "px", width: size, height: size});
                 $(".cardResistance", cardElem).css({position: "absolute", "border-radius": borderRadius, "font-size": fontPerc, left: x + "px", top: minionSiteNumberY + "px", width: size, height: size});
             }