diff --git a/gemp-lotr/gemp-lotr-async/src/main/web/css/gemp-001/deckBuild.css b/gemp-lotr/gemp-lotr-async/src/main/web/css/gemp-001/deckBuild.css
index afeadbd4d..03e2aa624 100644
--- a/gemp-lotr/gemp-lotr-async/src/main/web/css/gemp-001/deckBuild.css
+++ b/gemp-lotr/gemp-lotr-async/src/main/web/css/gemp-001/deckBuild.css
@@ -140,4 +140,22 @@ button.navigation-butt {
.notesDialog {
display: flex;
+}
+
+
+.card-group {
+ width: 100%;
+ height: 100%;
+ border-radius: 7px;
+ text-align: center;
+}
+
+.helper-text {
+ font-size: calc(0.3rem + 0.75vh);
+ position: relative;
+ top: 40%;
+ padding:10px;
+ -webkit-transform: translateY(-50%);
+ -ms-transform: translateY(-50%);
+ transform: translateY(-50%);
}
\ No newline at end of file
diff --git a/gemp-lotr/gemp-lotr-async/src/main/web/deckBuild.html b/gemp-lotr/gemp-lotr-async/src/main/web/deckBuild.html
index 3d4e4e7ea..c32beb048 100644
--- a/gemp-lotr/gemp-lotr-async/src/main/web/deckBuild.html
+++ b/gemp-lotr/gemp-lotr-async/src/main/web/deckBuild.html
@@ -105,11 +105,41 @@
-
diff --git a/gemp-lotr/gemp-lotr-async/src/main/web/js/gemp-022/deckBuildingUi.js b/gemp-lotr/gemp-lotr-async/src/main/web/js/gemp-022/deckBuildingUi.js
index a80dc632d..790c28f02 100644
--- a/gemp-lotr/gemp-lotr-async/src/main/web/js/gemp-022/deckBuildingUi.js
+++ b/gemp-lotr/gemp-lotr-async/src/main/web/js/gemp-022/deckBuildingUi.js
@@ -10,6 +10,10 @@ var GempLotrDeckBuildingUI = Class.extend({
ringDiv:null,
ringGroup:null,
+
+ mapDiv:null,
+ mapGroup:null,
+ showMap:false,
siteDiv:null,
siteGroup:null,
@@ -90,6 +94,13 @@ var GempLotrDeckBuildingUI = Class.extend({
$("#formatSelect").change(
function () {
that.deckModified(true);
+ let formatCode = that.formatSelect.val();
+ if(formatCode == "pc_movie" || formatCode == "test_pc_movie") {
+ that.setMapVisibility(true);
+ }
+ else {
+ that.setMapVisibility(false);
+ }
});
var collectionSelect = $("#collectionSelect");
@@ -196,7 +207,7 @@ var GempLotrDeckBuildingUI = Class.extend({
});
this.ringBearerGroup = new NormalCardGroup(this.ringBearerDiv, function (card) {
return true;
- });
+ }, false, $("#rb-content"));
this.ringDiv = $("#ringDiv");
this.ringDiv.click(
@@ -206,12 +217,22 @@ var GempLotrDeckBuildingUI = Class.extend({
});
this.ringGroup = new NormalCardGroup(this.ringDiv, function (card) {
return true;
- });
+ }, false, $("#ring-content"));
+
+ this.mapDiv = $("#map-div");
+ this.mapDiv.click(
+ function () {
+ if ($(".card", that.mapDiv).length == 0)
+ that.showPredefinedFilter("cardType:MAP type:card", that.mapDiv);
+ });
+ this.mapGroup = new NormalCardGroup(this.mapDiv, function (card) {
+ return true;
+ }, false, $("#map-content"));
this.siteDiv = $("#sitesDiv");
this.siteGroup = new VerticalBarGroup(this.siteDiv, function (card) {
return true;
- }, true);
+ }, false, $("#sites-content"));
this.drawDeckDiv = $("#decksRegion");
this.fpDeckGroup = new NormalCardGroup(this.drawDeckDiv, function (card) {
@@ -289,6 +310,11 @@ var GempLotrDeckBuildingUI = Class.extend({
this.updateFormatOptions();
},
+ setMapVisibility:function(value) {
+ this.showMap = value;
+ this.layoutUI(true);
+ },
+
renameCurrentDeck:function() {
var that = this;
that.renameDeck(that.deckName, function (newDeckName) {
@@ -1035,6 +1061,7 @@ var GempLotrDeckBuildingUI = Class.extend({
//$('#formatSelect option[value="' + formatName + '"]').prop('selected', true);
this.formatSelect.val(formatCode);
+ this.formatSelect.change();
}
var notes = root.getElementsByTagName("notes");
@@ -1124,12 +1151,24 @@ var GempLotrDeckBuildingUI = Class.extend({
this.ringBearerDiv.css({ position:"absolute", left:padding, top:manageHeight + 2 * padding, width:Math.floor((sitesWidth - padding) / 2), height:rowHeight });
this.ringBearerGroup.setBounds(0, 0, Math.floor((sitesWidth - padding) / 2), rowHeight);
- this.ringDiv.css({ position:"absolute", left:Math.floor((sitesWidth + 3 * padding) / 2), top:manageHeight + 2 * padding, width:Math.floor((sitesWidth - padding) / 2), height:rowHeight });
+ this.ringDiv.css({ display:"block", position:"absolute", left:Math.floor((sitesWidth + 3 * padding) / 2), top:manageHeight + 2 * padding, width:Math.floor((sitesWidth - padding) / 2), height:rowHeight });
this.ringGroup.setBounds(0, 0, Math.floor((sitesWidth - padding) / 2), rowHeight);
+
+ if(this.showMap) {
+ this.mapDiv.css({ display:"block", position:"absolute", left:padding, top:manageHeight + 2 * padding+ rowHeight, width:Math.floor((sitesWidth - padding) / 2), height:rowHeight });
+ this.mapGroup.setBounds(0, 0, Math.floor((sitesWidth - padding) / 2), rowHeight);
- this.siteDiv.css({ position:"absolute", left:padding, top:manageHeight + 3 * padding + rowHeight, width:sitesWidth, height:deckHeight - rowHeight - 2 * padding});
- this.siteGroup.setBounds(0, 0, sitesWidth, deckHeight - rowHeight - 2 * padding);
+ this.siteDiv.css({ position:"absolute", left:padding, top:manageHeight + 3 * padding + 2 * rowHeight, width:sitesWidth, height:deckHeight - rowHeight - 2 * padding});
+ this.siteGroup.setBounds(0, 0, sitesWidth, deckHeight - 2*rowHeight - 2 * padding);
+ }
+ else {
+ this.mapDiv.css({ display:"none"});
+ this.mapGroup.setBounds(0, 0, Math.floor((sitesWidth - padding) / 2), rowHeight);
+ this.siteDiv.css({ position:"absolute", left:padding, top:manageHeight + 3 * padding + rowHeight, width:sitesWidth, height:deckHeight - rowHeight - 2 * padding});
+ this.siteGroup.setBounds(0, 0, sitesWidth, deckHeight - rowHeight - 2 * padding);
+ }
+
this.drawDeckDiv.css({ position:"absolute", left:padding * 2 + sitesWidth, top:manageHeight + 2 * padding, width:deckWidth - (sitesWidth + padding) - padding, height:deckHeight - 2 * padding - 50 });
this.fpDeckGroup.setBounds(0, 0, deckWidth - (sitesWidth + padding) - padding, (deckHeight - 2 * padding - 50) / 2);
this.shadowDeckGroup.setBounds(0, (deckHeight - 2 * padding - 50) / 2, deckWidth - (sitesWidth + padding) - padding, (deckHeight - 2 * padding - 50) / 2);
@@ -1150,6 +1189,9 @@ var GempLotrDeckBuildingUI = Class.extend({
this.ringBearerGroup.layoutCards();
this.ringGroup.layoutCards();
this.siteGroup.layoutCards();
+ if(this.showMap) {
+ this.mapGroup.layoutCards();
+ }
},
layoutDeck:function () {
diff --git a/gemp-lotr/gemp-lotr-async/src/main/web/js/gemp-022/jCardGroup.js b/gemp-lotr/gemp-lotr-async/src/main/web/js/gemp-022/jCardGroup.js
index c1c218383..02394bfe2 100644
--- a/gemp-lotr/gemp-lotr-async/src/main/web/js/gemp-022/jCardGroup.js
+++ b/gemp-lotr/gemp-lotr-async/src/main/web/js/gemp-022/jCardGroup.js
@@ -9,15 +9,20 @@ var CardGroup = Class.extend({
maxCardHeight:497,
descDiv:null,
- init:function (container, belongTest, createDiv) {
+ init:function (container, belongTest, createDiv, existingDiv) {
this.container = container;
this.belongTestFunc = belongTest;
if (createDiv === undefined || createDiv) {
- this.descDiv = $("
");
+ if(existingDiv !== undefined) {
+ this.descDiv = existingDiv;
+ }
+ else {
+ this.descDiv = $("
");
+ container.append(this.descDiv);
+ }
+
this.descDiv.css({"border-radius":"7px"});
-
- container.append(this.descDiv);
}
},
@@ -59,8 +64,8 @@ var CardGroup = Class.extend({
});
var VerticalBarGroup = CardGroup.extend({
- init:function (container, belongTest, createDiv) {
- this._super(container, belongTest, createDiv);
+ init:function (container, belongTest, createDiv, existingDiv) {
+ this._super(container, belongTest, createDiv, existingDiv);
},
layoutCards:function () {
@@ -103,8 +108,8 @@ var VerticalBarGroup = CardGroup.extend({
});
var VerticalFlexGroup = CardGroup.extend({
- init:function (container, belongTest, createDiv) {
- this._super(container, belongTest, createDiv);
+ init:function (container, belongTest, createDiv, existingDiv) {
+ this._super(container, belongTest, createDiv, existingDiv);
},
setBounds:function (x, y, width, height) {
@@ -236,8 +241,8 @@ var AdvPathCardGroup = CardGroup.extend({
var NormalCardGroup = CardGroup.extend({
- init:function (container, belongTest, createDiv) {
- this._super(container, belongTest, createDiv);
+ init:function (container, belongTest, createDiv, existingDiv) {
+ this._super(container, belongTest, createDiv, existingDiv);
},
layoutCards:function () {
@@ -396,8 +401,8 @@ var NormalCardGroup = CardGroup.extend({
var NormalFlexGroup = CardGroup.extend({
- init:function (container, belongTest, createDiv) {
- this._super(container, belongTest, createDiv);
+ init:function (container, belongTest, createDiv, existingDiv) {
+ this._super(container, belongTest, createDiv, existingDiv);
},
setBounds:function (x, y, width, height) {