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

Introduced a separate smaller dialog for Integer and multichoice decisions, so that card decision dialog can be large.

Browse Source
This commit is contained in:
marcins78@gmail.com
2011-09-15 22:06:02 +00:00
parent d6641e8264
commit af30b1a244
1 changed files with 30 additions and 20 deletions
Download Patch File Download Diff File Expand all files Collapse all files

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

@@ -8,7 +8,8 @@ var GempLotrGameUI = Class.extend({
selfPlayerId: null, selfPlayerId: null,
currentPlayerId: null, currentPlayerId: null,
allPlayerIds: null, allPlayerIds: null,
dialogInstance: null, cardActionDialog: null,
smallDialog: null,
gameStateElem: null, gameStateElem: null,
alert: null, alert: null,
infoDialog: null, infoDialog: null,
@@ -92,10 +93,10 @@ var GempLotrGameUI = Class.extend({
return (card.zone == "HAND"); return (card.zone == "HAND");
}); });
this.specialGroup = new NormalCardGroup(this.dialogInstance, function(card) { this.specialGroup = new NormalCardGroup(this.cardActionDialog, function(card) {
return (card.zone == "SPECIAL"); return (card.zone == "SPECIAL");
}, false); }, false);
this.specialGroup.setBounds(this.padding, this.padding, this.dialogInstance.width() + 20, this.dialogInstance.height() + 20); this.specialGroup.setBounds(this.padding, this.padding, this.cardActionDialog.width() + 20, this.cardActionDialog.height() + 20);
this.gameStateElem = $("<div class='ui-widget-content'></div>"); this.gameStateElem = $("<div class='ui-widget-content'></div>");
this.gameStateElem.css({"border-radius": "7px"}); this.gameStateElem.css({"border-radius": "7px"});
@@ -194,7 +195,16 @@ var GempLotrGameUI = Class.extend({
}, },
initializeDialogs: function() { initializeDialogs: function() {
this.dialogInstance = $("<div></div>") this.smallDialog = $("<div></div>")
.dialog({
autoOpen: false,
closeOnEscape: false,
resizable: false,
width: 400,
height: 200
});
this.cardActionDialog = $("<div></div>")
.dialog({ .dialog({
autoOpen: false, autoOpen: false,
closeOnEscape: false, closeOnEscape: false,
@@ -205,7 +215,7 @@ var GempLotrGameUI = Class.extend({
var that = this; var that = this;
this.dialogInstance.bind("dialogresize", function() { this.cardActionDialog.bind("dialogresize", function() {
that.arbitraryDialogResize(); that.arbitraryDialogResize();
}); });
@@ -668,7 +678,7 @@ var GempLotrGameUI = Class.extend({
max = 1000; max = 1000;
var that = this; var that = this;
this.dialogInstance this.smallDialog
.html(text + "<br /><input id='integerDecision' type='text' value='0'>") .html(text + "<br /><input id='integerDecision' type='text' value='0'>")
.dialog("option", "buttons", .dialog("option", "buttons",
{ {
@@ -690,7 +700,7 @@ var GempLotrGameUI = Class.extend({
backColor: "#000000" backColor: "#000000"
}); });
this.dialogInstance.dialog("open"); this.smallDialog.dialog("open");
}, },
multipleChoiceDecision: function(decision) { multipleChoiceDecision: function(decision) {
@@ -705,7 +715,7 @@ var GempLotrGameUI = Class.extend({
html += "</select>"; html += "</select>";
var that = this; var that = this;
this.dialogInstance this.smallDialog
.html(html) .html(html)
.dialog("option", "buttons", .dialog("option", "buttons",
{ {
@@ -716,7 +726,7 @@ var GempLotrGameUI = Class.extend({
} }
); );
this.dialogInstance.dialog("open"); this.smallDialog.dialog("open");
}, },
createCardDiv: function(card, text) { createCardDiv: function(card, text) {
@@ -764,20 +774,20 @@ var GempLotrGameUI = Class.extend({
var selectableCardIds = new Array(); var selectableCardIds = new Array();
this.dialogInstance this.cardActionDialog
.html("<div id='arbitraryChoice'></div>") .html("<div id='arbitraryChoice'></div>")
.dialog("option", "title", text) .dialog("option", "title", text)
.dialog("option", "buttons", {}); .dialog("option", "buttons", {});
var finishChoice = function() { var finishChoice = function() {
that.dialogInstance.dialog("close"); that.cardActionDialog.dialog("close");
$("#arbitraryChoice").html(""); $("#arbitraryChoice").html("");
that.clearSelection(); that.clearSelection();
that.decisionFunction(id, "" + selectedCardIds); that.decisionFunction(id, "" + selectedCardIds);
}; };
if (min == 0) { if (min == 0) {
this.dialogInstance.dialog("option", "buttons", { this.cardActionDialog.dialog("option", "buttons", {
"DONE": function() { "DONE": function() {
finishChoice(); finishChoice();
} }
@@ -802,7 +812,7 @@ var GempLotrGameUI = Class.extend({
selectedCardIds.push(cardId); selectedCardIds.push(cardId);
if (selectedCardIds.length == min) { if (selectedCardIds.length == min) {
this.dialogInstance.dialog("option", "buttons", { this.cardActionDialog.dialog("option", "buttons", {
"DONE": function() { "DONE": function() {
finishChoice(); finishChoice();
} }
@@ -824,7 +834,7 @@ var GempLotrGameUI = Class.extend({
this.attachSelectionFunctions(selectableCardIds); this.attachSelectionFunctions(selectableCardIds);
$(".ui-dialog-titlebar").show(); $(".ui-dialog-titlebar").show();
this.dialogInstance.dialog("open"); this.cardActionDialog.dialog("open");
this.arbitraryDialogResize(); this.arbitraryDialogResize();
}, },
@@ -901,7 +911,7 @@ var GempLotrGameUI = Class.extend({
var selectedActionIds = new Array(); var selectedActionIds = new Array();
this.dialogInstance this.cardActionDialog
.html("<div id='arbitraryChoice'></div>") .html("<div id='arbitraryChoice'></div>")
.dialog("option", "title", text) .dialog("option", "title", text)
.dialog("option", "buttons", {}); .dialog("option", "buttons", {});
@@ -909,7 +919,7 @@ var GempLotrGameUI = Class.extend({
var cardIds = new Array(); var cardIds = new Array();
var finishChoice = function() { var finishChoice = function() {
that.dialogInstance.dialog("close"); that.cardActionDialog.dialog("close");
$("#arbitraryChoice").html(""); $("#arbitraryChoice").html("");
that.clearSelection(); that.clearSelection();
that.decisionFunction(id, "" + selectedActionIds); that.decisionFunction(id, "" + selectedActionIds);
@@ -935,7 +945,7 @@ var GempLotrGameUI = Class.extend({
if (this.settingsAutoAccept) { if (this.settingsAutoAccept) {
finishChoice(); finishChoice();
} else { } else {
this.dialogInstance.dialog("option", "buttons", { this.cardActionDialog.dialog("option", "buttons", {
"DONE": function() { "DONE": function() {
finishChoice(); finishChoice();
} }
@@ -950,7 +960,7 @@ var GempLotrGameUI = Class.extend({
this.specialGroup.setBounds(10, 10, 547, 188); this.specialGroup.setBounds(10, 10, 547, 188);
$(".ui-dialog-titlebar").show(); $(".ui-dialog-titlebar").show();
this.dialogInstance.dialog("open"); this.cardActionDialog.dialog("open");
}, },
cardSelectionDecision: function(decision) { cardSelectionDecision: function(decision) {
@@ -1126,8 +1136,8 @@ var GempLotrGameUI = Class.extend({
}, },
arbitraryDialogResize: function() { arbitraryDialogResize: function() {
var width = this.dialogInstance.width() + 20; var width = this.cardActionDialog.width() + 20;
var height = this.dialogInstance.height() + 20; var height = this.cardActionDialog.height() + 20;
this.specialGroup.setBounds(this.padding, this.padding, width - 2 * this.padding, height - 2 * this.padding); this.specialGroup.setBounds(this.padding, this.padding, width - 2 * this.padding, height - 2 * this.padding);
} }
}); });