From af91e6b7ed9fe0f05c3ee82de121238cdba5336e Mon Sep 17 00:00:00 2001
From: "marcins78@gmail.com"
 <marcins78@gmail.com@eb7970ca-0f6f-de4b-2938-835b230b9d1f>
Date: Thu, 22 Nov 2012 14:10:08 +0000
Subject: [PATCH] Making replay nicer.

---
 .../gemp-lotr-web/src/main/webapp/game.html   |  3 ---
 .../src/main/webapp/js/gemp-011/gameUi.js     | 19 +++++++++----------
 2 files changed, 9 insertions(+), 13 deletions(-)

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 5055df7da..851cb3822 100644
--- a/gemp-lotr/gemp-lotr-web/src/main/webapp/game.html
+++ b/gemp-lotr/gemp-lotr-web/src/main/webapp/game.html
@@ -309,9 +309,6 @@ 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/js/gemp-011/gameUi.js b/gemp-lotr/gemp-lotr-web/src/main/webapp/js/gemp-011/gameUi.js
index 2a60e75d2..27dbe7c2b 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
@@ -104,8 +104,8 @@ var GempLotrGameUI = Class.extend({
 
         if (this.replayMode) {
             var replayDiv = $("<div class='replay' style='position:absolute'></div>");
-            var slowerBut = $( "<button id='slowerButton'></button>" ).button({ icons: {primary:'ui-icon-triangle-1-w'}});
-            var fasterBut = $( "<button id='fasterButton'></button>" ).button({ icons: {primary:'ui-icon-triangle-1-e'}});
+            var slowerBut = $( "<button id='slowerButton'>Slower</button>" ).button({ icons: {primary:'ui-icon-triangle-1-w'}, text: false});
+            var fasterBut = $( "<button id='fasterButton'>Faster</button>" ).button({ icons: {primary:'ui-icon-triangle-1-e'}, text: false});
             slowerBut.click(
                 function() {
                     that.animations.replaySpeed = Math.min(2, that.animations.replaySpeed+0.2);
@@ -116,15 +116,14 @@ var GempLotrGameUI = Class.extend({
                 });
             replayDiv.append(slowerBut);
             replayDiv.append(fasterBut);
-            var replayBut = $("<button id='replayButton'></button>").button({ icons: {primary:'ui-icon-custom-play'}});
+            replayDiv.append("<br/>");
+
+            var replayBut = $("<img id='replayButton' src='images/play.png' width='64' height='64'>").button();
+//            var replayBut = $("<button id='replayButton'>Play/Pause</button>").button({ icons: {primary:'ui-icon-custom-play'}, text: false}).css({width: "65px", height: "65px"});
             replayDiv.append(replayBut);
 
             $("#main").append(replayDiv);
             replayDiv.css({"z-index":1000});
-
-            $("#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 = {};
@@ -859,7 +858,7 @@ var GempLotrGameUI = Class.extend({
         this.chatBox.setBounds(4, 4 + 25, specialUiWidth + advPathWidth - 8, chatHeight - 8 - 25);
 
         if (this.replayMode) {
-            $(".replay").css({position:"absolute", left:width - 50 - 4 - padding, top:height - 75 - 2 - padding, width:50, height:75, "z-index":1000});
+            $(".replay").css({position:"absolute", left:width - 66 - 4 - padding, top:height - 97 - 2 - padding, width:66, height:97, "z-index":1000});
         }
     },
 
@@ -927,10 +926,10 @@ var GempLotrGameUI = Class.extend({
                 function() {
                     if (that.replayPlay) {
                         that.replayPlay = false;
-                        $("#replayButton").button("option", {primary:'ui-icon-custom-play'});
+                        $("#replayButton").attr("src", "images/play.png");
                     } else {
                         that.replayPlay = true;
-                        $("#replayButton").button("option", {primary:'ui-icon-custom-pause'});
+                        $("#replayButton").attr("src", "images/pause.png");
                         that.playNextReplayEvent();
                     }
                 });