mirror of
https://github.com/exane/not-gwent-online
synced 2026-01-10 19:23:45 +00:00
rearrange folders
This commit is contained in:
exane
123
client/js/backbone.modal-min.js
vendored
Normal file
123
client/js/backbone.modal-min.js
vendored
Normal file
@@ -0,0 +1,123 @@
|
||||
(function(){
|
||||
var a = function(a, b){
|
||||
return function(){
|
||||
return a.apply(b, arguments)
|
||||
}
|
||||
}, b = {}.hasOwnProperty, c = function(a, c){
|
||||
function d(){
|
||||
this.constructor = a
|
||||
}
|
||||
|
||||
for(var e in c)b.call(c, e) && (a[e] = c[e]);
|
||||
return d.prototype = c.prototype, a.prototype = new d, a.__super__ = c.prototype, a
|
||||
}, d = [].indexOf || function(a){
|
||||
for(var b = 0, c = this.length; c > b; b++)if(b in this && this[b] === a)return b;
|
||||
return -1
|
||||
};
|
||||
!function(a){
|
||||
return "function" == typeof define && define.amd ? define(["underscore", "backbone", "exports"], a) : "object" == typeof exports ? a(require("underscore"), require("backbone"), exports) : a(_, Backbone, {})
|
||||
}(function(b, e, f){
|
||||
return f = function(f){
|
||||
function g(){
|
||||
this.triggerCancel = a(this.triggerCancel, this), this.triggerSubmit = a(this.triggerSubmit, this), this.triggerView = a(this.triggerView, this), this.clickOutsideElement = a(this.clickOutsideElement, this), this.clickOutside = a(this.clickOutside, this), this.checkKey = a(this.checkKey, this), this.rendererCompleted = a(this.rendererCompleted, this), this.args = Array.prototype.slice.apply(arguments), e.View.prototype.constructor.apply(this, this.args), this.setUIElements()
|
||||
}
|
||||
|
||||
return c(g, f), g.prototype.prefix = "bbm", g.prototype.animate = !0, g.prototype.keyControl = !0, g.prototype.showViewOnRender = !0, g.prototype.render = function(a){
|
||||
var c, d;
|
||||
return c = this.serializeData(), (!a || b.isEmpty(a)) && (a = 0), this.$el.addClass("" + this.prefix + "-wrapper"), this.modalEl = e.$("<div />").addClass("" + this.prefix + "-modal"), this.template && this.modalEl.html(this.buildTemplate(this.template, c)), this.$el.html(this.modalEl), this.viewContainer ? (this.viewContainerEl = this.modalEl.find(this.viewContainer), this.viewContainerEl.addClass("" + this.prefix + "-modal__views")) : this.viewContainerEl = this.modalEl, e.$(":focus").blur(), (null != (d = this.views) ? d.length : void 0) > 0 && this.showViewOnRender && this.openAt(a), "function" == typeof this.onRender && this.onRender(), this.delegateModalEvents(), this.$el.fadeIn && this.animate ? (this.modalEl.css({opacity: 0}), this.$el.fadeIn({
|
||||
duration: 100,
|
||||
complete: this.rendererCompleted
|
||||
})) : this.rendererCompleted(), this
|
||||
}, g.prototype.rendererCompleted = function(){
|
||||
var a;
|
||||
return this.keyControl && (e.$("body").on("keyup.bbm", this.checkKey), this.$el.on("mouseup.bbm", this.clickOutsideElement), this.$el.on("click.bbm", this.clickOutside)), this.modalEl.css({opacity: 1}).addClass("" + this.prefix + "-modal--open"), "function" == typeof this.onShow && this.onShow(), null != (a = this.currentView) && "function" == typeof a.onShow ? a.onShow() : void 0
|
||||
}, g.prototype.setUIElements = function(){
|
||||
var a;
|
||||
if(this.template = this.getOption("template"), this.views = this.getOption("views"), null != (a = this.views) && (a.length = b.size(this.views)), this.viewContainer = this.getOption("viewContainer"), this.animate = this.getOption("animate"), b.isUndefined(this.template) && b.isUndefined(this.views))throw new Error("No template or views defined for Backbone.Modal");
|
||||
if(this.template && this.views && b.isUndefined(this.viewContainer))throw new Error("No viewContainer defined for Backbone.Modal")
|
||||
}, g.prototype.getOption = function(a){
|
||||
return a ? this.options && d.call(this.options, a) >= 0 && null != this.options[a] ? this.options[a] : this[a] : void 0
|
||||
}, g.prototype.serializeData = function(){
|
||||
var a;
|
||||
return a = {}, this.model && (a = b.extend(a, this.model.toJSON())), this.collection && (a = b.extend(a, {items: this.collection.toJSON()})), a
|
||||
}, g.prototype.delegateModalEvents = function(){
|
||||
var a, c, d, e, f, g, h;
|
||||
this.active = !0, a = this.getOption("cancelEl"), f = this.getOption("submitEl"), f && this.$el.on("click", f, this.triggerSubmit), a && this.$el.on("click", a, this.triggerCancel), h = [];
|
||||
for(c in this.views)b.isString(c) && "length" !== c ? (d = c.match(/^(\S+)\s*(.*)$/), g = d[1], e = d[2], h.push(this.$el.on(g, e, this.views[c], this.triggerView))) : h.push(void 0);
|
||||
return h
|
||||
}, g.prototype.undelegateModalEvents = function(){
|
||||
var a, c, d, e, f, g, h;
|
||||
this.active = !1, a = this.getOption("cancelEl"), f = this.getOption("submitEl"), f && this.$el.off("click", f, this.triggerSubmit), a && this.$el.off("click", a, this.triggerCancel), h = [];
|
||||
for(c in this.views)b.isString(c) && "length" !== c ? (d = c.match(/^(\S+)\s*(.*)$/), g = d[1], e = d[2], h.push(this.$el.off(g, e, this.views[c], this.triggerView))) : h.push(void 0);
|
||||
return h
|
||||
}, g.prototype.checkKey = function(a){
|
||||
if(this.active)switch(a.keyCode) {
|
||||
case 27:
|
||||
return this.triggerCancel(a);
|
||||
case 13:
|
||||
return this.triggerSubmit(a)
|
||||
}
|
||||
}, g.prototype.clickOutside = function(){
|
||||
var a;
|
||||
return (null != (a = this.outsideElement) ? a.hasClass("" + this.prefix + "-wrapper") : void 0) && this.active ? this.triggerCancel() : void 0
|
||||
}, g.prototype.clickOutsideElement = function(a){
|
||||
return this.outsideElement = e.$(a.target)
|
||||
}, g.prototype.buildTemplate = function(a, c){
|
||||
var d;
|
||||
return (d = "function" == typeof a ? a : b.template(e.$(a).html()))(c)
|
||||
}, g.prototype.buildView = function(a, c){
|
||||
var d;
|
||||
if(a)return c && b.isFunction(c) && (c = c()), b.isFunction(a) ? (d = new a(c || this.args[0]), d instanceof e.View ? {
|
||||
el: d.render().$el,
|
||||
view: d
|
||||
} : {el: a(c || this.args[0])}) : {view: a, el: a.$el}
|
||||
}, g.prototype.triggerView = function(a){
|
||||
var c, d, e, f, g, h, i;
|
||||
if(null != a && "function" == typeof a.preventDefault && a.preventDefault(), f = a.data, d = this.buildView(f.view, f.viewOptions), this.currentView && (this.previousView = this.currentView, !(null != (i = f.openOptions) ? i.skipSubmit : void 0))){
|
||||
if(("function" == typeof(g = this.previousView).beforeSubmit ? g.beforeSubmit(a) : void 0) === !1)return;
|
||||
"function" == typeof(h = this.previousView).submit && h.submit()
|
||||
}
|
||||
this.currentView = d.view || d.el, c = 0;
|
||||
for(e in this.views)f.view === this.views[e].view && (this.currentIndex = c), c++;
|
||||
return f.onActive && (b.isFunction(f.onActive) ? f.onActive(this) : b.isString(f.onActive) && this[f.onActive].call(this, f)), this.shouldAnimate ? this.animateToView(d.el) : (this.shouldAnimate = !0, this.$(this.viewContainerEl).html(d.el))
|
||||
}, g.prototype.animateToView = function(a){
|
||||
var b, c, d, f, g, h, i;
|
||||
return f = {
|
||||
position: "relative",
|
||||
top: -9999,
|
||||
left: -9999
|
||||
}, g = e.$("<tester/>").css(f), g.html(this.$el.clone().css(f)), 0 !== e.$("tester").length ? e.$("tester").replaceWith(g) : e.$("body").append(g), b = g.find(this.viewContainer ? this.viewContainer : "." + this.prefix + "-modal"), b.removeAttr("style"), d = b.outerHeight(), b.html(a), c = b.outerHeight(), d === c ? (this.$(this.viewContainerEl).html(a), "function" == typeof(h = this.currentView).onShow && h.onShow(), null != (i = this.previousView) && "function" == typeof i.destroy ? i.destroy() : void 0) : this.animate ? (this.$(this.viewContainerEl).css({opacity: 0}), this.$(this.viewContainerEl).animate({height: c}, 100, function(b){
|
||||
return function(){
|
||||
var c, d;
|
||||
return b.$(b.viewContainerEl).css({opacity: 1}).removeAttr("style"), b.$(b.viewContainerEl).html(a), "function" == typeof(c = b.currentView).onShow && c.onShow(), null != (d = b.previousView) && "function" == typeof d.destroy ? d.destroy() : void 0
|
||||
}
|
||||
}(this))) : this.$(this.viewContainerEl).css({height: c}).html(a)
|
||||
}, g.prototype.triggerSubmit = function(a){
|
||||
var b, c;
|
||||
return null != a && a.preventDefault(), e.$(a.target).is("textarea") || this.beforeSubmit && this.beforeSubmit(a) === !1 || this.currentView && this.currentView.beforeSubmit && this.currentView.beforeSubmit(a) === !1 ? void 0 : this.submit || (null != (b = this.currentView) ? b.submit : void 0) || this.getOption("submitEl") ? (null != (c = this.currentView) && "function" == typeof c.submit && c.submit(), "function" == typeof this.submit && this.submit(), this.regionEnabled ? this.trigger("modal:destroy") : this.destroy()) : this.triggerCancel()
|
||||
}, g.prototype.triggerCancel = function(a){
|
||||
return null != a && a.preventDefault(), this.beforeCancel && this.beforeCancel() === !1 ? void 0 : ("function" == typeof this.cancel && this.cancel(), this.regionEnabled ? this.trigger("modal:destroy") : this.destroy())
|
||||
}, g.prototype.destroy = function(){
|
||||
var a;
|
||||
return e.$("body").off("keyup.bbm", this.checkKey), this.$el.off("mouseup.bbm", this.clickOutsideElement), this.$el.off("click.bbm", this.clickOutside), e.$("tester").remove(), "function" == typeof this.onDestroy && this.onDestroy(), this.shouldAnimate = !1, this.modalEl.addClass("" + this.prefix + "-modal--destroy"), a = function(a){
|
||||
return function(){
|
||||
var b;
|
||||
return null != (b = a.currentView) && "function" == typeof b.remove && b.remove(), a.remove()
|
||||
}
|
||||
}(this), this.$el.fadeOut && this.animate ? (this.$el.fadeOut({duration: 200}), b.delay(function(){
|
||||
return a()
|
||||
}, 200)) : a()
|
||||
}, g.prototype.openAt = function(a){
|
||||
var c, d, e, f, g;
|
||||
b.isNumber(a) ? c = a : b.isNumber(a._index) && (c = a._index), e = 0;
|
||||
for(f in this.views)if("length" !== f)if(b.isNumber(c))e === c && (g = this.views[f]), e++;
|
||||
else if(b.isObject(a))for(d in this.views[f])a[d] === this.views[f][d] && (g = this.views[f]);
|
||||
return g && (this.currentIndex = b.indexOf(this.views, g), this.triggerView({data: b.extend(g, {openOptions: a})})), this
|
||||
}, g.prototype.next = function(a){
|
||||
return null == a && (a = {}), this.currentIndex + 1 < this.views.length ? this.openAt(b.extend(a, {_index: this.currentIndex + 1})) : void 0
|
||||
}, g.prototype.previous = function(a){
|
||||
return null == a && (a = {}), this.currentIndex - 1 < this.views.length - 1 ? this.openAt(b.extend(a, {_index: this.currentIndex - 1})) : void 0
|
||||
}, g
|
||||
}(e.View), e.Modal = f, e.Modal
|
||||
})
|
||||
}).call(this);
|
||||
46
client/js/client-lobby.js
Normal file
46
client/js/client-lobby.js
Normal file
@@ -0,0 +1,46 @@
|
||||
var Backbone = require("backbone");
|
||||
var Handlebars = require("handlebars");
|
||||
var $ = require("jquery");
|
||||
|
||||
var Lobby = Backbone.View.extend({
|
||||
defaults: {
|
||||
id: ""
|
||||
},
|
||||
className: "container",
|
||||
|
||||
template: Handlebars.compile($("#matchmaker-template").html()),
|
||||
initialize: function(){
|
||||
this.app = app;
|
||||
this.listenTo(app.user, "change", this.render);
|
||||
$(this.el).prependTo('body');
|
||||
this.render();
|
||||
},
|
||||
events: {
|
||||
"click .create-room": "createRoom",
|
||||
"click .join-room": "joinRoom",
|
||||
"blur .name-input": "changeName",
|
||||
"change #deckChoice": "setDeck"
|
||||
},
|
||||
render: function(){
|
||||
this.$el.html(this.template(this.app.user.attributes));
|
||||
//this.$el.find("#deckChoice option[value='" + this.app.user.get("setDeck") + "']").attr("selected", "selected")
|
||||
return this;
|
||||
},
|
||||
createRoom: function(){
|
||||
this.app.send("request:createRoom");
|
||||
},
|
||||
joinRoom: function(){
|
||||
this.app.send("request:joinRoom");
|
||||
},
|
||||
setDeck: function(e){
|
||||
var val = $(e.target).val();
|
||||
this.app.user.setDeck(val);
|
||||
},
|
||||
changeName: function(e){
|
||||
var name = $(e.target).val();
|
||||
this.app.user.setName(name);
|
||||
}
|
||||
});
|
||||
|
||||
|
||||
module.exports = Lobby;
|
||||
585
client/js/client.js
Normal file
585
client/js/client.js
Normal file
@@ -0,0 +1,585 @@
|
||||
/*("http://localhost:16918")*/
|
||||
var socketCluster = require("socketcluster-client");
|
||||
var Backbone = require("backbone");
|
||||
require("./backbone.modal-min");
|
||||
var Handlebars = require("handlebars");
|
||||
var $ = require("jquery");
|
||||
//var Lobby = require("./client-lobby");
|
||||
|
||||
window.$ = $;
|
||||
|
||||
Handlebars.registerHelper("health", function(lives, options){
|
||||
var out = "";
|
||||
|
||||
for(var i = 0; i < 2; i++) {
|
||||
out += "<i";
|
||||
if(i < lives){
|
||||
out += " class='ruby'";
|
||||
}
|
||||
out += "></i>";
|
||||
}
|
||||
return out;
|
||||
});
|
||||
|
||||
/*
|
||||
var Config = {};
|
||||
|
||||
Config.Server = {
|
||||
"hostname": "localhost",
|
||||
"port": 16918,
|
||||
secure: false
|
||||
}
|
||||
*/
|
||||
|
||||
var App = Backbone.Router.extend({
|
||||
routes: {
|
||||
"lobby": "lobbyRoute",
|
||||
"battle": "battleRoute",
|
||||
"*path": "defaultRoute"
|
||||
},
|
||||
initialize: function(){
|
||||
var self = this;
|
||||
this.connect();
|
||||
this.user = new User({app: this});
|
||||
|
||||
Backbone.history.start();
|
||||
},
|
||||
connect: function(){
|
||||
this.socket = socketCluster.connect(Config.Server);
|
||||
},
|
||||
receive: function(event, cb){
|
||||
this.socket.on(event, cb);
|
||||
}, /*
|
||||
receiveOnce: function(event, cb){
|
||||
this.socket.once(event, cb);
|
||||
},*/
|
||||
send: function(event, data){
|
||||
data = data || null;
|
||||
var socket = this.socket;
|
||||
|
||||
if(!data){
|
||||
socket.emit(event);
|
||||
}
|
||||
if(data){
|
||||
socket.emit(event, data);
|
||||
}
|
||||
},
|
||||
|
||||
lobbyRoute: function(){
|
||||
if(this.currentView){
|
||||
this.currentView.remove();
|
||||
}
|
||||
this.currentView = new Lobby({
|
||||
app: this,
|
||||
user: this.user
|
||||
});
|
||||
},
|
||||
battleRoute: function(){
|
||||
if(this.currentView){
|
||||
this.currentView.remove();
|
||||
}
|
||||
this.currentView = new BattleView({
|
||||
app: this,
|
||||
user: this.user
|
||||
});
|
||||
},
|
||||
defaultRoute: function(path){
|
||||
this.navigate("lobby", {trigger: true});
|
||||
},
|
||||
parseEvent: function(event){
|
||||
var regex = /(\w+):?(\w*)\|?/g;
|
||||
var res = {};
|
||||
var r;
|
||||
while(r = regex.exec(event)) {
|
||||
res[r[1]] = r[2];
|
||||
}
|
||||
|
||||
return res;
|
||||
}
|
||||
});
|
||||
|
||||
var SideView = Backbone.View.extend({
|
||||
el: ".container",
|
||||
template: Handlebars.compile('<div class="card{{#if _disabled}} disabled{{/if}}" data-key="{{_key}}" data-id="{{_id}}">' +
|
||||
'<img src="../assets/cards/{{_data.img}}.png">' +
|
||||
'</div>'),
|
||||
templateCards: Handlebars.compile('{{#each this}}' +
|
||||
'<div class="card{{#if _disabled}} disabled{{/if}}" data-key="{{_key}}" data-id="{{_id}}">' +
|
||||
'{{#if _boost}}<span>+{{_boost}}</span>{{/if}}' +
|
||||
'<img src="../assets/cards/{{_data.img}}.png">' +
|
||||
'</div>' +
|
||||
'{{/each}}'),
|
||||
initialize: function(options){
|
||||
var self = this;
|
||||
this.side = options.side;
|
||||
this.app = options.app;
|
||||
this.battleView = options.battleView;
|
||||
this.infoData = this.infoData || {};
|
||||
this.leader = this.leader || {};
|
||||
this.field = this.field || {};
|
||||
|
||||
|
||||
},
|
||||
render: function(){
|
||||
this.renderInfo();
|
||||
this.renderCloseField();
|
||||
this.renderRangeField();
|
||||
this.renderSiegeField();
|
||||
this.renderWeatherField();
|
||||
|
||||
return this;
|
||||
},
|
||||
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));
|
||||
this.$info.find(".field-leader").html(this.template(l))
|
||||
|
||||
if(this.app.user.get("waiting") && this.side === ".player"){
|
||||
this.$info.addClass("removeBackground");
|
||||
}
|
||||
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;
|
||||
this.$fields = this.$el.find(".battleside" + this.side);
|
||||
var $field = this.$fields.find(".field-close").parent();
|
||||
var cards = this.field.close._cards;
|
||||
var score = this.field.close._score;
|
||||
|
||||
var html = this.templateCards(cards);
|
||||
|
||||
$field.find(".field-close").html(html)
|
||||
$field.find(".large-field-counter").html(score)
|
||||
},
|
||||
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 html = this.templateCards(cards);
|
||||
|
||||
$field.find(".field-range").html(html)
|
||||
$field.find(".large-field-counter").html(score)
|
||||
},
|
||||
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 html = this.templateCards(cards);
|
||||
|
||||
$field.find(".field-siege").html(html)
|
||||
$field.find(".large-field-counter").html(score)
|
||||
},
|
||||
renderWeatherField: function(){
|
||||
if(!this.field.weather) return;
|
||||
var $weatherField = this.$el.find(".field-weather");
|
||||
var cards = this.field.weather._cards;
|
||||
$weatherField.html(this.templateCards(cards));
|
||||
|
||||
return this;
|
||||
},
|
||||
lives: function(lives){
|
||||
var out = "";
|
||||
for(var i = 0; i < 2; i++) {
|
||||
out += "<i";
|
||||
if(i < lives){
|
||||
out += " class='ruby'";
|
||||
}
|
||||
out += "></i>";
|
||||
}
|
||||
return out;
|
||||
}
|
||||
});
|
||||
|
||||
var BattleView = Backbone.View.extend({
|
||||
className: "container",
|
||||
template: Handlebars.compile($("#battle-template").html()),
|
||||
templatePreview: Handlebars.compile($("#preview-template").html()),
|
||||
initialize: function(options){
|
||||
var self = this;
|
||||
var user = this.user = options.user;
|
||||
var app = this.app = options.app;
|
||||
var yourSide, otherSide;
|
||||
|
||||
$(this.el).prependTo('body');
|
||||
|
||||
this.listenTo(user, "change:showPreview", this.renderPreview);
|
||||
this.listenTo(user, "change:waiting", this.render);
|
||||
this.listenTo(user, "change:passing", this.render);
|
||||
this.listenTo(user, "change:openDiscard", this.render);
|
||||
this.listenTo(user, "change:setAgile", this.render);
|
||||
|
||||
this.$hand = this.$el.find(".field-hand");
|
||||
this.$preview = this.$el.find(".card-preview");
|
||||
|
||||
|
||||
var interval = setInterval(function(){
|
||||
if(!user.get("room")) return;
|
||||
this.setUpBattleEvents(user.get("room"));
|
||||
this.app.send("request:gameLoaded", {_roomID: user.get("room")});
|
||||
clearInterval(interval);
|
||||
}.bind(this), 10);
|
||||
|
||||
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});
|
||||
|
||||
},
|
||||
events: {
|
||||
"mouseover .card": "onMouseover",
|
||||
"mouseleave .card": "onMouseleave",
|
||||
"click .field-hand": "onClick",
|
||||
"click .battleside.player": "onClickFieldCard",
|
||||
"click .button-pass": "onPassing",
|
||||
"click .field-discard": "openDiscard",
|
||||
"click .field-leader": "clickLeader"
|
||||
},
|
||||
onPassing: function(){
|
||||
if(this.user.get("passing")) return;
|
||||
if(this.user.get("waiting")) return;
|
||||
this.user.set("passing", true);
|
||||
this.user.get("app").send("set:passing");
|
||||
},
|
||||
onClick: function(e){
|
||||
if(!!this.user.get("waiting")) return;
|
||||
if(!!this.user.get("passing")) return;
|
||||
|
||||
var self = this;
|
||||
var $card = $(e.target).closest(".card");
|
||||
var id = $card.data("id");
|
||||
var key = $card.data("key");
|
||||
|
||||
if(!!this.user.get("setAgile")){
|
||||
if(id === this.user.get("setAgile")){
|
||||
this.user.set("setAgile", false);
|
||||
this.app.send("cancel:agile");
|
||||
this.render();
|
||||
}
|
||||
return;
|
||||
}
|
||||
if(!!this.user.get("waitForDecoy")){
|
||||
if(id === this.user.get("waitForDecoy")){
|
||||
this.user.set("waitForDecoy", false);
|
||||
this.app.send("cancel:decoy");
|
||||
this.render();
|
||||
}
|
||||
return;
|
||||
}
|
||||
|
||||
this.app.send("play:cardFromHand", {
|
||||
id: id
|
||||
});
|
||||
|
||||
if(key === "decoy"){
|
||||
console.log("its decoy!!!");
|
||||
this.user.set("waitForDecoy", id);
|
||||
this.render();
|
||||
}
|
||||
},
|
||||
onClickFieldCard: function(e){
|
||||
if(this.user.get("waitForDecoy")){
|
||||
var $card = $(e.target).closest(".card");
|
||||
var _id = $card.data("id");
|
||||
this.app.send("decoy:replaceWith", {
|
||||
cardID: _id
|
||||
})
|
||||
this.user.set("waitForDecoy", false);
|
||||
}
|
||||
if(this.user.get("setAgile")) {
|
||||
var $field = $(e.target).closest(".field.active").find(".field-close, .field-range");
|
||||
|
||||
console.log($field);
|
||||
var target = $field.hasClass("field-close") ? 0 : 1;
|
||||
this.app.send("agile:field", {
|
||||
field: target
|
||||
});
|
||||
this.user.set("setAgile", false);
|
||||
}
|
||||
},
|
||||
onMouseover: function(e){
|
||||
var target = $(e.target).closest(".card");
|
||||
this.user.set("showPreview", target.find("img").attr("src"));
|
||||
},
|
||||
onMouseleave: function(e){
|
||||
this.user.set("showPreview", null);
|
||||
},
|
||||
openDiscard: function(e){
|
||||
var $discard = $(e.target).closest(".field-discard");
|
||||
console.log("opened discard");
|
||||
var side;
|
||||
if($discard.parent().hasClass("player")){
|
||||
side = this.yourSide;
|
||||
}
|
||||
else {
|
||||
side = this.otherSide;
|
||||
}
|
||||
this.user.set("openDiscard", {
|
||||
discard: side.infoData.discard,
|
||||
name: side.infoData.name
|
||||
});
|
||||
},
|
||||
render: function(){
|
||||
var self = this;
|
||||
this.$el.html(this.template({
|
||||
cards: self.handCards,
|
||||
agile: self.user.get("setAgile")
|
||||
}));
|
||||
if(!(this.otherSide && this.yourSide)) return;
|
||||
this.otherSide.render();
|
||||
this.yourSide.render();
|
||||
|
||||
|
||||
if(this.user.get("openDiscard")){
|
||||
var modal = new Modal({model: this.user});
|
||||
this.$el.prepend(modal.render().el);
|
||||
}
|
||||
if(this.user.get("medicDiscard")){
|
||||
var modal = new MedicModal({model: this.user});
|
||||
this.$el.prepend(modal.render().el);
|
||||
}
|
||||
if(this.user.get("setAgile")){
|
||||
var id = this.user.get("setAgile");
|
||||
this.$el.find("[data-id='" + id + "']").addClass("activeCard");
|
||||
}
|
||||
if(this.user.get("waitForDecoy")){
|
||||
var id = this.user.get("waitForDecoy");
|
||||
this.$el.find("[data-id='" + id + "']").addClass("activeCard");
|
||||
}
|
||||
return this;
|
||||
},
|
||||
renderPreview: function(){
|
||||
this.$el.find(".card-preview").html(this.templatePreview({src: this.user.get("showPreview")}))
|
||||
},
|
||||
clickLeader: function(e){
|
||||
var $card = $(e.target).closest(".field-leader");
|
||||
console.log("click leader");
|
||||
if(!$card.parent().hasClass("player")) return;
|
||||
if($card.hasClass("disabled")) return;
|
||||
|
||||
|
||||
this.app.send("activate:leader")
|
||||
},
|
||||
setUpBattleEvents: function(channelName){
|
||||
this.battleChannel = this.app.socket.subscribe(channelName);
|
||||
var self = this;
|
||||
var user = this.user;
|
||||
|
||||
this.battleChannel.watch(function(d){
|
||||
var event = d.event, data = d.data;
|
||||
|
||||
if(event === "update:hand"){
|
||||
if(user.get("roomSide") == data._roomSide){
|
||||
self.handCards = JSON.parse(data.cards);
|
||||
self.user.set("handCards", self.handCards);
|
||||
self.render();
|
||||
}
|
||||
}
|
||||
else if(event === "update:info"){
|
||||
var _side = data._roomSide;
|
||||
var infoData = data.info;
|
||||
var leader = data.leader;
|
||||
|
||||
var side = self.yourSide;
|
||||
if(user.get("roomSide") != _side){
|
||||
side = self.otherSide;
|
||||
}
|
||||
side.infoData = infoData;
|
||||
side.leader = leader;
|
||||
|
||||
side.infoData.discard = JSON.parse(side.infoData.discard);
|
||||
|
||||
side.render();
|
||||
}
|
||||
else if(event === "update:fields"){
|
||||
var _side = data._roomSide;
|
||||
|
||||
var side = self.yourSide;
|
||||
if(user.get("roomSide") != _side){
|
||||
side = self.otherSide;
|
||||
}
|
||||
side.field.close = data.close;
|
||||
side.field.ranged = data.ranged;
|
||||
side.field.siege = data.siege;
|
||||
side.field.weather = data.weather;
|
||||
side.render();
|
||||
}
|
||||
})
|
||||
}
|
||||
});
|
||||
|
||||
var Modal = Backbone.Modal.extend({
|
||||
template: Handlebars.compile($("#modal-template").html()),
|
||||
cancelEl: ".bbm-close",
|
||||
cancel: function(){
|
||||
this.model.set("openDiscard", false);
|
||||
}
|
||||
});
|
||||
|
||||
var MedicModal = Modal.extend({
|
||||
template: Handlebars.compile($("#modal-medic-template").html()),
|
||||
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("medic:chooseCardFromDiscard", {
|
||||
cardID: id
|
||||
})
|
||||
this.model.set("medicDiscard", false);
|
||||
},
|
||||
cancel: function(){
|
||||
this.model.get("app").send("medic:chooseCardFromDiscard")
|
||||
this.model.set("medicDiscard", false);
|
||||
}
|
||||
});
|
||||
|
||||
var User = Backbone.Model.extend({
|
||||
defaults: {
|
||||
name: "",
|
||||
deckKey: "northern_realm"
|
||||
},
|
||||
initialize: function(){
|
||||
var self = this;
|
||||
var app = this.get("app");
|
||||
|
||||
this.listenTo(this.attributes, "change:room", this.subscribeRoom);
|
||||
|
||||
app.receive("response:name", function(data){
|
||||
self.set("name", data.name);
|
||||
});
|
||||
|
||||
app.receive("init:battle", function(data){
|
||||
console.log("opponent found!");
|
||||
self.set("roomSide", data.side);
|
||||
/*
|
||||
self.set("channel:battle", app.socket.subscribe(self.get("room")));*/
|
||||
app.navigate("battle", {trigger: true});
|
||||
})
|
||||
|
||||
app.receive("response:createRoom", function(roomID){
|
||||
self.set("room", roomID);
|
||||
console.log("room created", roomID);
|
||||
});
|
||||
|
||||
app.receive("response:joinRoom", function(roomID){
|
||||
self.set("room", roomID);
|
||||
console.log("room id", self.get("room"));
|
||||
})
|
||||
|
||||
app.receive("set:waiting", function(data){
|
||||
var waiting = data.waiting;
|
||||
self.set("waiting", waiting);
|
||||
})
|
||||
|
||||
app.receive("set:passing", function(data){
|
||||
var passing = data.passing;
|
||||
self.set("passing", passing);
|
||||
})
|
||||
|
||||
app.receive("foe:left", function(){
|
||||
console.log("your foe left the room");
|
||||
$(".container").prepend('<div class="alert alert-danger">Your foe left the battle!</div>')
|
||||
})
|
||||
|
||||
app.receive("played:medic", function(data){
|
||||
var cards = JSON.parse(data.cards);
|
||||
console.log("played medic");
|
||||
self.set("medicDiscard", {
|
||||
cards: cards
|
||||
});
|
||||
})
|
||||
|
||||
app.receive("played:agile", function(data){
|
||||
console.log("played agile");
|
||||
self.set("setAgile", data.cardID);
|
||||
})
|
||||
|
||||
app.on("createRoom", this.createRoom, this);
|
||||
app.on("joinRoom", this.joinRoom, this);
|
||||
app.on("setName", this.setName, this);
|
||||
app.on("setDeck", this.setDeck, this);
|
||||
|
||||
|
||||
app.send("request:name", this.get("name") == "unnamed" ? null : {name: this.get("name")});
|
||||
},
|
||||
createRoom: function(){
|
||||
this.get("app").send("request:createRoom");
|
||||
},
|
||||
joinRoom: function(){
|
||||
this.get("app").send("request:joinRoom");
|
||||
},
|
||||
subscribeRoom: function(){
|
||||
var room = this.get("room");
|
||||
var app = this.get("app");
|
||||
app.socket.subscribe(room);
|
||||
},
|
||||
setName: function(name){
|
||||
this.get("app").send("request:name", {name: name});
|
||||
},
|
||||
setDeck: function(deckKey){
|
||||
console.log("deck: ", deckKey);
|
||||
this.set("deckKey", deckKey);
|
||||
this.get("app").send("set:deck", {deck: deckKey});
|
||||
}
|
||||
});
|
||||
|
||||
var Lobby = Backbone.View.extend({
|
||||
defaults: {
|
||||
id: ""
|
||||
},
|
||||
className: "container",
|
||||
|
||||
template: Handlebars.compile($("#matchmaker-template").html()),
|
||||
initialize: function(options){
|
||||
this.user = options.user;
|
||||
this.app = options.app;
|
||||
this.listenTo(this.app.user, "change", this.render);
|
||||
$(this.el).prependTo('body');
|
||||
this.render();
|
||||
},
|
||||
events: {
|
||||
"click .create-room": "createRoom",
|
||||
"click .join-room": "joinRoom",
|
||||
"blur .name-input": "changeName",
|
||||
"change #deckChoice": "setDeck"
|
||||
},
|
||||
render: function(){
|
||||
this.$el.html(this.template(this.user.attributes));
|
||||
/*this.$el.find("#deckChoice option[value='" + this.app.user.get("setDeck") + "']").attr("selected", "selected")*/
|
||||
return this;
|
||||
},
|
||||
createRoom: function(){
|
||||
this.app.trigger("createRoom");
|
||||
},
|
||||
joinRoom: function(){
|
||||
this.app.trigger("joinRoom");
|
||||
},
|
||||
setDeck: function(e){
|
||||
var val = $(e.target).val();
|
||||
this.app.trigger("setDeck", val);
|
||||
this.$el.find("#deckChoice option[value='" + val + "']").attr("selected", "selected")
|
||||
},
|
||||
changeName: function(e){
|
||||
var name = $(e.target).val();
|
||||
this.app.trigger("setName", name);
|
||||
}
|
||||
});
|
||||
|
||||
module.exports = App;
|
||||
7
client/js/main.js
Normal file
7
client/js/main.js
Normal file
@@ -0,0 +1,7 @@
|
||||
|
||||
var App = require("./client");
|
||||
|
||||
(function main(){
|
||||
var app = new App();
|
||||
|
||||
})();
|
||||
Reference in New Issue
Block a user