1
0
mirror of https://github.com/exane/not-gwent-online synced 2024-12-23 21:03:14 +00:00

performance tweaks

This commit is contained in:
exane 2015-06-25 17:51:21 +02:00
parent e8c9b8bc85
commit b460cf6cd7
5 changed files with 95 additions and 105 deletions

View File

@ -1,23 +1,38 @@
var socket = require("socket.io-client");
var Backbone = require("backbone");
require("./backbone.modal-min");
var Handlebars = require("handlebars");
var Handlebars = require('handlebars/runtime').default;
var $ = require("jquery");
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({
routes: {
"lobby": "lobbyRoute",
/*"lobby": "lobbyRoute",
"battle": "battleRoute",
"*path": "defaultRoute"
"*path": "defaultRoute"*/
},
initialize: function(){
var self = this;
this.connect();
this.user = new User({app: this});
Backbone.history.start();
/*Backbone.history.start();*/
this.lobbyRoute();
},
connect: function(){
this.socket = socket(Config.Server.hostname + ":" + Config.Server.port);
@ -77,6 +92,7 @@ var SideView = Backbone.View.extend({
el: ".container",
template: require("../templates/cards.handlebars"),
templateCards: require("../templates/fieldCards.handlebars"),
templateInfo: require("../templates/info.handlebars"),
initialize: function(options){
var self = this;
this.side = options.side;
@ -100,14 +116,14 @@ var SideView = Backbone.View.extend({
renderInfo: function(){
var d = this.infoData;
var l = this.leader;
this.$info = this.$el.find(".game-info" + this.side);
this.$info.find(".info-name").html(d.name);
this.$info.find(".score").html(d.score);
this.$info.find(".hand-card").html(d.hand);
this.$info.find(".gwent-lives").html(this.lives(d.lives));
if(l._key){
this.$info.find(".field-leader").html(this.template(l))
}
var html = this.templateInfo({
data: d,
leader: l,
passBtn: this.side === ".player"
})
this.$info = this.$el.find(".game-info" + this.side).html(html);
if(this.app.user.get("waiting") && this.side === ".player"){
this.$info.addClass("removeBackground");
@ -115,9 +131,6 @@ var SideView = Backbone.View.extend({
if(!this.app.user.get("waiting") && this.side === ".foe"){
this.$info.addClass("removeBackground");
}
this.$info.find(".passing").html(d.passing ? "Passed" : "");
},
renderCloseField: function(){
if(!this.field.close) return;
@ -136,7 +149,7 @@ var SideView = Backbone.View.extend({
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(){
if(!this.field.ranged) return;
@ -154,7 +167,7 @@ var SideView = Backbone.View.extend({
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(){
if(!this.field.siege) return;
@ -172,7 +185,7 @@ var SideView = Backbone.View.extend({
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(){
if(!this.field.weather) return;
@ -181,7 +194,8 @@ var SideView = Backbone.View.extend({
$weatherField.html(this.templateCards(cards));
return this;
},
}
/*,
lives: function(lives){
var out = "";
for(var i = 0; i < 2; i++) {
@ -192,7 +206,7 @@ var SideView = Backbone.View.extend({
out += "></i>";
}
return out;
}
}*/
});
var calculateCardMargin = function($selector, totalWidth, cardWidth, n){
@ -241,8 +255,8 @@ var BattleView = Backbone.View.extend({
this.render();
yourSide = this.yourSide = new SideView({side: ".player", app: this.app, battleView: this});
otherSide = this.otherSide = new SideView({side: ".foe", app: this.app, battleView: this});
this.yourSide = new SideView({side: ".player", app: this.app, battleView: this});
this.otherSide = new SideView({side: ".foe", app: this.app, battleView: this});
},
events: {
@ -376,7 +390,7 @@ var BattleView = Backbone.View.extend({
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")){
@ -576,7 +590,8 @@ var User = Backbone.Model.extend({
self.set("roomSide", data.side);
/*
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){

View File

@ -1,57 +1,13 @@
<div class="col-xs-3 left-side">
<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 class="col-xs-12 field field-weather">
field
</div>
<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 class="col-xs-6">
<div class="col-xs-7">
<div class="row">
<div class="col-xs-12 battleside battleside-foe foe">
<div class="col-xs-2 field-horn field-horn-siege">
@ -97,32 +53,23 @@
</div>
<div class="row">
<div class="col-xs-12 field field-hand">
{{#each cards}}
<div class="card" data-key="{{_key}}" data-id="{{_id}}">
<img src='../assets/cards/{{_data.img}}.png'>
</div>
{{#each cards as |val key|}}
{{>card val}}
{{/each}}
</div>
</div>
</div>
<div class="col-xs-3">
<div class="col-xs-2">
<div class="col-xs-12 card-preview">
<!--<img src="{{preview}}">-->
</div>
<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
</div>
<div class="col-xs-5 field-single field-deck pull-right">
main deck
</div>
</div>
<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
</div>
<div class="col-xs-5 field-single field-deck pull-right">
main deck
</div>
</div>
</div>

View File

@ -1,23 +1,30 @@
<div class="col-xs-12 game-info game-info-foe foe">
<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">
{{#health}}
{{/health}}
</div>
</div>
<div class="row">
<div class="col-xs-12 passing">Passed</div>
<div class="col-xs-12 info-name">{{data.name}}</div>
<div class="col-xs-6 field-single field-leader">{{>card leader}}</div>
<div class="col-xs-6">
<div class="row">
<div class="col-xs-6">Points:</div>
<div class="col-xs-6 score">{{data.score}}</div>
</div>
<div class="row">
<div class="col-xs-6">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 class="row">
<div class="col-xs-12 gwent-lives">
{{#health data.lives}}
{{/health}}
</div>
</div>
</div>
<div class="row">
<div class="col-xs-12 passing">{{#if data.passing}}Passed{{/if}}</div>
</div>
</div>
{{#if passBtn}}
<div class="col-xs-12">
<button class="button-pass">Pass</button>
</div>
{{/if}}

View File

@ -53,6 +53,25 @@ 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();
}

View File

@ -78,7 +78,7 @@ Battleside = (function(){
})
this.receive("set:passing", function(){
self.setPassing(true);
//self.update();
self.update();
self.runEvent("NextTurn", null, [self.foe]);
})
this.receive("medic:chooseCardFromDiscard", function(data){
@ -226,6 +226,7 @@ Battleside = (function(){
lives: this._rubies,
score: this.calcScore(),
hand: this.hand.length(),
deck: this.deck.length(),
discard: this.getDiscard(true),
passing: this._passing
}
@ -452,6 +453,7 @@ Battleside = (function(){
self.hand.add(replaceCard);
self.hand.remove(card);
self.update();
self.runEvent("NextTurn", null, [self.foe]);
})
}