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

lobby changes

This commit is contained in:
exane 2015-07-01 18:55:50 +02:00
parent f9a2278b64
commit cdbb5443af
8 changed files with 66 additions and 29 deletions

BIN
assets/content-load.gif Normal file

Binary file not shown.

After

Width:  |  Height:  |  Size: 14 KiB

View File

@ -13,7 +13,7 @@
<div class="container">
<div class="row">
<div class="notifications"></div>
<div class="gwent-battle"></div>
<div class="gwent-battle"></div>
</div>
</div>
<script src="build/app.js"></script>

View File

@ -26,7 +26,7 @@ Handlebars.registerHelper("formatMessage", function(msg){
let out = "";
var lines = msg.split(/\n/g);
lines.forEach(function(line) {
lines.forEach(function(line){
out += line + "<br>";
})
@ -49,6 +49,14 @@ let App = Backbone.Router.extend({
},
connect: function(){
this.socket = socket(Config.Server.hostname + ":" + Config.Server.port);
var self = this;
console.log(this.socket.connected);
this.socket.on("connect", function(socket){
self.user.set("serverOffline", false);
})
this.socket.on("disconnect", function(socket){
self.user.set("serverOffline", true);
})
},
receive: function(event, cb){
this.socket.on(event, cb);
@ -681,8 +689,9 @@ let ChooseSideModal = Modal.extend({
let User = Backbone.Model.extend({
defaults: {
name: "",
deckKey: "northern"
name: localStorage["userName"] || null,
deck: localStorage["userDeck"] || null,
serverOffline: true
},
initialize: function(){
let self = this;
@ -788,11 +797,12 @@ let User = Backbone.Model.extend({
app.on("setDeck", this.setDeck, this);
app.receive("notification", function(data) {
app.receive("notification", function(data){
new Notification(data).render();
})
app.send("request:name", this.get("name") == "unnamed" ? null : {name: this.get("name")});
app.send("request:name", this.get("name") === null ? null : {name: this.get("name")});
app.send("set:deck", this.get("deck") === null ? null : {deck: this.get("deck")});
},
startMatchmaking: function(){
this.set("inMatchmakerQueue", true);
@ -809,10 +819,12 @@ let User = Backbone.Model.extend({
},
setName: function(name){
this.get("app").send("request:name", {name: name});
localStorage["userName"] = name;
},
setDeck: function(deckKey){
//console.log("deck: ", deckKey);
this.set("deckKey", deckKey);
localStorage["userDeck"] = deckKey;
this.get("app").send("set:deck", {deck: deckKey});
},
chooseSide: function(roomSide){
@ -832,7 +844,6 @@ let Lobby = Backbone.View.extend({
this.user = options.user;
this.app = options.app;
this.listenTo(this.app.user, "change", this.render);
//$(this.el).prependTo('body');
$(".gwent-battle").html(this.el);
this.render();
},
@ -843,12 +854,12 @@ let Lobby = Backbone.View.extend({
"change #deckChoice": "setDeck",
"click .note": "debugNote"
},
debugNote: function() {
debugNote: function(){
new Notification({message: "yoyo TEST\nhallo\n\ntest"}).render();
},
render: function(){
this.$el.html(this.template(this.user.attributes));
/*this.$el.find("#deckChoice option[value='" + this.app.user.get("setDeck") + "']").attr("selected", "selected")*/
this.$el.find("#deckChoice").val(this.user.get("deck")).attr("selected", true);
return this;
},
startMatchmaking: function(){
@ -923,7 +934,7 @@ let Notification = Backbone.View.extend({
let $alert = this.$el.find(".alert");
$alert.stop().slideUp().queue(this.remove.bind(this));
},
onClick: function() {
onClick: function(){
this.hide();
}
});

View File

@ -321,6 +321,20 @@ $game-height: 800px;
}
}
.startMatchmaking {
height: 50px;
line-height: 35px;
width: 200px;
text-align: left;
}
.image-gif-loader {
background: url("../../assets/content-load.gif");
display: block;
height: 32px;
width: 32px;
margin-left: 10px;
}
@keyframes waitForOpponent{
0% {

View File

@ -1,11 +1,18 @@
<div class="col-xs-12">
<div class="panel panel-default">
<div class="panel-heading">Gwent</div>
<div class="panel-heading">Gwent
{{#if serverOffline}}
<span class="pull-right">Server Status: <span class="label label-danger">Offline</span></span>
{{else}}
<span class="pull-right">Server Status: <span class="label label-success">Online</span></span>
{{/if}}
</div>
<div class="panel-body">
<div class="row">
<div class="col-xs-12">
<input type="text" class="name-input" value="{{name}}">
<select id="deckChoice">
<option value="random">Deck: Random</option>
<option value="northern">Deck: Northern Realms</option>
<option value="scoiatael">Deck: Scoia'tael</option>
<option value="monster">Deck: Monster</option>
@ -13,16 +20,17 @@
</select>
</div>
</div>
<br>
<div class="row">
<div class="col-xs-12">
<button type="button" class="btn btn-primary startMatchmaking"{{#if inMatchmakerQueue}} disabled{{/if}}>
Search Opponent
{{#if inMatchmakerQueue}}<img src="../site/public/assets/img/content-load.gif" width=20 style="margin: 5px;"> {{/if}}
Search Opponent
{{#if inMatchmakerQueue}}
<i class="image-gif-loader pull-right"></i>
{{/if}}
</button>
<!--<button type="button" class="btn btn-primary join-room">Join Room</button>-->
<button type="button" class="btn btn-success note">debug note</button>
<!--<button type="button" class="btn btn-success note">debug note</button>-->
</div>
</div>
</div>
</div>

View File

@ -34,7 +34,7 @@ Battleside = (function(){
this._name = user.getName();
this.battle = battle;
this.hand = Hand();
this.deck = Deck(DeckData[deck], this);
this.deck = Deck(deck, this);
this._discard = [];
this.runEvent = this.battle.runEvent.bind(this.battle);

View File

@ -1,6 +1,7 @@
var Card = require("./Card");
/*var CardManager = require("./CardManager");*/
var DeckData = require("../assets/data/deck");
var _ = require("underscore");
var Deck = (function(){
var Deck = function(deck, side){
@ -14,11 +15,10 @@ var Deck = (function(){
this.side = side;
this._deck = [];
if(typeof deck !== "object") throw new Error("Deck is not an object!");
//if(typeof deck !== "object") throw new Error("Deck is not an object!");
this._originalDeck = [];
this._faction = deck.faction;
this.setDeck(deck.data);
this.setDeck(deck);
};
var r = Deck.prototype;
/**
@ -40,18 +40,23 @@ var Deck = (function(){
MONSTERS: "monster"
}
r.setDeck = function(deckData){
if(!Array.isArray(deckData)) {
deckData = DeckData["northern"];
r.setDeck = function(deckKey){
var deck = DeckData[deckKey] ? DeckData[deckKey] : DeckData["northern"];
if(deckKey === "random"){
var decks = _.allKeys(DeckData);
deck = DeckData[decks[(Math.random() * decks.length) | 0]];
}
this._originalDeck = deckData.slice();
this._deck = deckData.slice();
this._originalDeck = deck.data.slice();
this._deck = deck.data.slice();
this._faction = deck.faction;
this._loadCards();
this.shuffle();
}
r.getFaction = function() {
r.getFaction = function(){
return this._faction;
}

View File

@ -45,8 +45,7 @@ var User = (function(){
}
r.generateName = function(){
var name = "Player" + (((Math.random() * 8999) + 1000) | 0);
//if(lobby.hasUser(name)) return generateName();
var name = "Guest" + (((Math.random() * 8999) + 1000) | 0);
this._name = name;
return name;
}
@ -70,7 +69,7 @@ var User = (function(){
}
r.getDeck = function() {
return this._deck || "northern";
return this._deck;
}
r.addRoom = function(room) {