mirrors/not-gwent-online
1
0
Fork 0
mirror of https://github.com/exane/not-gwent-online synced 2024-11-23 19:36:53 +00:00
Code Releases Activity

add hover events for cards

Browse Source
This commit is contained in:
exane 2015-06-13 22:04:44 +02:00
parent e7559df6f7
commit 363770686d
4 changed files with 26 additions and 14 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

8
public/index.html
View File

@ -74,7 +74,7 @@
<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}}
<div class="card"> <div class="card" data-key="{{_key}}">
<img src='../assets/cards/{{_data.img}}.png'> <img src='../assets/cards/{{_data.img}}.png'>
</div> </div>
{{/each}} {{/each}}
@ -82,7 +82,11 @@
</div> </div>
</div> </div>
<div class="col-xs-3"> <div class="col-xs-3">
<div class="col-xs-12 card-preview"></div> {{#if preview}}
<div class="col-xs-12 card-preview">
<img src="{{preview}}">
</div>
{{/if}}
<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-5 field-discard field-single">
discard deck discard deck

20
public/js/client.js
View File

@ -100,7 +100,10 @@ var BattleView = Backbone.View.extend({
var app = this.app = options.app; var app = this.app = options.app;
$(this.el).prependTo('body'); $(this.el).prependTo('body');
this.listenTo(user, "change:showPreview", this.render);
this.$hand = this.$el.find(".field-hand"); this.$hand = this.$el.find(".field-hand");
this.$preview = this.$el.find(".card-preview");
this.app.receive("update:hand", function(data){ this.app.receive("update:hand", function(data){
console.log("update:hand", user.get("roomSide"), data._roomSide); console.log("update:hand", user.get("roomSide"), data._roomSide);
@ -117,14 +120,27 @@ var BattleView = Backbone.View.extend({
}.bind(this), 100); }.bind(this), 100);
this.render(); this.render();
}, },
events: {
"mouseover .card": "onMouseover",
"mouseleave .card": "onMouseleave"
},
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);
},
render: function(){ render: function(){
var self = this; var self = this;
this.$el.html(this.template({ this.$el.html(this.template({
cards: self.handCards cards: self.handCards,
preview: self.user.get("showPreview")
})); }));
return this; return this;
} }
}); })
;
var User = Backbone.Model.extend({ var User = Backbone.Model.extend({
defaults: { defaults: {

4
public/scss/main.scss
View File

@ -79,8 +79,8 @@ $game-height: 800px;
} }
.card-preview { .card-preview {
position: absolute; position: absolute;/*
display: none; display: none;*/
z-index: 10; z-index: 10;
} }

8
server/Socket.js
View File

@ -66,14 +66,6 @@ var Socket = (function(){
socket.on("request:joinRoom", function(){ socket.on("request:joinRoom", function(){
console.log("joinroom"); console.log("joinroom");
var interval = setInterval(function(){ 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());
}
});*/
for(var key in self.roomCollection) { for(var key in self.roomCollection) {
var room = self.roomCollection[key]; var room = self.roomCollection[key];
if(!room.isOpen()) continue; if(!room.isOpen()) continue;