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 43e2172b0..7c1650821 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 @@ -121,7 +121,7 @@ var GempLotrGameUI = Class.extend({ this.specialGroup = new NormalCardGroup(this.cardActionDialog, function(card) { return (card.zone == "SPECIAL"); }, false); - this.specialGroup.setBounds(this.padding, this.padding, this.cardActionDialog.width() + 20, this.cardActionDialog.height() + 20); + this.specialGroup.setBounds(this.padding, this.padding, 580 - 2 * (this.padding), 250 - 2 * (this.padding)); this.gameStateElem = $("
"); this.gameStateElem.css({"border-radius": "7px"}); @@ -129,16 +129,7 @@ var GempLotrGameUI = Class.extend({ this.gameStateElem.append("Players:
"); for (var i = 0; i < this.allPlayerIds.length; i++) { this.gameStateElem.append("
" + this.allPlayerIds[i] + "
"); - this.gameStateElem.append("Deck:
Hand:
Discard:
Dead pile:
"); - if (!this.spectatorMode) - $("#discard" + i).click( - function() { - that.discardPileDialogs[this.allPlayerIds[i]].dialog("open"); - }); - $("#deadPile" + i).click( - function() { - that.deadPileDialogs[this.allPlayerIds[i]].dialog("open"); - }); + this.gameStateElem.append("
"); } this.gameStateElem.append("
"); @@ -155,6 +146,22 @@ var GempLotrGameUI = Class.extend({ $("#main").append(this.gameStateElem); + for (var i = 0; i < this.allPlayerIds.length; i++) { + if (!this.spectatorMode) + $("#discard" + i).addClass("clickable").click( + (function(index) { + return function() { + that.discardPileDialogs[that.allPlayerIds[index]].dialog("open"); + }; + })(i)); + $("#deadPile" + i).addClass("clickable").click( + (function(index) { + return function() { + that.deadPileDialogs[that.allPlayerIds[index]].dialog("open"); + }; + })(i)); + } + this.alert = $("
"); this.alert.css({"border-radius": "7px"}); $("#main").append(this.alert); @@ -235,21 +242,21 @@ var GempLotrGameUI = Class.extend({ initializeDialogs: function() { this.smallDialog = $("
") .dialog({ - autoOpen: false, - closeOnEscape: false, - resizable: false, - width: 400, - height: 200 - }); + autoOpen: false, + closeOnEscape: false, + resizable: false, + width: 400, + height: 200 + }); this.cardActionDialog = $("
") .dialog({ - autoOpen: false, - closeOnEscape: false, - resizable: true, - width: 600, - height: 300 - }); + autoOpen: false, + closeOnEscape: false, + resizable: true, + width: 600, + height: 300 + }); var that = this; @@ -261,15 +268,15 @@ var GempLotrGameUI = Class.extend({ this.infoDialog = $("
") .dialog({ - autoOpen: false, - closeOnEscape: true, - resizable: true, - title: "Card information", - minHeight: 80, - minWidth: 200, - width: 600, - height: 300 - }); + autoOpen: false, + closeOnEscape: true, + resizable: true, + title: "Card information", + minHeight: 80, + minWidth: 200, + width: 600, + height: 300 + }); var swipeOptions = { threshold: 20, @@ -378,6 +385,14 @@ var GempLotrGameUI = Class.extend({ this.gameStateElem.css({ position: "absolute", left: padding * 2 + advPathWidth, top: padding, width: specialUiWidth - padding, height: height - padding * 4 - alertHeight - chatHeight}); this.alert.css({ position: "absolute", left: padding * 2 + advPathWidth, top: height - (padding * 2) - alertHeight - chatHeight, width: specialUiWidth - padding, height: alertHeight }); + + for (var playerId in this.discardPileGroups) + if (this.discardPileGroups.hasOwnProperty(playerId)) + this.discardPileGroups[playerId].layoutCards(); + + for (var playerId in this.deadPileGroups) + if (this.deadPileGroups.hasOwnProperty(playerId)) + this.deadPileGroups[playerId].layoutCards(); } this.tabPane.css({ position: "absolute", left: padding, top: height - padding - chatHeight, width: specialUiWidth + advPathWidth - padding, height: chatHeight - padding}); this.chatBox.setBounds(4, 4 + 25, specialUiWidth + advPathWidth - 8, chatHeight - 8 - 25); @@ -535,13 +550,13 @@ var GempLotrGameUI = Class.extend({ var count = element.getAttribute("count"); if (zone == "HAND") - $("#hand" + this.getPlayerIndex(playerId)).text("" + count); + $("#hand" + this.getPlayerIndex(playerId)).text("Hand: " + count); else if (zone == "DISCARD") - $("#discard" + this.getPlayerIndex(playerId)).text("" + count); + $("#discard" + this.getPlayerIndex(playerId)).text("Discard: " + count); else if (zone == "DEAD") - $("#deadPile" + this.getPlayerIndex(playerId)).text("" + count); - else if (zone == "DECK") - $("#deck" + this.getPlayerIndex(playerId)).text("" + count); + $("#deadPile" + this.getPlayerIndex(playerId)).text("Dead pile: " + count); + else if (zone == "DECK") + $("#deck" + this.getPlayerIndex(playerId)).text("Deck: " + count); }, playerPosition: function(element) { @@ -695,7 +710,7 @@ var GempLotrGameUI = Class.extend({ if (index != -1) cardData.attachedCards.splice(index, 1); } - ); + ); var card = $(".card:cardId(" + cardId + ")"); var cardData = card.data("card"); @@ -761,8 +776,10 @@ var GempLotrGameUI = Class.extend({ return true; }, false); + this.discardPileGroups[participantId].setBounds(this.padding, this.padding, 580 - 2 * (this.padding), 250 - 2 * (this.padding)); + discardPileDialog.bind("dialogresize", function() { - that.dialogResize(discardPileDialog, this.discardPileGroups[participantId]); + that.dialogResize(discardPileDialog, that.discardPileGroups[participantId]); }); } @@ -782,9 +799,11 @@ var GempLotrGameUI = Class.extend({ return true; }, false); + this.deadPileGroups[this.allPlayerIds[i]].setBounds(this.padding, this.padding, 580 - 2 * (this.padding), 250 - 2 * (this.padding)); + deadPileDialog.bind("dialogresize", (function(dialog, index) { return function() { - that.dialogResize(dialog, this.deadPileGroups[this.allPlayerIds[index]]); + that.dialogResize(dialog, that.deadPileGroups[that.allPlayerIds[index]]); } })(deadPileDialog, i)); } @@ -812,7 +831,7 @@ var GempLotrGameUI = Class.extend({ if (index != -1) cardData.attachedCards.splice(index, 1); } - ); + ); } card.remove(); @@ -884,13 +903,13 @@ var GempLotrGameUI = Class.extend({ this.smallDialog .html(text + "
") .dialog("option", "buttons", - { - "OK": function() { - $(this).dialog("close"); - that.decisionFunction(id, $("#integerDecision").val()); - } - } - ); + { + "OK": function() { + $(this).dialog("close"); + that.decisionFunction(id, $("#integerDecision").val()); + } + } + ); $("#integerDecision").SpinnerControl({ type: 'range', typedata: { @@ -922,13 +941,13 @@ var GempLotrGameUI = Class.extend({ this.smallDialog .html(html) .dialog("option", "buttons", - { - "OK": function() { - $(this).dialog("close"); - that.decisionFunction(id, $("#multipleChoiceDecision").val()); - } - } - ); + { + "OK": function() { + $(this).dialog("close"); + that.decisionFunction(id, $("#multipleChoiceDecision").val()); + } + } + ); this.smallDialog.dialog("open"); }, @@ -1161,8 +1180,6 @@ var GempLotrGameUI = Class.extend({ this.attachSelectionFunctions(cardIds); - this.specialGroup.setBounds(10, 10, 547, 188); - $(".ui-dialog-titlebar").show(); this.cardActionDialog.dialog("open"); }, @@ -1340,8 +1357,8 @@ var GempLotrGameUI = Class.extend({ }, dialogResize: function(dialog, group) { - var width = dialog.width() + 20; - var height = dialog.height() + 20; + var width = dialog.width() + 10; + var height = dialog.height() + 10; group.setBounds(this.padding, this.padding, width - 2 * this.padding, height - 2 * this.padding); }, diff --git a/gemp-lotr/todo.txt b/gemp-lotr/todo.txt index d8fd303eb..7c56ea3fa 100644 --- a/gemp-lotr/todo.txt +++ b/gemp-lotr/todo.txt @@ -5,7 +5,6 @@ multiple choices required. Next priority: 25. Remove all non-essencial alerts, instead add warnings to chat panel. -13. Add dead/discard pile displays. 24. The events that are played and cards affected should be shown to the players briefly using animations to make it aestheticly pleasing. 30. Watching game replay after it's finished and sharing the game replay with others via code. @@ -48,3 +47,4 @@ with Filters.sameCard(...) filter. 14. Add hand/deck card count displays. 16. Add an option to watch an ongoing game (spectator). 26. The game area should display chat from the start. +13. Add dead/discard pile displays.