From ee1b0e0eda14091b3d6f42777494107ce3343923 Mon Sep 17 00:00:00 2001 From: exane Date: Tue, 23 Jun 2015 18:12:11 +0200 Subject: [PATCH] add card redraw at battle begin --- client/js/client.js | 38 ++++++++++++ client/scss/_backbone.modal.sass | 2 +- client/scss/_backbone.modal.theme.sass | 1 + client/templates/fieldCards.handlebars | 1 - client/templates/modal.redraw.handlebars | 13 +++++ package.json | 12 ++-- server/Battle.js | 73 +++++------------------- server/Battleside.js | 41 ++++++++++++- server/Deck.js | 5 +- 9 files changed, 114 insertions(+), 72 deletions(-) create mode 100644 client/templates/modal.redraw.handlebars diff --git a/client/js/client.js b/client/js/client.js index 613d568..17fea44 100644 --- a/client/js/client.js +++ b/client/js/client.js @@ -226,6 +226,8 @@ var BattleView = Backbone.View.extend({ this.listenTo(user, "change:openDiscard", this.render); this.listenTo(user, "change:setAgile", this.render); this.listenTo(user, "change:setHorn", this.render); + this.listenTo(user, "change:isReDrawing", this.render); + /*this.listenTo(user, "change:handCards", this.render);*/ this.$hand = this.$el.find(".field-hand"); this.$preview = this.$el.find(".card-preview"); @@ -378,6 +380,12 @@ var BattleView = Backbone.View.extend({ calculateCardMargin(this.$el.find(".field-hand .card"), 538, 70, this.handCards.length); } + if(this.user.get("isReDrawing")) { + this.user.set("handCards", this.handCards); + var modal = new ReDrawModal({model: this.user}); + this.$el.prepend(modal.render().el); + } + if(this.user.get("openDiscard")){ var modal = new Modal({model: this.user}); this.$el.prepend(modal.render().el); @@ -488,6 +496,28 @@ var MedicModal = Modal.extend({ } }); +var ReDrawModal = Modal.extend({ + template: require("../templates/modal.redraw.handlebars"), + initialize: function(){ + this.listenTo(this.model, "change:isReDrawing", this.cancel); + }, + events: { + "click .card": "onCardClick" + }, + onCardClick: function(e){ + console.log($(e.target).closest(".card")); + var id = $(e.target).closest(".card").data().id; + this.model.get("app").send("redraw:reDrawCard", { + cardID: id + }) + }, + cancel: function(){ + if(!this.model.get("isReDrawing")) return; + this.model.get("app").send("redraw:close_client"); + this.model.set("isReDrawing", false); + } +}); + var User = Backbone.Model.extend({ defaults: { name: "", @@ -554,6 +584,14 @@ var User = Backbone.Model.extend({ self.set("setHorn", data.cardID); }) + app.receive("redraw:cards", function() { + self.set("isReDrawing", true); + }) + + app.receive("redraw:close", function() { + self.set("isReDrawing", false); + }) + app.on("createRoom", this.createRoom, this); app.on("joinRoom", this.joinRoom, this); app.on("setName", this.setName, this); diff --git a/client/scss/_backbone.modal.sass b/client/scss/_backbone.modal.sass index 8b1a6fe..985feba 100644 --- a/client/scss/_backbone.modal.sass +++ b/client/scss/_backbone.modal.sass @@ -12,7 +12,7 @@ * box-sizing: border-box - overflow: auto + //overflow: auto .bbm-modal border-radius: 3px diff --git a/client/scss/_backbone.modal.theme.sass b/client/scss/_backbone.modal.theme.sass index 2832091..e8ffc0b 100644 --- a/client/scss/_backbone.modal.theme.sass +++ b/client/scss/_backbone.modal.theme.sass @@ -49,6 +49,7 @@ .bbm-modal__section padding: 0 30px margin-top: 0px + display: inline-block font: size: 16px line-height: 26px diff --git a/client/templates/fieldCards.handlebars b/client/templates/fieldCards.handlebars index df7807a..5bd88f8 100644 --- a/client/templates/fieldCards.handlebars +++ b/client/templates/fieldCards.handlebars @@ -1,7 +1,6 @@ {{#each this}}
{{#if diff}}{{diff}}{{/if}} -
{{/each}} \ No newline at end of file diff --git a/client/templates/modal.redraw.handlebars b/client/templates/modal.redraw.handlebars new file mode 100644 index 0000000..3d3201b --- /dev/null +++ b/client/templates/modal.redraw.handlebars @@ -0,0 +1,13 @@ +
+

Choose up to 2 cards you wish to redraw!

+
+
+ {{#each handCards}} +
+ +
+ {{/each}} +
+
+
close
+
\ No newline at end of file diff --git a/package.json b/package.json index 3de8d8f..7d2295a 100644 --- a/package.json +++ b/package.json @@ -4,14 +4,15 @@ "description": "A standalone multiplayer version of Gwent (The Witcher 3)", "main": "gulpfile.js", "dependencies": { - "socketcluster": "2.2.x", "connect": "3.0.1", "express": "4.12.3", - "shortid": "^2.2.2", - "serve-static": "1.8.0", + "jquery-deferred": "^0.3.0", "minimist": "1.1.0", - "underscore": "^1.8.3", - "socketcluster-client": "2.2.x" + "serve-static": "1.8.0", + "shortid": "^2.2.2", + "socketcluster": "2.2.x", + "socketcluster-client": "2.2.x", + "underscore": "^1.8.3" }, "devDependencies": { "babelify": "^6.1.2", @@ -22,7 +23,6 @@ "gulp-sass": "^2.0.1", "handlebars": "^3.0.3", "jquery": "^2.1.4", - "promise": "^7.0.1", "vinyl-source-stream": "^1.1.0" }, "scripts": { diff --git a/server/Battle.js b/server/Battle.js index 871f77e..5883230 100644 --- a/server/Battle.js +++ b/server/Battle.js @@ -1,6 +1,7 @@ var Battleside = require("./Battleside"); var Card = require("./Card"); var shortid = require("shortid"); +var Promise = require("jquery-deferred"); var Battle = (function(){ @@ -61,72 +62,23 @@ var Battle = (function(){ this.p2.setLeadercard(); this.p1.draw(10); this.p2.draw(10); - /*this.p1.hand.add(Card("commanders_horn")); - this.p2.hand.add(Card("commanders_horn"));*/ - /* - this.p1.hand.add(Card("ciaran_aep_easnillien")); - this.p2.hand.add(Card("ciaran_aep_easnillien"));*/ - /* - */ - /*this.p1.hand.add(Card("decoy")); - this.p2.hand.add(Card("decoy"));*/ - /* - this.p1.hand.add(Card("milva")); - this.p2.hand.add(Card("milva")); - this.p1.hand.add(Card("havekar_healer")); - this.p2.hand.add(Card("havekar_healer")); - this.p1.hand.add(Card("toruviel")); - this.p2.hand.add(Card("toruviel")); - this.p1.hand.add(Card("vrihedd_brigade_recruit")); - this.p2.hand.add(Card("vrihedd_brigade_recruit")); - this.p1.hand.add(Card("impenetrable_fog")); - this.p2.hand.add(Card("impenetrable_fog"));*/ - /* - this.p1.hand.add(Card("commanders_horn")); - this.p1.hand.add(Card("commanders_horn")); - this.p2.hand.add(Card("commanders_horn"));*/ - /* - this.p1.hand.add(Card("biting_frost")); - this.p2.hand.add(Card("biting_frost")); - this.p1.hand.add(Card("torrential_rain")); - this.p2.hand.add(Card("torrential_rain")); - this.p1.hand.add(Card("clear_weather")); - this.p2.hand.add(Card("clear_weather"));*/ - /* - this.p1.hand.add(Card("kaedweni_siege_expert")); - this.p2.hand.add(Card("kaedweni_siege_expert")); - this.p1.hand.add(Card("ballista")); - this.p2.hand.add(Card("ballista")); - this.p1.hand.add(Card("ballista")); - this.p2.hand.add(Card("ballista")); - this.p1.hand.add(Card("ballista")); - this.p2.hand.add(Card("ballista")); - this.p1.hand.add(Card("ballista")); - this.p2.hand.add(Card("ballista")); - this.p1.hand.add(Card("ballista")); - this.p2.hand.add(Card("ballista"));*/ - - /* - this.p1.hand.add(Card("dun_banner_medic")); - this.p2.hand.add(Card("dun_banner_medic")); - this.p1.hand.add(Card("isengrim_faoiltiarnah")); - this.p2.hand.add(Card("isengrim_faoiltiarnah"));*/ - - /*this.p1.addToDiscard([Card("kaedweni_siege_expert")]); - this.p2.addToDiscard([Card("kaedweni_siege_expert")]);*/ - /* - this.p1.hand.add(Card("decoy")); - this.p1.hand.add(Card("impenetrable_fog")); - this.p2.hand.add(Card("decoy")); - this.p2.hand.add(Card("impenetrable_fog"));*/ this.update(); - /*PubSub.subscribe("nextTurn", this.switchTurn.bind(this));*/ + Promise.when(this.p1.reDraw(2), this.p2.reDraw(2)) + .then(function() { + this.on("NextTurn", this.switchTurn); + this.switchTurn(Math.random() > .5 ? this.p1 : this.p2); + }.bind(this)); + + + + + /* this.on("NextTurn", this.switchTurn); - this.switchTurn(Math.random() > .5 ? this.p1 : this.p2); + this.switchTurn(Math.random() > .5 ? this.p1 : this.p2);*/ } r.switchTurn = function(side, __flag){ @@ -173,6 +125,7 @@ var Battle = (function(){ } r.update = function(){ + console.log("update called"); this._update(this.p1); this._update(this.p2); } diff --git a/server/Battleside.js b/server/Battleside.js index a710cd9..4d07cc9 100644 --- a/server/Battleside.js +++ b/server/Battleside.js @@ -4,6 +4,7 @@ var Hand = require("./Hand"); var Card = require("./Card"); var Field = require("./Field"); var _ = require("underscore"); +var Promise = require("jquery-deferred"); var Battleside; @@ -143,7 +144,7 @@ Battleside = (function(){ return this._passing; } - r.isWaiting = function() { + r.isWaiting = function(){ return this._isWaiting; } @@ -212,7 +213,7 @@ Battleside = (function(){ console.log("update:hand fired"); - this.update(); + /*this.update();*/ } r.calcScore = function(){ @@ -593,7 +594,7 @@ Battleside = (function(){ res.push(card); } } - else if(_.isArray(val)) { + else if(_.isArray(val)){ var _f = false; for(var i = 0; i < val.length; i++) { if(property === val[i]){ @@ -615,6 +616,40 @@ Battleside = (function(){ return arr; } + r.reDraw = function(n){ + var hand = this.hand.getCards(); + var self = this; + var left = n; + var deferred = Promise.Deferred(); + + this.send("redraw:cards", null, true); + + this.receive("redraw:reDrawCard", function(data){ + var id = data.cardID; + if(!left) return; + left--; + var card = self.hand.remove(id)[0]; + console.log("hand -> deck: ", card.getName()); + self.deck.add(card); + self.deck.shuffle(); + self.draw(1); + self.update(); + if(!left) { + self.send("redraw:close", null, true); + console.log("redraw finished"); + deferred.resolve("done"); + } + }) + + this.receive("redraw:close_client", function() { + console.log("redraw finished!"); + deferred.resolve("done"); + }) + + return deferred; + + } + return Battleside; })(); diff --git a/server/Deck.js b/server/Deck.js index bc86edb..4b83e79 100644 --- a/server/Deck.js +++ b/server/Deck.js @@ -50,7 +50,6 @@ var Deck = (function(){ return card; } - r._loadCards = function(){ this._deck = this.getDeck().map(function(cardkey){ return Card(cardkey); @@ -100,6 +99,10 @@ var Deck = (function(){ } } + r.add = function(card) { + this._deck.push(card); + } + return Deck; })();