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 ddc7e193d..714d92019 100644
--- a/gemp-lotr/gemp-lotr-web/src/main/webapp/game.html
+++ b/gemp-lotr/gemp-lotr-web/src/main/webapp/game.html
@@ -2,201 +2,211 @@
"http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
- Gemp-LotR
-
-
+Gemp-LotR
+
+
-
-
-
-
+ .clock {
+ float: right;
+ font-size: 100%;
+ }
-
-
-
-
-
+ .ui-button-text-only .ui-button-text {
+ font-size: 70%;
+ padding: .2em .5em;
+ }
+
+
+
+
-
-
-
-
-
-
-
-
+
+
+
+
+
-
+
+
+
+
+
+
+
- // TODO: delete - Only for debugging
- function getUrlParam(param) {
- var search = window.location.search.substring(1);
- if (search.indexOf('&') > -1) {
- var params = search.split('&');
- for (var i = 0; i < params.length; i++) {
- var key_value = params[i].split('=');
- if (key_value[0] == param) return key_value[1];
- }
- } else {
- var params = search.split('=');
- if (params[0] == param) return params[1];
+
+
+ ui.layoutUI(true);
+
+ if (replay == null)
+ ui.startGameSession();
+ else
+ ui.startReplaySession(replay);
+ });
+
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 8c670aae1..1406ab23a 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
@@ -67,40 +67,40 @@ var GameAnimations = Class.extend({
var cardWidth = card.getWidthForHeight(cardHeight);
$(cardDiv).css(
- {
- position: "absolute",
- left: (gameWidth / 2 - cardWidth / 4),
- top: gameHeight * (3 / 8),
- width: cardWidth / 2,
- height: cardHeight / 2,
- "z-index": 100,
- opacity: 0});
+ {
+ position: "absolute",
+ left: (gameWidth / 2 - cardWidth / 4),
+ top: gameHeight * (3 / 8),
+ width: cardWidth / 2,
+ height: cardHeight / 2,
+ "z-index": 100,
+ opacity: 0});
$(cardDiv).animate(
- {
- left: "-=" + cardWidth / 4,
- top: "-=" + (gameHeight / 8),
- width: "+=" + (cardWidth / 2),
- height: "+=" + (cardHeight / 2),
- opacity: 1},
- {
- duration: that.getAnimationLength(that.playEventDuration / 8),
- easing: "linear",
- queue: false,
- complete: next});
+ {
+ left: "-=" + cardWidth / 4,
+ top: "-=" + (gameHeight / 8),
+ width: "+=" + (cardWidth / 2),
+ height: "+=" + (cardHeight / 2),
+ opacity: 1},
+ {
+ duration: that.getAnimationLength(that.playEventDuration / 8),
+ easing: "linear",
+ queue: false,
+ complete: next});
}).queue(
function(next) {
setTimeout(next, that.getAnimationLength(that.playEventDuration * (5 / 8)));
}).queue(
function(next) {
$(cardDiv).animate(
- {
- opacity: 0},
- {
- duration: that.getAnimationLength(that.playEventDuration / 4),
- easing: "easeOutQuart",
- queue: false,
- complete: next});
+ {
+ opacity: 0},
+ {
+ duration: that.getAnimationLength(that.playEventDuration / 4),
+ easing: "easeOutQuart",
+ queue: false,
+ complete: next});
}).queue(
function(next) {
$(cardDiv).remove();
@@ -138,26 +138,26 @@ var GameAnimations = Class.extend({
var targetCardHeight = $(targetCard).height();
$(cardDiv).css(
- {
- position: "absolute",
- left: $(targetCard).position().left,
- top: $(targetCard).position().top,
- width: targetCardWidth,
- height: targetCardHeight,
- "z-index": 100,
- opacity: 1});
+ {
+ position: "absolute",
+ left: $(targetCard).position().left,
+ top: $(targetCard).position().top,
+ width: targetCardWidth,
+ height: targetCardHeight,
+ "z-index": 100,
+ opacity: 1});
$(cardDiv).animate(
- {
- opacity: 0,
- left: "-=" + (targetCardWidth / 2),
- top: "-=" + (targetCardHeight / 2),
- width: "+=" + targetCardWidth,
- height: "+=" + targetCardHeight},
- {
- duration: that.getAnimationLength(that.cardAffectsCardDuration),
- easing: "easeInQuart",
- queue: false,
- complete: null});
+ {
+ opacity: 0,
+ left: "-=" + (targetCardWidth / 2),
+ top: "-=" + (targetCardHeight / 2),
+ width: "+=" + targetCardWidth,
+ height: "+=" + targetCardHeight},
+ {
+ duration: that.getAnimationLength(that.cardAffectsCardDuration),
+ easing: "easeInQuart",
+ queue: false,
+ complete: null});
}
setTimeout(next, that.getAnimationLength(that.cardAffectsCardDuration));
@@ -171,7 +171,7 @@ var GameAnimations = Class.extend({
$(this).remove();
}
}
- );
+ );
next();
});
}
@@ -247,29 +247,29 @@ var GameAnimations = Class.extend({
var cardWidth = card.getWidthForHeight(cardHeight);
$(cardDiv).css(
- {
- position: "absolute",
- left: (gameWidth / 2 - cardWidth / 4),
- top: gameHeight * (3 / 8),
- width: cardWidth / 2,
- height: cardHeight / 2,
- "z-index": 100,
- opacity: 0});
+ {
+ position: "absolute",
+ left: (gameWidth / 2 - cardWidth / 4),
+ top: gameHeight * (3 / 8),
+ width: cardWidth / 2,
+ height: cardHeight / 2,
+ "z-index": 100,
+ opacity: 0});
$(cardDiv).animate(
- {
- opacity: 1},
- {
- duration: that.getAnimationLength(that.putCardIntoPlayDuration / 8),
- easing: "linear",
- step: function(now, fx) {
- layoutCardElem(cardDiv,
- (gameWidth / 2 - cardWidth / 4) - now * (cardWidth / 4),
- gameHeight * (3 / 8) - now * (gameHeight / 8),
- cardWidth / 2 + now * (cardWidth / 2),
- cardHeight / 2 + now * (cardHeight / 2), 100);
- },
- complete: next});
+ {
+ opacity: 1},
+ {
+ duration: that.getAnimationLength(that.putCardIntoPlayDuration / 8),
+ easing: "linear",
+ step: function(now, fx) {
+ layoutCardElem(cardDiv,
+ (gameWidth / 2 - cardWidth / 4) - now * (cardWidth / 4),
+ gameHeight * (3 / 8) - now * (gameHeight / 8),
+ cardWidth / 2 + now * (cardWidth / 2),
+ cardHeight / 2 + now * (cardHeight / 2), 100);
+ },
+ complete: next});
}).queue(
function(next) {
setTimeout(next, that.getAnimationLength(that.putCardIntoPlayDuration * (5 / 8)));
@@ -284,20 +284,20 @@ var GameAnimations = Class.extend({
var startHeight = cardDiv.height();
$(cardDiv).animate(
- {
- left: oldValues["left"]},
- {
- duration: that.getAnimationLength(that.putCardIntoPlayDuration / 4),
- easing: "linear",
- step: function(now, fx) {
- var state = fx.state;
- layoutCardElem(cardDiv,
- startLeft + (oldValues["left"] - startLeft) * state,
- startTop + (oldValues["top"] - startTop) * state,
- startWidth + (oldValues["width"] - startWidth) * state,
- startHeight + (oldValues["height"] - startHeight) * state, 100);
- },
- complete: next});
+ {
+ left: oldValues["left"]},
+ {
+ duration: that.getAnimationLength(that.putCardIntoPlayDuration / 4),
+ easing: "linear",
+ step: function(now, fx) {
+ var state = fx.state;
+ layoutCardElem(cardDiv,
+ startLeft + (oldValues["left"] - startLeft) * state,
+ startTop + (oldValues["top"] - startTop) * state,
+ startWidth + (oldValues["width"] - startWidth) * state,
+ startHeight + (oldValues["height"] - startHeight) * state, 100);
+ },
+ complete: next});
}).queue(
function(next) {
var cardDiv = $(".card:cardId(" + cardId + ")");
@@ -333,7 +333,7 @@ var GameAnimations = Class.extend({
if (index != -1)
cardData.attachedCards.splice(index, 1);
}
- );
+ );
var card = $(".card:cardId(" + cardId + ")");
var cardData = card.data("card");
@@ -369,12 +369,12 @@ var GameAnimations = Class.extend({
function(next) {
$(".card:cardId(" + cardRemovedIds + ")")
.animate(
- {
- opacity: 0},
- {
- duration: that.getAnimationLength(that.removeCardFromPlayDuration),
- easing: "easeOutQuart",
- queue: false});
+ {
+ opacity: 0},
+ {
+ duration: that.getAnimationLength(that.removeCardFromPlayDuration),
+ easing: "easeOutQuart",
+ queue: false});
setTimeout(next, that.getAnimationLength(that.removeCardFromPlayDuration));
});
}
@@ -399,7 +399,7 @@ var GameAnimations = Class.extend({
if (index != -1)
cardData.attachedCards.splice(index, 1);
}
- );
+ );
}
card.remove();
@@ -684,6 +684,17 @@ var GameAnimations = Class.extend({
}
$("#main").queue(
function(next) {
+ var charStrengths = element.getAttribute("charStrengths");
+ if (charStrengths != null) {
+ var charStrengthsArr = charStrengths.split(",");
+ for (var i = 0; i < charStrengthsArr.length; i++) {
+ var cardStrength = charStrengthsArr[i].split("=");
+ var cardDiv = $(".card:cardId(" + cardStrength[0] + ")");
+ cardDiv.data("card").strength = cardStrength[1];
+ $(".cardStrength", cardDiv).html(cardStrength[1]).css({display: ""});
+ }
+ }
+
var playerZones = element.getElementsByTagName("playerZones");
for (var i = 0; i < playerZones.length; i++) {
var playerZone = playerZones[i];
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 1d498c5cc..f7bdbc4c0 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
@@ -292,21 +292,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;
@@ -321,15 +321,15 @@ var GempLotrGameUI = Class.extend({
this.infoDialog = $("")
.dialog({
- autoOpen: false,
- closeOnEscape: true,
- resizable: true,
- title: "Card information",
- minHeight: 80,
- minWidth: 200,
- width: Math.max(600, width * 0.75),
- height: Math.max(300, height * 0.75)
- });
+ autoOpen: false,
+ closeOnEscape: true,
+ resizable: true,
+ title: "Card information",
+ minHeight: 80,
+ minWidth: 200,
+ width: Math.max(600, width * 0.75),
+ height: Math.max(300, height * 0.75)
+ });
var swipeOptions = {
threshold: 20,
@@ -720,13 +720,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: {
@@ -758,21 +758,38 @@ 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");
},
createCardDiv: function(card, text, foil) {
var cardDiv = createCardDiv(card.imageUrl, text, foil);
+
+ var tokenOverlay = $(".tokenOverlay", cardDiv);
+ var cardStrengthDiv = $("");
+ tokenOverlay.append(cardStrengthDiv);
+
cardDiv.data("card", card);
+ var sizeListeners = new Array();
+ sizeListeners[0] = {
+ sizeChanged: function(width, height) {
+ if (cardDiv.data("card").strength != null)
+ cardStrengthDiv.css({position: "absolute", left: width - 30 - 2 + "px", top: height - 30 - 2 + "px", width: 30, height: 30, display: ""});
+ else
+ cardStrengthDiv.css({position: "absolute", left: width - 30 - 2 + "px", top: height - 30 - 2 + "px", width: 30, height: 30, display: "none"});
+ }
+ };
+
+ cardDiv.data("sizeListeners", sizeListeners);
+
var that = this;
var swipeOptions = {
threshold: 20,
@@ -1013,8 +1030,8 @@ var GempLotrGameUI = Class.extend({
$(div).find('LI.hover').removeClass('hover');
$(this).parent().addClass('hover');
}).mouseout(function() {
- $(div).find('LI.hover').removeClass('hover');
- });
+ $(div).find('LI.hover').removeClass('hover');
+ });
var getRidOfContextMenu = function() {
$(div).remove();
@@ -1294,21 +1311,6 @@ var GempLotrGameUI = Class.extend({
this.attachSelectionFunctions(minions);
},
- moveCardToElement: function(cardId, element) {
- var charDiv = $(".card:cardId(" + cardId + ")");
- var charData = charDiv.data("card");
- charDiv.remove();
- element.append(charDiv);
- charDiv.data("card", charData);
- for (var j = 0; j < charData.attachedCards.length; j++) {
- var attachedDiv = charData.attachedCards[j];
- var attachedData = attachedDiv.data("card");
- attachedDiv.remove();
- element.append(attachedDiv);
- attachedDiv.data("card", attachedData);
- }
- },
-
clearSelection: function() {
$(".selectableCard").removeClass("selectableCard").data("action", null);
$(".selectedCard").removeClass("selectedCard");
diff --git a/gemp-lotr/gemp-lotr-web/src/main/webapp/js/jCardGroup.js b/gemp-lotr/gemp-lotr-web/src/main/webapp/js/jCardGroup.js
index 7d5c3a9e2..7d4800cc8 100644
--- a/gemp-lotr/gemp-lotr-web/src/main/webapp/js/jCardGroup.js
+++ b/gemp-lotr/gemp-lotr-web/src/main/webapp/js/jCardGroup.js
@@ -60,7 +60,7 @@ var CardGroup = Class.extend({
var tokenCount = tokens[token];
for (var i = 0; i < tokenCount; i++) {
- var tokenElem = $("![](images/tokens/" + token.toLowerCase() + ".png)
").css({position: "absolute", left: tokenX + "px", top: (1 * tokenSize / 2) * (1 + i) + "px"});
+ var tokenElem = $("").css({position: "absolute", left: tokenX + "px", top: (1 * tokenSize / 2) * (1 + i) + "px"});
tokenOverlay.append(tokenElem);
}
tokenIndex ++;
@@ -97,7 +97,7 @@ var AdvPathCardGroup = CardGroup.extend({
function(first, second) {
return (first.data("card").siteNumber - second.data("card").siteNumber);
}
- );
+ );
var cardCount = cardsToLayout.length;
var totalHeight = 0;
@@ -287,8 +287,9 @@ function layoutCardElem(cardElem, x, y, width, height, index) {
cardElem.css({position: "absolute", left: x + "px", top: y + "px", width: width, height: height, zIndex: index });
var tokenOverlay = $(".tokenOverlay", cardElem);
- tokenOverlay.css({position: "absolute", left: 0 + "px", top: 0 + "px", width: width, height: height})
- .html("");
+ tokenOverlay.css({position: "absolute", left: 0 + "px", top: 0 + "px", width: width, height: height});
+ // Remove all existing tokens
+ (".token",tokenOverlay).remove();
$(".foilOverlay", cardElem).css({position: "absolute", left: 0 + "px", top: 0 + "px", width: width, height: height});
@@ -297,4 +298,8 @@ function layoutCardElem(cardElem, x, y, width, height, index) {
var borderOverlay = $(".borderOverlay", cardElem);
borderOverlay.css({position: "absolute", left: 0 + "px", top: 0 + "px", width: width - 2 * borderWidth, height: height - 2 * borderWidth, "border-width": borderWidth + "px"});
+ var sizeListeners = cardElem.data("sizeListeners");
+ if (sizeListeners != null)
+ for (var i = 0; i < sizeListeners.length; i++)
+ sizeListeners[i].sizeChanged(width, height);
}
\ No newline at end of file
diff --git a/gemp-lotr/gemp-lotr-web/src/main/webapp/js/jCards.js b/gemp-lotr/gemp-lotr-web/src/main/webapp/js/jCards.js
index 17ea86114..f7411301b 100644
--- a/gemp-lotr/gemp-lotr-web/src/main/webapp/js/jCards.js
+++ b/gemp-lotr/gemp-lotr-web/src/main/webapp/js/jCards.js
@@ -12,6 +12,7 @@ var Card = Class.extend({
owner: null,
siteNumber: null,
attachedCards: null,
+ strength: null,
init: function(blueprintId, zone, cardId, owner, siteNumber) {
this.blueprintId = blueprintId;