Skillrows overhauled to material design specs

This commit is contained in:
Thaum
2015-02-03 14:06:51 +00:00
parent 58917ce3db
commit 63df21934d
5 changed files with 42 additions and 66 deletions

View File

@@ -184,7 +184,7 @@ Schemas.Character = new SimpleSchema({
deathSave: { type: Schemas.DeathSave },
time: { type: Number, min: 0, decimal: true, defaultValue: 0},
initiativeRoll: { type: Number, min: 0, max: 1, decimal: true, defaultValue: 0},
//permissions
owner: { type: String, regEx: SimpleSchema.RegEx.Id },
readers: { type: [String], regEx: SimpleSchema.RegEx.Id },
@@ -405,15 +405,22 @@ Characters.helpers({
var charId = this._id
var mod = +this.skillMod(skillName);
var value = 10 + mod;
Effects.find({charId: charId, stat: skillName, enabled: true}).forEach(function(effect){
if(effect.operation === "passiveAdd"){
value += evaluateEffect(charId, effect);
}
Effects.find({charId: charId, stat: skillName, enabled: true, operation: "passiveAdd"}).forEach(function(effect){
value += evaluateEffect(charId, effect);
});
return value;
//TODO decide whether (dis)advantage gives (-)+5 to passive checks
},
advantage: function(skillName){
var charId = this._id
var advantage = Effects.find({charId: charId, stat: skillName, enabled: true, operation: "advantage"}).count();
var disadvantage = Effects.find({charId: charId, stat: skillName, enabled: true, operation: "disadvantage"}).count();
if(advantage && !disadvantage) return 1;
if(disadvantage && !advantage) return -1;
return 0;
},
abilityMod: function(attribute){
return signedString(getMod(this.attributeValue(attribute)));
},

View File

@@ -1,36 +1,19 @@
.skillRow {
height: 32px;
display: flex;
align-items: center;
position: relative;
margin: 0 -8px 0 -8px;
}
.skillRow:hover{
background: #FFEBEE;
}
.profIcon{
display: inline-block;
width: 40px;
height: 26px;
background-size: contain;
background-repeat: no-repeat;
/*TODO fix the actual images and remove inversion*/
-webkit-filter: invert(100%);
opacity: 0.54;
pointer-events: none;
.skillRow core-icon {
color: rgba(0,0,0,0.54);
}
.skillMod {
width: 20px;
text-align: right;
width: 42px;
text-align: center;
}
.skillName, .skillMod{
display: inline-block;
vertical-align: top;
margin-right: 8px;
}
.fail.skillMod {
@@ -41,14 +24,16 @@
background-image: url(/png/advantage/greenUp.png);
background-size: contain;
background-repeat: no-repeat;
background-position: center;
}
.disadvantage{
background-image: url(/png/advantage/redDown.png);
background-size: contain;
background-repeat: no-repeat;
background-position: center;
}
td.conditionals::after{
.hasConditionals::after{
content: "*";
}

View File

@@ -1,17 +1,16 @@
<template name="skillRow">
<div class="subhead skillRow">
{{> ripple}}
<div class="profIcon" style="background-image: url(/png/profIcons/{{profIcon skill}})"></div>
<paper-item class="skillRow" layout horizontal>
<core-icon icon="{{profIcon}}"></core-icon>
{{#if failSkill}}
<div class="fail skillMod">fail</div>
{{else}}
<div class="{{advantage}} skillMod">{{../skillMod skill}}</div>
{{/if}}
<div class="{{conditionals}} skillName">
<div class="{{#if conditionalCount}}hasConditionals{{/if}} skillName">
{{name}}
{{#if showPassive}}
({{../passiveSkill skill}})
({{../passiveSkill skill}})
{{/if}}
</div>
</div>
</paper-item>
</template>

View File

@@ -1,40 +1,22 @@
Template.skillRow.helpers({
profIcon: function(skill){
profIcon: function(){
var prof = Template.parentData(1).proficiency(this.skill);
if(prof > 0 && prof < 1) return "profHalf.png";
if(prof === 1) return "profSingle.png";
if(prof > 1) return "profDouble.png";
return "profNone.png";
if(prof > 0 && prof < 1) return "image:brightness-2";
if(prof === 1) return "image:brightness-1";
if(prof > 1) return "av:album";
return "radio-button-off";
},
failSkill: function(){
var skill = Template.parentData(1).getField(this.skill);
_.each(skill.effets, function(effect){
if (effect.operation === "fail"){
return true;
}
})
return false;
var charId = Template.parentData(1)._id;
return Effects.find({charId: charId, stat: this.skill, enabled: true, operation: "fail"}).count();
},
advantage: function(){
var adv = 0;
var disadv = 0;
var skill = Template.parentData(1).getField(this.skill);
_.each(skill.effets, function(effect){
if (effect.operation === "advantage"){
adv ++;
} else if (effect.operation === "disadvantage") {
disadv ++;
}
})
if(adv > 0 && disadv === 0) return "advantage";
if(disadv > 0 && adv === 0) return "disadvantage";
var advantage = Template.parentData(1).advantage(this.skill);
if(advantage > 0) return "advantage";
if(advantage < 0) return "disadvantage";
},
conditionals: function(){
var skill = Template.parentData(1).getField(this.skill);
_.each(skill.effets, function(effect){
if (effect.operation === "conditional"){
return "conditionals";
}
})
conditionalCount: function(){
var charId = Template.parentData(1)._id;
return Effects.find({charId: charId, stat: this.skill, enabled: true, operation: "conditional"}).count();
}
});

View File

@@ -3,6 +3,9 @@
<link rel="import" href="/components/core-animated-pages/transitions/cross-fade.html">
<link rel="import" href="/components/core-animated-pages/transitions/hero-transition.html">
<link rel="import" href="/components/core-animated-pages/transitions/slide-from-right.html">
<link rel="import" href="/components/core-icons/av-icons.html">
<link rel="import" href="/components/core-icons/core-icons.html">
<link rel="import" href="/components/core-icons/image-icons.html">
<link rel="import" href="/components/core-item/core-item.html">
<link rel="import" href="/components/core-menu/core-menu.html">
<link rel="import" href="/components/core-scaffold/core-scaffold.html">