From a72e9cc669821fa9ec459500c8e9e555f2e66933 Mon Sep 17 00:00:00 2001 From: exane Date: Thu, 25 Jun 2015 19:30:56 +0200 Subject: [PATCH] add winner notification and weather effects --- client/js/client.js | 244 ++++++++++++++--------- client/scss/main.scss | 34 ++++ client/templates/modal.winner.handlebars | 12 ++ server/Battle.js | 45 +++-- 4 files changed, 218 insertions(+), 117 deletions(-) create mode 100644 client/templates/modal.winner.handlebars diff --git a/client/js/client.js b/client/js/client.js index 83126c2..bdd28f3 100644 --- a/client/js/client.js +++ b/client/js/client.js @@ -1,16 +1,16 @@ -var socket = require("socket.io-client"); -var Backbone = require("backbone"); +let socket = require("socket.io-client"); +let Backbone = require("backbone"); require("./backbone.modal-min"); -var Handlebars = require('handlebars/runtime').default; -var $ = require("jquery"); +let Handlebars = require('handlebars/runtime').default; +let $ = require("jquery"); window.$ = $; Handlebars.registerPartial("card", require("../templates/cards.handlebars")); Handlebars.registerHelper("health", function(lives){ - var out = ""; + let out = ""; - for(var i = 0; i < 2; i++) { + for(let i = 0; i < 2; i++) { out += " { + let key = card._key; + if(key === "biting_frost") isInfluencedByWeather = true; + }) + + if(isInfluencedByWeather) { + $field.addClass("field-frost"); + } + calculateCardMargin($field.find(".card"), 424, 70, cards.length); }, renderRangeField: function(){ if(!this.field.ranged) return; this.$fields = this.$el.find(".battleside" + this.side); - var $field = this.$fields.find(".field-range").parent(); - var cards = this.field.ranged.cards; - var score = this.field.ranged.score; - var horn = this.field.ranged.horn; + let $field = this.$fields.find(".field-range").parent(); + let cards = this.field.ranged.cards; + let score = this.field.ranged.score; + let horn = this.field.ranged.horn; - var html = this.templateCards(cards); + let html = this.templateCards(cards); $field.find(".field-range").html(html) $field.find(".large-field-counter").html(score) @@ -167,17 +177,27 @@ var SideView = Backbone.View.extend({ this.$fields.find(".field-horn-range").html(this.template(horn)); } + let isInfluencedByWeather; + this.field.weather.cards.forEach((card) => { + let key = card._key; + if(key === "impenetrable_fog") isInfluencedByWeather = true; + }) + + if(isInfluencedByWeather) { + $field.addClass("field-fog"); + } + calculateCardMargin($field.find(".card"), 424, 70, cards.length); }, renderSiegeField: function(){ if(!this.field.siege) return; this.$fields = this.$el.find(".battleside" + this.side); - var $field = this.$fields.find(".field-siege").parent(); - var cards = this.field.siege.cards; - var score = this.field.siege.score; - var horn = this.field.siege.horn; + let $field = this.$fields.find(".field-siege").parent(); + let cards = this.field.siege.cards; + let score = this.field.siege.score; + let horn = this.field.siege.horn; - var html = this.templateCards(cards); + let html = this.templateCards(cards); $field.find(".field-siege").html(html) $field.find(".large-field-counter").html(score) @@ -185,20 +205,30 @@ var SideView = Backbone.View.extend({ this.$fields.find(".field-horn-siege").html(this.template(horn)); } + let isInfluencedByWeather; + this.field.weather.cards.forEach((card) => { + let key = card._key; + if(key === "torrential_rain") isInfluencedByWeather = true; + }) + + if(isInfluencedByWeather) { + $field.addClass("field-rain"); + } + calculateCardMargin($field.find(".card"), 424, 70, cards.length); }, renderWeatherField: function(){ if(!this.field.weather) return; - var $weatherField = this.$el.find(".field-weather"); - var cards = this.field.weather.cards; + let $weatherField = this.$el.find(".field-weather"); + let cards = this.field.weather.cards; $weatherField.html(this.templateCards(cards)); return this; } /*, lives: function(lives){ - var out = ""; - for(var i = 0; i < 2; i++) { + let out = ""; + for(let i = 0; i < 2; i++) { out += " +

Match over

+ +
+

{{winner}} wins the match!

+

If you want to give feedback, or if you want to contribute, please feel free to visit Github Gwent-Online.

+

For another match reload the page und enqueue again!

+

Thanks for playing the game!

+
+
+
close
+
\ No newline at end of file diff --git a/server/Battle.js b/server/Battle.js index bad196f..fa62b51 100644 --- a/server/Battle.js +++ b/server/Battle.js @@ -53,24 +53,6 @@ var Battle = (function(){ this.p2.foe = this.p1; this.p1.setUpWeatherFieldWith(this.p2); - this.p1.hand.add(Card("poor_fucking_infantry")); - this.p2.hand.add(Card("poor_fucking_infantry")); - this.p1.hand.add(Card("poor_fucking_infantry")); - this.p2.hand.add(Card("poor_fucking_infantry")); - this.p1.hand.add(Card("poor_fucking_infantry")); - this.p2.hand.add(Card("poor_fucking_infantry")); - this.p1.hand.add(Card("poor_fucking_infantry")); - this.p2.hand.add(Card("poor_fucking_infantry")); - this.p1.hand.add(Card("poor_fucking_infantry")); - this.p2.hand.add(Card("poor_fucking_infantry")); - this.p1.hand.add(Card("poor_fucking_infantry")); - this.p2.hand.add(Card("poor_fucking_infantry")); - this.p1.hand.add(Card("poor_fucking_infantry")); - this.p2.hand.add(Card("poor_fucking_infantry")); - this.p1.hand.add(Card("poor_fucking_infantry")); - this.p2.hand.add(Card("poor_fucking_infantry")); - this.p1.hand.add(Card("poor_fucking_infantry")); - this.p2.hand.add(Card("poor_fucking_infantry")); this.start(); @@ -82,6 +64,26 @@ var Battle = (function(){ this.p1.draw(10); this.p2.draw(10); + /*this.p1.hand.add(Card("poor_fucking_infantry")); + this.p2.hand.add(Card("poor_fucking_infantry")); + this.p1.hand.add(Card("poor_fucking_infantry")); + this.p2.hand.add(Card("poor_fucking_infantry")); + this.p1.hand.add(Card("poor_fucking_infantry")); + this.p2.hand.add(Card("poor_fucking_infantry")); + this.p1.hand.add(Card("poor_fucking_infantry")); + this.p2.hand.add(Card("poor_fucking_infantry")); + this.p1.hand.add(Card("poor_fucking_infantry")); + this.p2.hand.add(Card("poor_fucking_infantry")); + this.p1.hand.add(Card("poor_fucking_infantry")); + this.p2.hand.add(Card("poor_fucking_infantry")); + this.p1.hand.add(Card("poor_fucking_infantry")); + this.p2.hand.add(Card("poor_fucking_infantry")); + this.p1.hand.add(Card("poor_fucking_infantry")); + this.p2.hand.add(Card("poor_fucking_infantry")); + this.p1.hand.add(Card("poor_fucking_infantry")); + this.p2.hand.add(Card("poor_fucking_infantry"));*/ + + this.update(); @@ -120,6 +122,7 @@ var Battle = (function(){ var loser = this.checkRubies(); if(this.checkIfIsOver()){ console.log("its over!"); + this.gameOver(loser.foe); this.update(); return; } @@ -133,6 +136,12 @@ var Battle = (function(){ this.switchTurn(loser); } + r.gameOver = function(winner) { + this.send("gameover", { + winner: winner.getName() + }) + } + r.update = function(){ console.log("update called"); this._update(this.p1);