jschaufuss/DiceCloud
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

Overhauled how effects are edited

Browse Source
This commit is contained in:
Stefan Zermatten
2015-05-27 13:13:51 +02:00
parent 1323d8006c
commit 78b1d71b9d
4 changed files with 49 additions and 70 deletions
Download Patch File Download Diff File Expand all files Collapse all files

21
rpg-docs/client/views/character/effects/effectEdit/effectEdit.css
View File

@@ -1,21 +1,13 @@
body /deep/ #statGroupDropDown {
width: 120px;
html /deep/ .operationDropDown {
width: 152px;
}
body /deep/ #statDropDown {
width: 120px;
html /deep/ .statDropDown {
width: 152px;
}
body /deep/ #operationDropDown {
width: 100px;
}
body /deep/ #damageMultiplierDropDown {
width: 120px;
}
body /deep/ #proficiencyDropDown {
width: 120px;
html /deep/ .damageMultiplierDropDown {
width: 152px;
}
html /deep/ .effectEdit paper-input {
@@ -24,6 +16,7 @@ html /deep/ .effectEdit paper-input {
}
html /deep/ .effectEdit {
height: 64px;
display: flex;
align-items: flex-end;
}

61
rpg-docs/client/views/character/effects/effectEdit/effectEdit.html
View File

@@ -1,27 +1,23 @@
<template name="effectEdit">
<div class="effectEdit" layout horizontal center>
<paper-dropdown-menu class="statGroupDropDown" label="Stat Group" flex>
<paper-dropdown layered class="dropdown">
<core-menu class="menu statGroupMenu" selected={{selectedStatGroup}}>
{{#each statGroups}}
<paper-item class="statGroupSelect" name={{this}}>{{this}}</paper-item>
{{/each}}
</core-menu>
</paper-dropdown>
</paper-dropdown-menu>
{{#if stats}}
<paper-dropdown-menu class="statDropDown" label="Stat" flex>
<paper-dropdown layered class="dropdown">
<core-menu class="menu statMenu" selected={{stat}} on-tap="onStatMenuTap">
{{#each stats}}
<paper-item name={{stat}}>{{name}}</paper-item>
<paper-dropdown-menu class="statDropDown"
label="Stat">
<paper-dropdown layered
class="dropdown">
<core-menu class="menu statMenu" selected={{stat}}>
{{#each statGroups}}
<div style="font-weight: bold;
margin-top: 16px;">{{this}}</div>
{{#each stats}}
<paper-item name={{stat}}>{{name}}</paper-item>
{{/each}}
{{/each}}
</core-menu>
</paper-dropdown>
</paper-dropdown-menu>
{{/if}}
</paper-dropdown>
</paper-dropdown-menu>
{{#if operations}}
<paper-dropdown-menu class="operationDropDown" label="Operation" flex>
<paper-dropdown-menu class="operationDropDown"
label="Operation">
<paper-dropdown layered class="dropdown">
<core-menu class="menu operationMenu" selected={{operation}}>
{{#each operations}}
@@ -31,24 +27,39 @@
</paper-dropdown>
</paper-dropdown-menu>
{{/if}}
{{> Template.dynamic template=effectValueTemplate}}
<paper-icon-button class="deleteEffect" role="button" tabindex="0" icon="delete" aria-label="Delete"></paper-icon-button>
{{#if effectValueTemplate}}
{{> Template.dynamic template=effectValueTemplate}}
{{else}}
<div flex></div>
{{/if}}
<paper-icon-button class="deleteEffect"
icon="delete">
</paper-icon-button>
<br>
</div>
</template>
<template name="regularEffectValue">
<paper-input class="effectValueInput" label="Value" floatinglabel value={{effectValue}} flex></paper-input>
<paper-input class="effectValueInput"
label="Value"
floatinglabel
value={{effectValue}}
flex>
</paper-input>
</template>
<template name="multiplierEffectValue">
<paper-dropdown-menu class="damageMultiplierDropDown" label="Damage Multiplier" flex>
<paper-dropdown layered class="dropdown">
<core-menu class="menu multiplierMenu" selected={{value}}>
<paper-dropdown-menu class="damageMultiplierDropDown"
label="Damage Multiplier">
<paper-dropdown layered
class="dropdown">
<core-menu class="menu multiplierMenu"
selected={{value}}>
<paper-item name="0.5">Resistance</paper-item>
<paper-item name="2">Vulnerability</paper-item>
<paper-item name="0">Immunity</paper-item>
</core-menu>
</paper-dropdown>
</paper-dropdown-menu>
<div flex></div>
</template>

35
rpg-docs/client/views/character/effects/effectEdit/effectEdit.js
View File

@@ -93,24 +93,17 @@ var skillOperations = [
{name: "Conditional Benefit", operation: "conditional"}
];
Template.effectEdit.created = function(){
var statGroup = statsDict[this.data.stat] && statsDict[this.data.stat].group;
this.selectedStatGroup = new ReactiveVar(statGroup);
};
Template.effectEdit.helpers({
selectedStatGroup: function(){
return Template.instance().selectedStatGroup.get();
},
statGroups: function(){
return statGroupNames;
},
stats: function(){
var group = Template.instance().selectedStatGroup.get();
var group = this;
return statGroups[group];
},
operations: function(){
var group = Template.instance().selectedStatGroup.get();
var stat = statsDict[this.stat];
var group = stat && stat.group;
if (group === "Weakness/Resistance") return null;
if (group === "Saving Throws" || group === "Skills"){
return skillOperations;
@@ -120,7 +113,8 @@ Template.effectEdit.helpers({
},
effectValueTemplate: function(){
//resistance/vulnerability template
var group = Template.instance().selectedStatGroup.get();
var stat = statsDict[this.stat];
var group = stat && stat.group;
if (group === "Weakness/Resistance") return "multiplierEffectValue";
var op = this.operation;
@@ -144,25 +138,6 @@ Template.effectEdit.events({
Effects.softRemoveNode(this._id);
GlobalUI.deletedToast(this._id, "Effects", "Effect");
},
"core-select .statGroupDropDown": function(event, instance){
var detail = event.originalEvent.detail;
if (!detail.isSelected) return;
var groupName = detail.item.getAttribute("name");
var oldName = Template.instance().selectedStatGroup.get();
if (oldName != groupName){
instance.selectedStatGroup.set(groupName);
if (groupName === "Weakness/Resistance"){
Effects.update(this._id, {$set: {
value: 0.5,
calculation: "",
operation: "mul"}, $unset: {stat: ""}});
} else {
Effects.update(this._id,
{$set: {operation: "add"},
$unset: {stat: "", value: "", calculation: ""}});
}
}
},
"core-select .statDropDown": function(event){
var detail = event.originalEvent.detail;
if (!detail.isSelected) return;

2
rpg-docs/client/views/character/effects/effectView/effectView.js
View File

@@ -156,7 +156,7 @@ Template.effectView.helpers({
if (this.operation === "conditional"){
return this.calculation || this.value;
}
if (stats[this.stat].group === "Weakness/Resistance"){
if (stats[this.stat] && stats[this.stat].group === "Weakness/Resistance"){
if (this.value === 0.5) return "Resistance";
if (this.value === 2) return "Vulnerability";
if (this.value === 0) return "Immunity";