mirror of
https://github.com/exane/not-gwent-online
synced 2024-11-23 19:36:53 +00:00
performance tweaks
This commit is contained in:
parent
e8c9b8bc85
commit
b460cf6cd7
@ -1,23 +1,38 @@
|
|||||||
var socket = require("socket.io-client");
|
var socket = require("socket.io-client");
|
||||||
var Backbone = require("backbone");
|
var Backbone = require("backbone");
|
||||||
require("./backbone.modal-min");
|
require("./backbone.modal-min");
|
||||||
var Handlebars = require("handlebars");
|
var Handlebars = require('handlebars/runtime').default;
|
||||||
var $ = require("jquery");
|
var $ = require("jquery");
|
||||||
|
|
||||||
window.$ = $;
|
window.$ = $;
|
||||||
|
|
||||||
|
Handlebars.registerPartial("card", require("../templates/cards.handlebars"));
|
||||||
|
Handlebars.registerHelper("health", function(lives){
|
||||||
|
var out = "";
|
||||||
|
|
||||||
|
for(var i = 0; i < 2; i++) {
|
||||||
|
out += "<i";
|
||||||
|
if(i < lives){
|
||||||
|
out += " class='ruby'";
|
||||||
|
}
|
||||||
|
out += "></i>";
|
||||||
|
}
|
||||||
|
return out;
|
||||||
|
});
|
||||||
|
|
||||||
var App = Backbone.Router.extend({
|
var App = Backbone.Router.extend({
|
||||||
routes: {
|
routes: {
|
||||||
"lobby": "lobbyRoute",
|
/*"lobby": "lobbyRoute",
|
||||||
"battle": "battleRoute",
|
"battle": "battleRoute",
|
||||||
"*path": "defaultRoute"
|
"*path": "defaultRoute"*/
|
||||||
},
|
},
|
||||||
initialize: function(){
|
initialize: function(){
|
||||||
var self = this;
|
var self = this;
|
||||||
this.connect();
|
this.connect();
|
||||||
this.user = new User({app: this});
|
this.user = new User({app: this});
|
||||||
|
|
||||||
Backbone.history.start();
|
/*Backbone.history.start();*/
|
||||||
|
this.lobbyRoute();
|
||||||
},
|
},
|
||||||
connect: function(){
|
connect: function(){
|
||||||
this.socket = socket(Config.Server.hostname + ":" + Config.Server.port);
|
this.socket = socket(Config.Server.hostname + ":" + Config.Server.port);
|
||||||
@ -77,6 +92,7 @@ var SideView = Backbone.View.extend({
|
|||||||
el: ".container",
|
el: ".container",
|
||||||
template: require("../templates/cards.handlebars"),
|
template: require("../templates/cards.handlebars"),
|
||||||
templateCards: require("../templates/fieldCards.handlebars"),
|
templateCards: require("../templates/fieldCards.handlebars"),
|
||||||
|
templateInfo: require("../templates/info.handlebars"),
|
||||||
initialize: function(options){
|
initialize: function(options){
|
||||||
var self = this;
|
var self = this;
|
||||||
this.side = options.side;
|
this.side = options.side;
|
||||||
@ -100,14 +116,14 @@ var SideView = Backbone.View.extend({
|
|||||||
renderInfo: function(){
|
renderInfo: function(){
|
||||||
var d = this.infoData;
|
var d = this.infoData;
|
||||||
var l = this.leader;
|
var l = this.leader;
|
||||||
this.$info = this.$el.find(".game-info" + this.side);
|
var html = this.templateInfo({
|
||||||
this.$info.find(".info-name").html(d.name);
|
data: d,
|
||||||
this.$info.find(".score").html(d.score);
|
leader: l,
|
||||||
this.$info.find(".hand-card").html(d.hand);
|
passBtn: this.side === ".player"
|
||||||
this.$info.find(".gwent-lives").html(this.lives(d.lives));
|
})
|
||||||
if(l._key){
|
|
||||||
this.$info.find(".field-leader").html(this.template(l))
|
this.$info = this.$el.find(".game-info" + this.side).html(html);
|
||||||
}
|
|
||||||
|
|
||||||
if(this.app.user.get("waiting") && this.side === ".player"){
|
if(this.app.user.get("waiting") && this.side === ".player"){
|
||||||
this.$info.addClass("removeBackground");
|
this.$info.addClass("removeBackground");
|
||||||
@ -115,9 +131,6 @@ var SideView = Backbone.View.extend({
|
|||||||
if(!this.app.user.get("waiting") && this.side === ".foe"){
|
if(!this.app.user.get("waiting") && this.side === ".foe"){
|
||||||
this.$info.addClass("removeBackground");
|
this.$info.addClass("removeBackground");
|
||||||
}
|
}
|
||||||
|
|
||||||
this.$info.find(".passing").html(d.passing ? "Passed" : "");
|
|
||||||
|
|
||||||
},
|
},
|
||||||
renderCloseField: function(){
|
renderCloseField: function(){
|
||||||
if(!this.field.close) return;
|
if(!this.field.close) return;
|
||||||
@ -136,7 +149,7 @@ var SideView = Backbone.View.extend({
|
|||||||
this.$fields.find(".field-horn-close").html(this.template(horn));
|
this.$fields.find(".field-horn-close").html(this.template(horn));
|
||||||
}
|
}
|
||||||
|
|
||||||
calculateCardMargin($field.find(".card"), 351, 70, cards.length);
|
calculateCardMargin($field.find(".card"), 424, 70, cards.length);
|
||||||
},
|
},
|
||||||
renderRangeField: function(){
|
renderRangeField: function(){
|
||||||
if(!this.field.ranged) return;
|
if(!this.field.ranged) return;
|
||||||
@ -154,7 +167,7 @@ var SideView = Backbone.View.extend({
|
|||||||
this.$fields.find(".field-horn-range").html(this.template(horn));
|
this.$fields.find(".field-horn-range").html(this.template(horn));
|
||||||
}
|
}
|
||||||
|
|
||||||
calculateCardMargin($field.find(".card"), 351, 70, cards.length);
|
calculateCardMargin($field.find(".card"), 424, 70, cards.length);
|
||||||
},
|
},
|
||||||
renderSiegeField: function(){
|
renderSiegeField: function(){
|
||||||
if(!this.field.siege) return;
|
if(!this.field.siege) return;
|
||||||
@ -172,7 +185,7 @@ var SideView = Backbone.View.extend({
|
|||||||
this.$fields.find(".field-horn-siege").html(this.template(horn));
|
this.$fields.find(".field-horn-siege").html(this.template(horn));
|
||||||
}
|
}
|
||||||
|
|
||||||
calculateCardMargin($field.find(".card"), 351, 70, cards.length);
|
calculateCardMargin($field.find(".card"), 424, 70, cards.length);
|
||||||
},
|
},
|
||||||
renderWeatherField: function(){
|
renderWeatherField: function(){
|
||||||
if(!this.field.weather) return;
|
if(!this.field.weather) return;
|
||||||
@ -181,7 +194,8 @@ var SideView = Backbone.View.extend({
|
|||||||
$weatherField.html(this.templateCards(cards));
|
$weatherField.html(this.templateCards(cards));
|
||||||
|
|
||||||
return this;
|
return this;
|
||||||
},
|
}
|
||||||
|
/*,
|
||||||
lives: function(lives){
|
lives: function(lives){
|
||||||
var out = "";
|
var out = "";
|
||||||
for(var i = 0; i < 2; i++) {
|
for(var i = 0; i < 2; i++) {
|
||||||
@ -192,7 +206,7 @@ var SideView = Backbone.View.extend({
|
|||||||
out += "></i>";
|
out += "></i>";
|
||||||
}
|
}
|
||||||
return out;
|
return out;
|
||||||
}
|
}*/
|
||||||
});
|
});
|
||||||
|
|
||||||
var calculateCardMargin = function($selector, totalWidth, cardWidth, n){
|
var calculateCardMargin = function($selector, totalWidth, cardWidth, n){
|
||||||
@ -241,8 +255,8 @@ var BattleView = Backbone.View.extend({
|
|||||||
|
|
||||||
this.render();
|
this.render();
|
||||||
|
|
||||||
yourSide = this.yourSide = new SideView({side: ".player", app: this.app, battleView: this});
|
this.yourSide = new SideView({side: ".player", app: this.app, battleView: this});
|
||||||
otherSide = this.otherSide = new SideView({side: ".foe", app: this.app, battleView: this});
|
this.otherSide = new SideView({side: ".foe", app: this.app, battleView: this});
|
||||||
|
|
||||||
},
|
},
|
||||||
events: {
|
events: {
|
||||||
@ -376,7 +390,7 @@ var BattleView = Backbone.View.extend({
|
|||||||
|
|
||||||
|
|
||||||
if(this.handCards){
|
if(this.handCards){
|
||||||
calculateCardMargin(this.$el.find(".field-hand .card"), 538, 70, this.handCards.length);
|
calculateCardMargin(this.$el.find(".field-hand .card"), 633, 70, this.handCards.length);
|
||||||
}
|
}
|
||||||
|
|
||||||
if(this.user.get("isReDrawing")){
|
if(this.user.get("isReDrawing")){
|
||||||
@ -576,7 +590,8 @@ var User = Backbone.Model.extend({
|
|||||||
self.set("roomSide", data.side);
|
self.set("roomSide", data.side);
|
||||||
/*
|
/*
|
||||||
self.set("channel:battle", app.socket.subscribe(self.get("room")));*/
|
self.set("channel:battle", app.socket.subscribe(self.get("room")));*/
|
||||||
app.navigate("battle", {trigger: true});
|
//app.navigate("battle", {trigger: true});
|
||||||
|
app.battleRoute();
|
||||||
})
|
})
|
||||||
|
|
||||||
/*app.receive("response:createRoom", function(roomID){
|
/*app.receive("response:createRoom", function(roomID){
|
||||||
|
@ -1,57 +1,13 @@
|
|||||||
<div class="col-xs-3 left-side">
|
<div class="col-xs-3 left-side">
|
||||||
<div class="col-xs-12 game-info game-info-foe foe">
|
<div class="col-xs-12 game-info game-info-foe foe">
|
||||||
<div class="col-xs-12 info-name"></div>
|
|
||||||
<div class="col-xs-6 field-single field-leader"></div>
|
|
||||||
<div class="col-xs-6">
|
|
||||||
<div class="row">
|
|
||||||
<div class="col-xs-6">Points:</div>
|
|
||||||
<div class="col-xs-6 score">0</div>
|
|
||||||
</div>
|
|
||||||
<div class="row">
|
|
||||||
<div class="col-xs-6">Hand:</div>
|
|
||||||
<div class="col-xs-6 hand-card">0</div>
|
|
||||||
</div>
|
|
||||||
<div class="row">
|
|
||||||
<div class="col-xs-12 gwent-lives">
|
|
||||||
<i class="ruby"></i>
|
|
||||||
<i class="ruby"></i>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
<div class="row">
|
|
||||||
<div class="col-xs-12 passing">Passed</div>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
</div>
|
</div>
|
||||||
<div class="col-xs-12 field field-weather">
|
<div class="col-xs-12 field field-weather">
|
||||||
field
|
field
|
||||||
</div>
|
</div>
|
||||||
<div class="col-xs-12 game-info game-info-player player">
|
<div class="col-xs-12 game-info game-info-player player">
|
||||||
<div class="col-xs-12 info-name">{{name}}</div>
|
|
||||||
<div class="col-xs-6 field-single field-leader"></div>
|
|
||||||
<div class="col-xs-6">
|
|
||||||
<div class="row">
|
|
||||||
<div class="col-xs-6">Points:</div>
|
|
||||||
<div class="col-xs-6 score">{{score}}</div>
|
|
||||||
</div>
|
|
||||||
<div class="row">
|
|
||||||
<div class="col-xs-6">Hand:</div>
|
|
||||||
<div class="col-xs-6 hand-card">{{hand}}</div>
|
|
||||||
</div>
|
|
||||||
<div class="row">
|
|
||||||
<div class="col-xs-12 gwent-lives">
|
|
||||||
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
<div class="row">
|
|
||||||
<div class="col-xs-12 passing">Passed</div>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
<div class="col-xs-12">
|
|
||||||
<button class="button-pass">Pass</button>
|
|
||||||
</div>
|
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
<div class="col-xs-6">
|
<div class="col-xs-7">
|
||||||
<div class="row">
|
<div class="row">
|
||||||
<div class="col-xs-12 battleside battleside-foe foe">
|
<div class="col-xs-12 battleside battleside-foe foe">
|
||||||
<div class="col-xs-2 field-horn field-horn-siege">
|
<div class="col-xs-2 field-horn field-horn-siege">
|
||||||
@ -97,32 +53,23 @@
|
|||||||
</div>
|
</div>
|
||||||
<div class="row">
|
<div class="row">
|
||||||
<div class="col-xs-12 field field-hand">
|
<div class="col-xs-12 field field-hand">
|
||||||
{{#each cards}}
|
{{#each cards as |val key|}}
|
||||||
<div class="card" data-key="{{_key}}" data-id="{{_id}}">
|
{{>card val}}
|
||||||
<img src='../assets/cards/{{_data.img}}.png'>
|
|
||||||
</div>
|
|
||||||
{{/each}}
|
{{/each}}
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
<div class="col-xs-3">
|
<div class="col-xs-2">
|
||||||
<div class="col-xs-12 card-preview">
|
<div class="col-xs-12 card-preview">
|
||||||
<!--<img src="{{preview}}">-->
|
|
||||||
</div>
|
</div>
|
||||||
<div class="col-xs-12 right-side right-side-foe foe">
|
<div class="col-xs-12 right-side right-side-foe foe">
|
||||||
<div class="col-xs-5 field-discard field-single">
|
<div class="col-xs-8 field-discard field-single">
|
||||||
discard deck
|
discard deck
|
||||||
</div>
|
</div>
|
||||||
<div class="col-xs-5 field-single field-deck pull-right">
|
|
||||||
main deck
|
|
||||||
</div>
|
|
||||||
</div>
|
</div>
|
||||||
<div class="col-xs-12 right-side right-side-player player">
|
<div class="col-xs-12 right-side right-side-player player">
|
||||||
<div class="col-xs-5 field-discard field-single">
|
<div class="col-xs-8 field-discard field-single">
|
||||||
discard deck
|
discard deck
|
||||||
</div>
|
</div>
|
||||||
<div class="col-xs-5 field-single field-deck pull-right">
|
|
||||||
main deck
|
|
||||||
</div>
|
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
@ -1,23 +1,30 @@
|
|||||||
<div class="col-xs-12 game-info game-info-foe foe">
|
<div class="col-xs-12 info-name">{{data.name}}</div>
|
||||||
<div class="col-xs-12 info-name">{{name}}</div>
|
<div class="col-xs-6 field-single field-leader">{{>card leader}}</div>
|
||||||
<div class="col-xs-6 field-single field-leader"></div>
|
<div class="col-xs-6">
|
||||||
<div class="col-xs-6">
|
|
||||||
<div class="row">
|
<div class="row">
|
||||||
<div class="col-xs-6">Points:</div>
|
<div class="col-xs-6">Points:</div>
|
||||||
<div class="col-xs-6 score">{{score}}</div>
|
<div class="col-xs-6 score">{{data.score}}</div>
|
||||||
</div>
|
</div>
|
||||||
<div class="row">
|
<div class="row">
|
||||||
<div class="col-xs-6">Hand:</div>
|
<div class="col-xs-6">Hand:</div>
|
||||||
<div class="col-xs-6 hand-card">{{hand}}</div>
|
<div class="col-xs-6 hand-card">{{data.hand}}</div>
|
||||||
|
</div>
|
||||||
|
<div class="row">
|
||||||
|
<div class="col-xs-6">Deck:</div>
|
||||||
|
<div class="col-xs-6 hand-card">{{data.deck}}</div>
|
||||||
</div>
|
</div>
|
||||||
<div class="row">
|
<div class="row">
|
||||||
<div class="col-xs-12 gwent-lives">
|
<div class="col-xs-12 gwent-lives">
|
||||||
{{#health}}
|
{{#health data.lives}}
|
||||||
{{/health}}
|
{{/health}}
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
<div class="row">
|
<div class="row">
|
||||||
<div class="col-xs-12 passing">Passed</div>
|
<div class="col-xs-12 passing">{{#if data.passing}}Passed{{/if}}</div>
|
||||||
</div>
|
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
|
{{#if passBtn}}
|
||||||
|
<div class="col-xs-12">
|
||||||
|
<button class="button-pass">Pass</button>
|
||||||
|
</div>
|
||||||
|
{{/if}}
|
@ -53,6 +53,25 @@ var Battle = (function(){
|
|||||||
this.p2.foe = this.p1;
|
this.p2.foe = this.p1;
|
||||||
this.p1.setUpWeatherFieldWith(this.p2);
|
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();
|
this.start();
|
||||||
}
|
}
|
||||||
|
@ -78,7 +78,7 @@ Battleside = (function(){
|
|||||||
})
|
})
|
||||||
this.receive("set:passing", function(){
|
this.receive("set:passing", function(){
|
||||||
self.setPassing(true);
|
self.setPassing(true);
|
||||||
//self.update();
|
self.update();
|
||||||
self.runEvent("NextTurn", null, [self.foe]);
|
self.runEvent("NextTurn", null, [self.foe]);
|
||||||
})
|
})
|
||||||
this.receive("medic:chooseCardFromDiscard", function(data){
|
this.receive("medic:chooseCardFromDiscard", function(data){
|
||||||
@ -226,6 +226,7 @@ Battleside = (function(){
|
|||||||
lives: this._rubies,
|
lives: this._rubies,
|
||||||
score: this.calcScore(),
|
score: this.calcScore(),
|
||||||
hand: this.hand.length(),
|
hand: this.hand.length(),
|
||||||
|
deck: this.deck.length(),
|
||||||
discard: this.getDiscard(true),
|
discard: this.getDiscard(true),
|
||||||
passing: this._passing
|
passing: this._passing
|
||||||
}
|
}
|
||||||
@ -452,6 +453,7 @@ Battleside = (function(){
|
|||||||
self.hand.add(replaceCard);
|
self.hand.add(replaceCard);
|
||||||
self.hand.remove(card);
|
self.hand.remove(card);
|
||||||
|
|
||||||
|
self.update();
|
||||||
self.runEvent("NextTurn", null, [self.foe]);
|
self.runEvent("NextTurn", null, [self.foe]);
|
||||||
})
|
})
|
||||||
}
|
}
|
||||||
|
Loading…
Reference in New Issue
Block a user