ambidextrous/gemp-lotr
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

Display card info improved.

Browse Source
This commit is contained in:
marcins78@gmail.com
2011-12-13 01:09:43 +00:00
parent f768443f53
commit 3ac9a71049
3 changed files with 68 additions and 33 deletions
Download Patch File Download Diff File Expand all files Collapse all files

3
gemp-lotr/gemp-lotr-web/src/main/webapp/js/deckBuildingUi.js
View File

@@ -524,7 +524,8 @@ var GempLotrDeckBuildingUI = Class.extend({
displayCardInfo: function(card) {
this.infoDialog.html("");
this.infoDialog.html("<div style='scroll: auto'><img src='" + card.imageUrl + "'></div>");
this.infoDialog.html("<div style='scroll: auto'></div>");
this.infoDialog.append(createFullCardDiv(card.imageUrl, card.foil, card.horizontal));
var windowWidth = $(window).width();
var windowHeight = $(window).height();

70
gemp-lotr/gemp-lotr-web/src/main/webapp/js/gameUi.js
View File

@@ -449,7 +449,13 @@ var GempLotrGameUI = Class.extend({
displayCard: function(card, extraSpace) {
this.infoDialog.html("");
this.infoDialog.html("<div style='scroll: auto'><div style='float: left;'><img src='" + card.imageUrl + "'></div><div id='cardEffects'></div></div>");
this.infoDialog.html("<div style='scroll: auto'></div>");
var floatCardDiv = $("<div style='float: left;'></div>");
floatCardDiv.append(createFullCardDiv(card.imageUrl, card.foil, card.horizontal));
this.infoDialog.append(floatCardDiv);
if (extraSpace)
this.infoDialog.append("<div id='cardEffects'></div>");
var windowWidth = $(window).width();
var windowHeight = $(window).height();
@@ -485,21 +491,21 @@ var GempLotrGameUI = Class.extend({
initializeDialogs: function() {
this.smallDialog = $("<div></div>")
.dialog({
autoOpen: false,
closeOnEscape: false,
resizable: false,
width: 400,
height: 200
});
autoOpen: false,
closeOnEscape: false,
resizable: false,
width: 400,
height: 200
});
this.cardActionDialog = $("<div></div>")
.dialog({
autoOpen: false,
closeOnEscape: false,
resizable: true,
width: 600,
height: 300
});
autoOpen: false,
closeOnEscape: false,
resizable: true,
width: 600,
height: 300
});
var that = this;
@@ -514,11 +520,11 @@ var GempLotrGameUI = Class.extend({
this.infoDialog = $("<div></div>")
.dialog({
autoOpen: false,
closeOnEscape: true,
resizable: false,
title: "Card information"
});
autoOpen: false,
closeOnEscape: true,
resizable: false,
title: "Card information"
});
var swipeOptions = {
threshold: 20,
@@ -989,12 +995,12 @@ var GempLotrGameUI = Class.extend({
if (!this.replayMode) {
this.smallDialog.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',
@@ -1030,12 +1036,12 @@ var GempLotrGameUI = Class.extend({
if (!this.replayMode) {
this.smallDialog.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");
@@ -1399,8 +1405,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();

28
gemp-lotr/gemp-lotr-web/src/main/webapp/js/jCards.js
View File

@@ -164,6 +164,34 @@ function createCardDiv(image, text, foil, tokens) {
return cardDiv;
}
function createFullCardDiv(image, foil, horizontal) {
if (horizontal) {
var cardDiv = $("<div style='position: relative;width:497px;height:357px;'></div>");
cardDiv.append("<div style='position:absolute'><img src='" + image + "' width='497' height='357'></div>");
var borderDiv = $("<div class='borderOverlay' style='position:absolute;width:465px;height:325px;border-width:16px'><img class='actionArea' src='/gemp-lotr/images/pixel.png' width='100%' height='100%'></div>");
cardDiv.append(borderDiv);
if (foil) {
var foilDiv = $("<div class='foilOverlay' style='position:absolute;width:497px;height:357px'><img src='/gemp-lotr/images/foil.gif' width='100%' height='100%'></div>");
cardDiv.append(foilDiv);
}
} else {
var cardDiv = $("<div style='position: relative;width:357px;height:497px;'></div>");
cardDiv.append("<div style='position:absolute'><img src='" + image + "' width='357' height='497'></div>");
var borderDiv = $("<div class='borderOverlay' style='position:absolute;width:325px;height:465px;border-width:16px'><img class='actionArea' src='/gemp-lotr/images/pixel.png' width='100%' height='100%'></div>");
cardDiv.append(borderDiv);
if (foil) {
var foilDiv = $("<div class='foilOverlay' style='position:absolute;width:357px;height:497px'><img src='/gemp-lotr/images/foil.gif' width='100%' height='100%'></div>");
cardDiv.append(foilDiv);
}
}
return cardDiv;
}
function createSimpleCardDiv(image) {
var cardDiv = $("<div class='card'><img src='" + image + "' width='100%' height='100%'></div>");