mirror of
https://github.com/exane/not-gwent-online
synced 2024-11-23 19:36:53 +00:00
update
This commit is contained in:
exane
parent
4f98d3d651
commit
a2ca580844
@ -17,7 +17,8 @@
|
||||
"devDependencies": {
|
||||
"handlebars": "^3.0.3",
|
||||
"jquery": "^2.1.4",
|
||||
"promise": "^7.0.1"
|
||||
"promise": "^7.0.1",
|
||||
"shortid": "^2.2.2"
|
||||
},
|
||||
"scripts": {
|
||||
"test": "echo \"Error: no test specified\" && exit 1"
|
||||
|
||||
@ -10,7 +10,7 @@
|
||||
<body>
|
||||
<div class="container board">
|
||||
<div class="col-xs-3 left-side">
|
||||
<div class="col-xs-12 game-info game-info-enemy enemy">
|
||||
<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">
|
||||
@ -37,35 +37,11 @@
|
||||
field
|
||||
</div>
|
||||
<div class="col-xs-12 game-info game-info-player player">
|
||||
<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></i>
|
||||
</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="row">
|
||||
<div class="col-xs-12 battleside battleside-enemy enemy">
|
||||
<div class="col-xs-12 battleside battleside-foe foe">
|
||||
<div class="col-xs-12 field">
|
||||
<div class="col-xs-1 large-field-counter">0</div>
|
||||
<div class="col-xs-11 field-siege"></div>
|
||||
@ -102,7 +78,7 @@
|
||||
</div>
|
||||
<div class="col-xs-3">
|
||||
<div class="col-xs-12 card-preview"></div>
|
||||
<div class="col-xs-12 right-side right-side-enemy enemy">
|
||||
<div class="col-xs-12 right-side right-side-foe foe">
|
||||
<div class="col-xs-5 field-discard field-single">
|
||||
discard deck
|
||||
</div>
|
||||
@ -120,6 +96,52 @@
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<script id="matchmaker-template" type="text/x-handlebars-template">
|
||||
<div class="col-xs-12">
|
||||
<div class="panel panel-default">
|
||||
<div class="panel-heading">Gwent</div>
|
||||
<div class="panel-body">
|
||||
<div class="row">
|
||||
<div class="col-xs-12">
|
||||
<input type="text" class="name-input" value="{{name}}">
|
||||
</div>
|
||||
</div>
|
||||
<div class="row">
|
||||
<div class="col-xs-12">
|
||||
<button type="button" class="btn btn-primary create-room">Create Room</button>
|
||||
<button type="button" class="btn btn-primary join-room">Join Room</button>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</script>
|
||||
<script id="game-info-template" type="text/x-handlebars-template">
|
||||
<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">
|
||||
<!--<i class="ruby"></i>-->
|
||||
{{#health lives}}{{/health}}
|
||||
</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>
|
||||
</script>
|
||||
<script src="../build/app.js"></script>
|
||||
</body>
|
||||
</html>
|
||||
|
||||
@ -1,8 +1,152 @@
|
||||
var io = require("socket.io-client")("http://localhost:16918");
|
||||
var Backbone = require("backbone");
|
||||
var Player = require("./Player");
|
||||
var Handlebars = require("handlebars");
|
||||
var $ = require("jquery");
|
||||
|
||||
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 App = Backbone.Router.extend({
|
||||
routes: {
|
||||
"*other": "defaultRoute"
|
||||
},
|
||||
initialize: function(){
|
||||
|
||||
},
|
||||
defaultRoute: function(){
|
||||
|
||||
},
|
||||
search: function(){
|
||||
|
||||
}
|
||||
|
||||
});
|
||||
|
||||
var Player = Backbone.Model.extend({
|
||||
defaults: {
|
||||
name: "",
|
||||
lives: 2,
|
||||
MAX_LIVES: 2,
|
||||
hand: 0,
|
||||
score: 0
|
||||
},
|
||||
initialize: function(){
|
||||
var self = this;
|
||||
window.self = self;
|
||||
this.send("request:name", this.get("name") == "unnamed" ? null : {name: this.get("name")});
|
||||
|
||||
this.receive("response:name", function(data){
|
||||
self.set("name", data.name);
|
||||
});
|
||||
|
||||
this.receive("init:battle", function(){
|
||||
console.log("opponent found!");
|
||||
|
||||
})
|
||||
|
||||
|
||||
this.receive("response:createRoom", function(roomID){
|
||||
self.get("room").set("id", roomID);
|
||||
console.log("room created", roomID);
|
||||
});
|
||||
this.receive("response:joinRoom", function(roomID){
|
||||
var room = new Room();
|
||||
room.set("id", roomID);
|
||||
self.set("room", room);
|
||||
})
|
||||
|
||||
},
|
||||
receive: function(event, cb){
|
||||
this.get("socket").on(event, cb);
|
||||
},
|
||||
send: function(event, data, room){
|
||||
data = data || null;
|
||||
room = room || null;
|
||||
var socket = this.get("socket");
|
||||
|
||||
if(!data && !room){
|
||||
socket.emit(event);
|
||||
}
|
||||
else if(data && !room){
|
||||
socket.emit(event, data);
|
||||
}
|
||||
else if(!data && room){
|
||||
socket.to(room).emit(event);
|
||||
}
|
||||
else {
|
||||
socket.to(room).emit(event, data);
|
||||
}
|
||||
},
|
||||
setName: function(name){
|
||||
this.send("request:name", {name: name});
|
||||
}
|
||||
});
|
||||
|
||||
var Battleside = Backbone.Model.extend({
|
||||
|
||||
});
|
||||
|
||||
var Room = Backbone.Model.extend({
|
||||
defaults: {
|
||||
id: ""
|
||||
},
|
||||
initialize: function(){
|
||||
|
||||
}
|
||||
});
|
||||
|
||||
var RoomView = Backbone.View.extend({
|
||||
el: ".container",
|
||||
template: Handlebars.compile($("#matchmaker-template").html()),
|
||||
initialize: function(){
|
||||
this.listenTo(this.model, "change", this.render);
|
||||
this.render();
|
||||
},
|
||||
events: {
|
||||
"click .create-room": "createRoom",
|
||||
"click .join-room": "joinRoom",
|
||||
"blur .name-input": "changeName"
|
||||
},
|
||||
render: function(){
|
||||
this.$el.html(this.template(this.model.attributes));
|
||||
return this;
|
||||
},
|
||||
createRoom: function(){
|
||||
var room = new Room();
|
||||
this.model.set("room", room);
|
||||
this.model.send("request:createRoom");
|
||||
},
|
||||
joinRoom: function(){
|
||||
this.model.send("request:joinRoom");
|
||||
},
|
||||
changeName: function(e){
|
||||
var name = $(e.target).val();
|
||||
this.model.setName(name);
|
||||
}
|
||||
})
|
||||
;
|
||||
|
||||
var InfoView = Backbone.View.extend({
|
||||
template: Handlebars.compile($("#game-info-template").html()),
|
||||
initialize: function(){
|
||||
this.listenTo(this.model, "change", this.render);
|
||||
this.render();
|
||||
},
|
||||
render: function(){
|
||||
this.$el.html(this.template(this.model.attributes));
|
||||
return this;
|
||||
}
|
||||
});
|
||||
|
||||
|
||||
var Gwent = (function(){
|
||||
@ -15,7 +159,6 @@ var Gwent = (function(){
|
||||
*/
|
||||
|
||||
|
||||
|
||||
};
|
||||
var r = Gwent.prototype;
|
||||
/**
|
||||
@ -24,16 +167,30 @@ var Gwent = (function(){
|
||||
* r.getProperty = function() {...}
|
||||
*/
|
||||
r.view = null;
|
||||
r.enemy = null;
|
||||
r.foe = null;
|
||||
r.player = null;
|
||||
r.playerView = null;
|
||||
r.foeView = null;
|
||||
|
||||
r._view = function() {
|
||||
|
||||
}
|
||||
|
||||
r.init = function(){
|
||||
this.player = Backbone.Model.extend({});
|
||||
this.enemy = Backbone.Model.extend({});
|
||||
var app = new App();
|
||||
Backbone.history.start();
|
||||
|
||||
window.player = this.player = new Player({
|
||||
battleside: new Battleside(),
|
||||
socket: io
|
||||
});
|
||||
|
||||
/* this.playerView = new InfoView({
|
||||
el: ".game-info-player",
|
||||
model: this.player
|
||||
});*/
|
||||
|
||||
this.roomView = new RoomView({
|
||||
model: this.player
|
||||
});
|
||||
|
||||
}
|
||||
|
||||
|
||||
|
||||
@ -1,23 +0,0 @@
|
||||
var Player = (function(){
|
||||
var Player = function(){
|
||||
if(!(this instanceof Player)){
|
||||
return (new Player());
|
||||
}
|
||||
/**
|
||||
* constructor here
|
||||
*/
|
||||
|
||||
|
||||
};
|
||||
var r = Player.prototype;
|
||||
/**
|
||||
* methods && properties here
|
||||
* r.property = null;
|
||||
* r.getProperty = function() {...}
|
||||
*/
|
||||
|
||||
|
||||
return Player;
|
||||
})();
|
||||
|
||||
module.exports = Player;
|
||||
@ -4,4 +4,6 @@ var Gwent = require("./Gwent");
|
||||
(function main(){
|
||||
var gwent = Gwent();
|
||||
|
||||
gwent.init();
|
||||
|
||||
})();
|
||||
|
||||
@ -94,3 +94,4 @@ i {
|
||||
background: url("../assets/ruby.png");
|
||||
}
|
||||
}
|
||||
|
||||
|
||||
@ -22,7 +22,9 @@ var Battle = (function(){
|
||||
r.init = function(p1, p2){
|
||||
this.setPlayer(p1, p2);
|
||||
this.initBattleside();
|
||||
this.render();
|
||||
this.both(function(p) {
|
||||
p.send("init:battle");
|
||||
})
|
||||
}
|
||||
|
||||
r.setPlayer = function(p1, p2){
|
||||
@ -37,10 +39,8 @@ var Battle = (function(){
|
||||
});
|
||||
}
|
||||
|
||||
r.render = function() {
|
||||
this._player.forEach(function(p) {
|
||||
p.send("update:name", p.getID());
|
||||
});
|
||||
r.both = function() {
|
||||
this._player.forEach(cb);
|
||||
}
|
||||
|
||||
|
||||
|
||||
@ -30,6 +30,10 @@ var Connections = (function(){
|
||||
return this._connections;
|
||||
}
|
||||
|
||||
r.hasUser = function(user) {
|
||||
return !!this._connections[user.getID()];
|
||||
}
|
||||
|
||||
|
||||
return Connections;
|
||||
})();
|
||||
|
||||
@ -1,15 +1,17 @@
|
||||
var Promise = require("promise");
|
||||
|
||||
var Matchmaker = (function(){
|
||||
var Matchmaker = function(){
|
||||
var Matchmaker = function(connections){
|
||||
if(!(this instanceof Matchmaker)){
|
||||
return (new Matchmaker());
|
||||
return (new Matchmaker(connections));
|
||||
}
|
||||
/**
|
||||
* constructor here
|
||||
*/
|
||||
|
||||
this._connections = connections;
|
||||
this._queue = [];
|
||||
|
||||
};
|
||||
var r = Matchmaker.prototype;
|
||||
/**
|
||||
@ -19,6 +21,7 @@ var Matchmaker = (function(){
|
||||
*/
|
||||
|
||||
r._queue = null;
|
||||
r._connections = null;
|
||||
|
||||
r.findOpponent = function(user){
|
||||
var self = this;
|
||||
@ -32,14 +35,16 @@ var Matchmaker = (function(){
|
||||
|
||||
r._checkForOpponent = function(resolve){
|
||||
if(this._queue.length <= 1) return;
|
||||
console.log(this._queue.length);
|
||||
if(!this._checkConnections()) return;
|
||||
this._match(this._queue[0], this._queue[1], resolve);
|
||||
}
|
||||
|
||||
r._match = function(p1, p2, resolve){
|
||||
this._queue.splice(0, 2);
|
||||
var roomID = p1.id + p2.id;
|
||||
p1.send("update:opponent", {opponent: p2.getID()});
|
||||
p2.send("update:opponent", {opponent: p1.getID()});
|
||||
p1.send("get:opponent", {socketID: p2.getID()});
|
||||
p2.send("get:opponent", {socketID: p1.getID()});
|
||||
|
||||
p1.joinRoom(roomID);
|
||||
p2.joinRoom(roomID);
|
||||
@ -47,6 +52,20 @@ var Matchmaker = (function(){
|
||||
resolve(p1, p2, roomID);
|
||||
}
|
||||
|
||||
r._checkConnections = function() {
|
||||
var res = true;
|
||||
var self = this;
|
||||
|
||||
this._queue.forEach(function(user, index) {
|
||||
if(!self._connections.hasUser(user)) {
|
||||
self._queue.splice(index, 1);
|
||||
res = false;
|
||||
}
|
||||
});
|
||||
|
||||
return res;
|
||||
}
|
||||
|
||||
|
||||
return Matchmaker;
|
||||
})();
|
||||
|
||||
59
server/Room.js
Normal file
59
server/Room.js
Normal file
@ -0,0 +1,59 @@
|
||||
var shortid = require("shortid");
|
||||
|
||||
var Room = (function(){
|
||||
var Room = function(){
|
||||
if(!(this instanceof Room)){
|
||||
return (new Room());
|
||||
}
|
||||
/**
|
||||
* constructor here
|
||||
*/
|
||||
|
||||
this._id = shortid.generate();
|
||||
this._room = [];
|
||||
};
|
||||
var r = Room.prototype;
|
||||
/**
|
||||
* methods && properties here
|
||||
* r.property = null;
|
||||
* r.getProperty = function() {...}
|
||||
*/
|
||||
r.MAX_USER = 2;
|
||||
r._room = null;
|
||||
r._id = null;
|
||||
|
||||
r.getID = function() {
|
||||
return this._id;
|
||||
}
|
||||
|
||||
r.join = function(user) {
|
||||
if(this._room.lenght >= 2) return;
|
||||
this._room.push(user);
|
||||
user.setRoom(this);/*
|
||||
user.socket.join(this._id);*/
|
||||
user.joinRoom(this.getID());
|
||||
|
||||
if(!this.isOpen()) {
|
||||
this._room.forEach(function(user) {
|
||||
user.send("init:battle");
|
||||
})
|
||||
}
|
||||
}
|
||||
|
||||
r.isOpen = function() {
|
||||
return !(this._room.length >= 2);
|
||||
}
|
||||
|
||||
r.send = function(event, data) {
|
||||
io.to(this._id).emit(event, data);
|
||||
}
|
||||
|
||||
r.getPlayers = function() {
|
||||
return this._room;
|
||||
}
|
||||
|
||||
|
||||
return Room;
|
||||
})();
|
||||
|
||||
module.exports = Room;
|
||||
@ -1,10 +1,14 @@
|
||||
var app = require('http').createServer();
|
||||
var io = require("socket.io")(app);
|
||||
global.io = require("socket.io")(app);
|
||||
var User = require("./User");
|
||||
var Connections = require("./Connections");
|
||||
var Battle = require("./Battle");
|
||||
var Npc = require("./Npc");
|
||||
var Room = require("./Room");
|
||||
|
||||
/*
|
||||
var Matchmaker = require("./Matchmaker");
|
||||
*/
|
||||
|
||||
var Socket = (function(){
|
||||
var Socket = function(){
|
||||
@ -14,8 +18,11 @@ var Socket = (function(){
|
||||
/**
|
||||
* constructor here
|
||||
*/
|
||||
this.matchmaker = Matchmaker();
|
||||
this.connections = Connections();
|
||||
/*
|
||||
this.matchmaker = Matchmaker(this.connections);
|
||||
*/
|
||||
this._roomCollection = [];
|
||||
app.listen(this.port);
|
||||
this.io = io;
|
||||
this._events();
|
||||
@ -29,27 +36,66 @@ var Socket = (function(){
|
||||
r.io = null;
|
||||
r.port = 16918;
|
||||
r.connections = null;
|
||||
r._roomCollection = null;
|
||||
/*
|
||||
r.matchmaker = null;
|
||||
*/
|
||||
|
||||
r._events = function(){
|
||||
var self = this;
|
||||
this.io.on("connection", function(socket){
|
||||
var user = User(socket);
|
||||
self.connections.add(user);
|
||||
console.log("new user ", user.getID());
|
||||
console.log("new user ", user.getName());
|
||||
|
||||
this.matchmaker.findOpponent(user)
|
||||
/* self.matchmaker.findOpponent(user)
|
||||
.then(function(p1, p2, roomID) {
|
||||
console.log("yo");
|
||||
var battle = Battle();
|
||||
battle.init(p1, p2);
|
||||
})*/
|
||||
|
||||
socket.on("request:name", function(data){
|
||||
if(data && data.name){
|
||||
user.setName(data.name);
|
||||
}
|
||||
socket.emit("response:name", {name: user.getName()});
|
||||
})
|
||||
|
||||
socket.on("request:createRoom", function() {
|
||||
var room = Room();
|
||||
self._roomCollection.push(room);
|
||||
room.join(user);
|
||||
console.log("room %s created by %s", room.getID(), user.getName());
|
||||
user.send("response:createRoom", room.getID());
|
||||
})
|
||||
|
||||
socket.on("request:joinRoom", function() {
|
||||
console.log("joinroom");
|
||||
var interval = setInterval(function(){
|
||||
self._roomCollection.forEach(function(room) {
|
||||
if(room.isOpen()) {
|
||||
room.join(user);
|
||||
clearInterval(interval);
|
||||
console.log("user %s joined room %s", user.getName(), room.getID());
|
||||
user.send("response:joinRoom", room.getID());
|
||||
}
|
||||
});
|
||||
}, 1000);
|
||||
})
|
||||
|
||||
socket.on("request:roomData", function() {
|
||||
var room = user.getRoom();
|
||||
var players = room.getPlayers();
|
||||
user.send("response:roomData", {players: players});
|
||||
})
|
||||
|
||||
socket.on("disconnect", function(){
|
||||
self.connections.remove(user);
|
||||
user.disconnect();
|
||||
})
|
||||
})
|
||||
});
|
||||
}
|
||||
|
||||
return Socket;
|
||||
})();
|
||||
|
||||
|
||||
@ -14,7 +14,7 @@ var User = (function(){
|
||||
|
||||
this.socket = socket;
|
||||
this._id = socket.id;
|
||||
|
||||
this.generateName();
|
||||
};
|
||||
User.prototype = Object.create(Entity.prototype);
|
||||
var r = User.prototype;
|
||||
@ -25,14 +25,16 @@ var User = (function(){
|
||||
*/
|
||||
|
||||
r._id = null;
|
||||
r._name = null;
|
||||
r._room = null;
|
||||
r.socket = null;
|
||||
|
||||
r.getID = function(){
|
||||
return this._id;
|
||||
}
|
||||
|
||||
r.joinRoom = function(room){
|
||||
this.socket.join(room);
|
||||
r.joinRoom = function(roomid){
|
||||
this.socket.join(roomid);
|
||||
}
|
||||
|
||||
r.send = function(event, data, room){
|
||||
@ -46,6 +48,32 @@ var User = (function(){
|
||||
}
|
||||
}
|
||||
|
||||
r.generateName = function(){
|
||||
var name = "Player" + (((Math.random() * 8999) + 1000) | 0);
|
||||
//if(lobby.hasUser(name)) return generateName();
|
||||
this._name = name;
|
||||
return name;
|
||||
}
|
||||
|
||||
r.setName = function(name) {
|
||||
console.log("user name changed from %s to %s", this._name, name);
|
||||
this._name = name;
|
||||
}
|
||||
r.getName = function() {
|
||||
return this._name;
|
||||
}
|
||||
r.getRoom = function() {
|
||||
return this._room;
|
||||
}
|
||||
r.setRoom = function(room) {
|
||||
this._room = room;
|
||||
}
|
||||
|
||||
r.disconnect = function() {
|
||||
|
||||
}
|
||||
|
||||
|
||||
return User;
|
||||
})();
|
||||
|
||||
|
||||
Loading…
Reference in New Issue
Block a user