mirror of
https://github.com/exane/not-gwent-online
synced 2024-10-31 10:36:53 +00:00
better card arrangement
This commit is contained in:
parent
6e51b5f9b7
commit
eb647efa20
@ -156,10 +156,13 @@ var SideView = Backbone.View.extend({
|
||||
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)
|
||||
|
||||
calculateCardMargin($field.find(".card"), 433, 70, cards.length);
|
||||
},
|
||||
renderRangeField: function(){
|
||||
if(!this.field.ranged) return;
|
||||
@ -172,6 +175,7 @@ var SideView = Backbone.View.extend({
|
||||
|
||||
$field.find(".field-range").html(html)
|
||||
$field.find(".large-field-counter").html(score)
|
||||
calculateCardMargin($field.find(".card"), 433, 70, cards.length);
|
||||
},
|
||||
renderSiegeField: function(){
|
||||
if(!this.field.siege) return;
|
||||
@ -184,6 +188,7 @@ var SideView = Backbone.View.extend({
|
||||
|
||||
$field.find(".field-siege").html(html)
|
||||
$field.find(".large-field-counter").html(score)
|
||||
calculateCardMargin($field.find(".card"), 433, 70, cards.length);
|
||||
},
|
||||
renderWeatherField: function(){
|
||||
if(!this.field.weather) return;
|
||||
@ -206,6 +211,18 @@ var SideView = Backbone.View.extend({
|
||||
}
|
||||
});
|
||||
|
||||
var calculateCardMargin = function($selector, totalWidth, cardWidth, n){
|
||||
var w = totalWidth, c = cardWidth;
|
||||
var res;
|
||||
if(n < 7)
|
||||
res = 0;
|
||||
else {
|
||||
res = -((w - c) / (n - 1) - c) + 1
|
||||
}
|
||||
|
||||
$selector.css("margin-left", -res);
|
||||
}
|
||||
|
||||
var BattleView = Backbone.View.extend({
|
||||
className: "container",
|
||||
template: Handlebars.compile($("#battle-template").html()),
|
||||
@ -344,6 +361,7 @@ var BattleView = Backbone.View.extend({
|
||||
this.otherSide.render();
|
||||
this.yourSide.render();
|
||||
|
||||
calculateCardMargin(this.$el.find(".field-hand .card"), 538, 70, this.handCards.length);
|
||||
|
||||
if(this.user.get("openDiscard")){
|
||||
var modal = new Modal({model: this.user});
|
||||
|
@ -19,8 +19,16 @@ $game-height: 800px;
|
||||
.field {
|
||||
width: 100%;
|
||||
height: 100px;
|
||||
border: 1px solid black;
|
||||
border: 1px solid black;/*
|
||||
overflow: hidden;
|
||||
|
||||
&:hover {
|
||||
overflow: visible;
|
||||
}*/
|
||||
|
||||
.card:first-child {
|
||||
margin-left: 0 !important;
|
||||
}
|
||||
&.active {
|
||||
box-shadow: 0px 0px 15px #ffbb0b;
|
||||
|
||||
@ -34,7 +42,10 @@ $game-height: 800px;
|
||||
.field-hand {
|
||||
margin-top: 20px;
|
||||
.card {
|
||||
margin-left: -20px;
|
||||
margin-left: -31px;
|
||||
&:first-child {
|
||||
margin-left: 0 !important;
|
||||
}
|
||||
&:hover {
|
||||
position: relative;
|
||||
z-index: 10;
|
||||
@ -48,10 +59,10 @@ $game-height: 800px;
|
||||
}
|
||||
|
||||
.field-single {
|
||||
border: 1px solid black;
|
||||
height: 150px;
|
||||
width: 85px;
|
||||
margin: 5px;
|
||||
border: 1px solid black;/*
|
||||
width: 85px;*/
|
||||
/*margin: 5px;*/
|
||||
height: 98px;
|
||||
}
|
||||
|
||||
.left-side {
|
||||
|
Loading…
Reference in New Issue
Block a user