From 4e185873d98f087f3e209f80fa361d24b905ffda Mon Sep 17 00:00:00 2001
From: marcins78 <marcins78@eb7970ca-0f6f-de4b-2938-835b230b9d1f>
Date: Thu, 22 Nov 2012 11:56:23 +0000
Subject: [PATCH] Changing the look and how the replay button works.

---
 .../gemp-lotr-web/src/main/webapp/game.html   |   3 ++
 .../src/main/webapp/images/pause.png          | Bin 0 -> 781 bytes
 .../src/main/webapp/js/gemp-011/gameUi.js     |  29 ++++++++++++------
 3 files changed, 22 insertions(+), 10 deletions(-)
 create mode 100644 gemp-lotr/gemp-lotr-web/src/main/webapp/images/pause.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 851cb3822..5055df7da 100644
--- a/gemp-lotr/gemp-lotr-web/src/main/webapp/game.html
+++ b/gemp-lotr/gemp-lotr-web/src/main/webapp/game.html
@@ -309,6 +309,9 @@ body {
     padding-bottom: 2px;
 }
 
+.ui-icon-custom-play { background-image: url(images/play.png); }
+.ui-icon-custom-pause { background-image: url(images/pause.png); }
+
 </style>
 <link rel="stylesheet" type="text/css" href="css/dark-hive/jquery-ui-1.8.16.custom.css">
 <link rel="stylesheet" type="text/css" href="css/jquery.contextMenu.css">
diff --git a/gemp-lotr/gemp-lotr-web/src/main/webapp/images/pause.png b/gemp-lotr/gemp-lotr-web/src/main/webapp/images/pause.png
new file mode 100644
index 0000000000000000000000000000000000000000..564d495ac285f857f5801694f6b948e383f578b7
GIT binary patch
literal 781
zcmV+o1M>WdP)<h;3K|Lk000e1NJLTq003kF003kN1^@s6aN?Cz00001b5ch_0Itp)
z=>Px#24YJ`L;wH)0002_L%V+f000SaNLh0L01FcU01FcV0GgZ_00007bV*G`2iyx5
z3nVyxHTi!400NCkL_t(|+U=dej>RAdMGNWw|FW~6OggrrT=cMhiNf)M`r2|`7=~dO
z_RXxyL|bcZ$Wb!`NFso$fb0|iRRG!PAk@GZAhf_(MG(EgS~*rZAS1zv3W~xU(t&&l
z!Ybz#=VnR{XXS0Bd76TgDqBv4IU69fe6S2hs$64a_+u+4Uj;;_Zw3r49}O5<zS_(Q
z?gC<^-=+@ZzeV|bn76-I^WUfJr8iZ^3Liasb({dB$Jej-W)2K3DEF)r?3Y?$W<6uP
zh2EZO%<M(fT5E5{@D(d1s(_zRPdq{$C#I@dsmqmC2RpA$AgyXHDR#;qRtV~dkBOrW
zEtR-}I(B0|5*tSyS}O5ub?mCH@XN(Y>Zm5<r`URBb^L~+2Ifnw{KBNncTmSpJ1%E;
zrBz2rS(Q^3CIp1~v8IkV^+T(Ukg}*D94Lo@oKQbzL+OnnDN9T(07*~_Knke^AYy6(
zh!_-r^zD$Ajdc@l4G;hk13}6XgwYM;gbPPAn+l^hhBu1Px)ma2iJAYgV)!F!ojUEa
zLipoqe*GY2RY+NwAQ0+EPW^bT5bDU>`mtTg+CkVpoA?f=>{aS`1X8A(KtWYJ#nxAm
zr*;ISEOuLK)iG4mQOTUx_$W~<P94MBUQ`kv6CNcMQb)+a5S7HnBIJdgfDUT1hr0+E
zDPNR3St*ge-!E6Pt!`%*(X}Y^WFPWcbXMv*IaLj%ETGJR5n4k|gEGrUKE^NRH|;9K
ze5Ij_n2)qP67!9wU}FBzHc!k48cT}Jnbxb<A+1+O4p1~F7C+h2zFYjtfd==YV5SBp
zsh*|pZq&eJ@A#Cy;oeRLAqQkNAk{-@nY*Qc2Pt@z3Bxc9+uD8rXyV|lsLY}k00000
LNkvXXu0mjflgUld

literal 0
HcmV?d00001

diff --git a/gemp-lotr/gemp-lotr-web/src/main/webapp/js/gemp-011/gameUi.js b/gemp-lotr/gemp-lotr-web/src/main/webapp/js/gemp-011/gameUi.js
index 0b25b18c2..2a60e75d2 100644
--- a/gemp-lotr/gemp-lotr-web/src/main/webapp/js/gemp-011/gameUi.js
+++ b/gemp-lotr/gemp-lotr-web/src/main/webapp/js/gemp-011/gameUi.js
@@ -68,6 +68,7 @@ var GempLotrGameUI = Class.extend({
     tabPane:null,
 
     animations:null,
+    replayPlay: false,
 
     init:function (url, replayMode) {
         this.replayMode = replayMode;
@@ -115,14 +116,15 @@ var GempLotrGameUI = Class.extend({
                 });
             replayDiv.append(slowerBut);
             replayDiv.append(fasterBut);
-            replayDiv.append("<input type='checkbox' id='replayButton' /><label id='replayBut' for='replayButton'><img src='images/play.png' width='50' height='50'/></label>");
+            var replayBut = $("<button id='replayButton'></button>").button({ icons: {primary:'ui-icon-custom-play'}});
+            replayDiv.append(replayBut);
+
             $("#main").append(replayDiv);
             replayDiv.css({"z-index":1000});
-            $("#replayButton").button();
-            $("#slowerButton").css({position:"absolute", left: "0px", top: "0px", width: "25px", height: "25px", margin: "0px"});
-            $("#fasterButton").css({position:"absolute", left: "25px", top: "0px", width: "25px", height: "25px", margin: "0px"});
-            $("#replayButton").css({position:"absolute", left: "0px", top: "25px", width: "50px", height: "50px", margin: "0px"});
-            $("#replayBut").css({position:"absolute", left: "0px", top: "25px", width: "50px", height: "50px", margin: "0px"});
+
+            $("#slowerButton").css({position:"absolute", left: "0px", top: "0px", width: "25px", height: "25px"});
+            $("#fasterButton").css({position:"absolute", left: "25px", top: "0px", width: "25px", height: "25px"});
+            $("#replayButton").css({position:"absolute", left: "0px", top: "25px", width: "50px", height: "50px"});
         }
 
         this.shadowAssignGroups = {};
@@ -921,9 +923,16 @@ var GempLotrGameUI = Class.extend({
             this.replayGameEvents = root.getElementsByTagName("ge");
             this.replayGameEventNextIndex = 0;
 
-            $("label", $(".replay")).click(
-                function () {
-                    that.playNextReplayEvent();
+            $("#replayButton").click(
+                function() {
+                    if (that.replayPlay) {
+                        that.replayPlay = false;
+                        $("#replayButton").button("option", {primary:'ui-icon-custom-play'});
+                    } else {
+                        that.replayPlay = true;
+                        $("#replayButton").button("option", {primary:'ui-icon-custom-pause'});
+                        that.playNextReplayEvent();
+                    }
                 });
 
             this.playNextReplayEvent();
@@ -931,7 +940,7 @@ var GempLotrGameUI = Class.extend({
     },
 
     shouldPlay:function () {
-        return $("label", $(".replay")).hasClass("ui-state-active");
+        return this.replayPlay;
     },
 
     playNextReplayEvent:function () {