From 5764bb12a5b897f8a27ac3928b1bbd6b2b4fa672 Mon Sep 17 00:00:00 2001 From: "marcins78@gmail.com" Date: Tue, 13 Mar 2012 11:36:33 +0000 Subject: [PATCH] Hall is resizing with the window. --- .../gemp-lotr-web/src/main/webapp/hall.html | 314 ++++++++++-------- .../src/main/webapp/js/hallUi.js | 24 +- 2 files changed, 188 insertions(+), 150 deletions(-) diff --git a/gemp-lotr/gemp-lotr-web/src/main/webapp/hall.html b/gemp-lotr/gemp-lotr-web/src/main/webapp/hall.html index 3ab7ab375..d27a9ca23 100644 --- a/gemp-lotr/gemp-lotr-web/src/main/webapp/hall.html +++ b/gemp-lotr/gemp-lotr-web/src/main/webapp/hall.html @@ -2,185 +2,217 @@ "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> - Gemp-LotR - - +Gemp-LotR + + - - - + + + - - + + - - - - - - - - - - - - + + + + + + + + + + + + - + + resizeHall(); + }); + + function resizeHall() { + var width = $(window).width(); + var height = $(window).height(); + + var innerWidth = width - 60; + var innerHeight = height - 100; + + if (innerHeight < 520) + innerHeight = 520; + if (innerWidth < 740) + innerWidth = 740; + + var middleHeight = (innerHeight - 60) / 2; + + $("#latestNews").css({width: innerWidth + "px", height: 30 + "px"}); + $("#motd").css({width: innerWidth + "px", height: 30 + "px"}); + $("#hall").css({width: innerWidth + "px", height: middleHeight + "px"}); + $("#chat").css({width: innerWidth + "px", height: middleHeight + "px"}); + + chat.setBounds(2, 2, innerWidth - 4, middleHeight - 4); + hall.hallResized(innerWidth, middleHeight); + } + -
+
  • Game Hall
  • Game History
    • diff --git a/gemp-lotr/gemp-lotr-web/src/main/webapp/js/hallUi.js b/gemp-lotr/gemp-lotr-web/src/main/webapp/js/hallUi.js index a1c7e6d37..1a02e3b18 100644 --- a/gemp-lotr/gemp-lotr-web/src/main/webapp/js/hallUi.js +++ b/gemp-lotr/gemp-lotr-web/src/main/webapp/js/hallUi.js @@ -9,6 +9,7 @@ var GempLotrHallUI = Class.extend({ leaveTableButton: null, tablesDiv: null, + buttonsDiv: null, init: function(div, url, chat) { this.div = div; @@ -37,8 +38,8 @@ var GempLotrHallUI = Class.extend({ this.tablesDiv.css({overflow: "auto", left: "0px", top: "0px", width: width + "px", height: (height - 30) + "px"}); this.div.append(this.tablesDiv); - var buttonsDiv = $("
    "); - buttonsDiv.css({left: "0px", top: (height - 30) + "px", width: width + "px", height: 29 + "px", align: "right", backgroundColor: "#000000", "border-top-width": "1px", "border-top-color": "#ffffff", "border-top-style": "solid"}); + this.buttonsDiv = $("
    "); + this.buttonsDiv.css({left: "0px", top: (height - 30) + "px", width: width + "px", height: 29 + "px", align: "right", backgroundColor: "#000000", "border-top-width": "1px", "border-top-color": "#ffffff", "border-top-style": "solid"}); var that = this; @@ -48,8 +49,8 @@ var GempLotrHallUI = Class.extend({ location.href = 'deckBuild.html'; }); - buttonsDiv.append(editDeck); - buttonsDiv.append(" | "); + this.buttonsDiv.append(editDeck); + this.buttonsDiv.append(" | "); this.supportedFormatsSelect = $(""); this.supportedFormatsSelect.hide(); @@ -72,9 +73,9 @@ var GempLotrHallUI = Class.extend({ this.decksSelect = $(""); this.decksSelect.hide(); - buttonsDiv.append(this.supportedFormatsSelect); - buttonsDiv.append(this.decksSelect); - buttonsDiv.append(this.createTableButton); + this.buttonsDiv.append(this.supportedFormatsSelect); + this.buttonsDiv.append(this.decksSelect); + this.buttonsDiv.append(this.createTableButton); this.leaveTableButton = $(""); $(this.leaveTableButton).button().click( @@ -84,14 +85,19 @@ var GempLotrHallUI = Class.extend({ }); this.leaveTableButton.hide(); - buttonsDiv.append(this.leaveTableButton); + this.buttonsDiv.append(this.leaveTableButton); - this.div.append(buttonsDiv); + this.div.append(this.buttonsDiv); this.updateHall(); this.updateDecks(); }, + hallResized: function(width, height) { + this.tablesDiv.css({overflow: "auto", left: "0px", top: "0px", width: width + "px", height: (height - 30) + "px"}); + this.buttonsDiv.css({left: "0px", top: (height - 30) + "px", width: width + "px", height: 29 + "px", align: "right", backgroundColor: "#000000", "border-top-width": "1px", "border-top-color": "#ffffff", "border-top-style": "solid"}); + }, + updateHall: function() { var that = this;