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

Upgraded spells page to Polymer 1

Browse Source
This commit is contained in:
Stefan Zermatten
2017-01-30 13:02:22 +02:00
parent fd21f4f7d7
commit 7af3b8e06e
12 changed files with 435 additions and 376 deletions
Download Patch File Download Diff File Expand all files Collapse all files

48
rpg-docs/client/views/character/spells/spellListDialog/spellListDialog.html
View File

@@ -2,10 +2,10 @@
{{#with spellList}}
{{#baseDialog title=name class=colorClass startEditing=../startEditing}}
<div>
<div layout horizontal justified wrap class="subhead">
<div class="paper-font-subhead layout horizontal justified wrap">
{{#if attackBonus}}
<div>
Attack Bonus: {{evaluate charId attackBonus}}
Attack Bonus: {{evaluateSigned charId attackBonus}}
</div>
{{/if}}
{{#if saveDC}}
@@ -15,7 +15,7 @@
{{/if}}
{{#if maxPrepared}}
<div>
Max Prepared: {{evaluateSigned charId maxPrepared}}
Max Prepared Spells: {{evaluate charId maxPrepared}}
</div>
{{/if}}
</div>
@@ -23,36 +23,26 @@
<div>{{#markdown}}{{evaluateString charId description}}{{/markdown}}</div>
</div>
{{else}}
<div class="layout vertical">
<!--Name-->
<paper-input id="spellListNameInput"
class="fullwidth"
label="Name"
floatinglabel
value={{name}}></paper-input>
<paper-input id="spellListNameInput" label="Name" value={{name}}>
</paper-input>
<!--Save DC-->
<paper-input id="spellListSaveDCInput"
label="Save DC"
floatinglabel
value={{saveDC}}
style="width: 100%;"></paper-input><br>
<paper-input id="spellListSaveDCInput" label="Save DC" value={{saveDC}}>
{{> formulaSuffix}}
</paper-input>
<!--Attack Bonus-->
<paper-input id="spellListAttackBonusInput"
label="Attack Bonus"
floatinglabel
value={{attackBonus}}
style="width: 100%;"></paper-input><br>
<paper-input id="spellListAttackBonusInput" label="Attack Bonus" value={{attackBonus}}>
{{> formulaSuffix}}
</paper-input>
<!--Max Prepared-->
<paper-input id="spellListMaxPreparedInput"
label="Maximum Prepared Spells"
floatinglabel
value={{maxPrepared}}
style="width: 100%;"></paper-input><br>
<paper-input id="spellListMaxPreparedInput" label="Maximum Prepared Spells" value={{maxPrepared}}>
{{> formulaSuffix}}
</paper-input>
<!--Description-->
<paper-input-decorator label="Description" floatinglabel layout vertical>
<paper-autogrow-textarea>
<textarea id="spellListDescriptionInput" placeholder value={{description}}></textarea>
</paper-autogrow-textarea>
</paper-input-decorator>
<paper-textarea id="spellListDescriptionInput" label="Description" value={{description}}>
</paper-textarea>
</div>
{{/baseDialog}}
{{/with}}
</template>
</template>

84
rpg-docs/client/views/character/spells/spellListDialog/spellListDialog.js
View File

@@ -1,48 +1,80 @@
Template.spellListDialog.onRendered(function(){
updatePolymerInputs(this);
Template.spellListDialog.helpers({
spellList: function(){
return SpellLists.findOne(this.spellListId);
}
});
const debounce = (f) => _.debounce(f, 300);
Template.spellListDialog.events({
"color-change": function(event, instance){
SpellLists.update(instance.data.spellListId, {$set: {color: event.color}});
},
"tap #deleteButton": function(event, instance){
"click #deleteButton": function(event, instance){
SpellLists.softRemoveNode(instance.data.spellListId);
GlobalUI.deletedToast(
instance.data.spellListId,
"SpellLists",
"Spell list and contents"
);
GlobalUI.closeDetail();
popDialogStack();
},
//TODO clean up String -> num here so they don't need casting by Schema.clean
//TODO validate input (integer, non-negative, etc) for these inputs and give validation errors
"change #spellListNameInput, input #spellListNameInput": function(event){
"change #spellListNameInput, input #spellListNameInput":
debounce(function(event){
const input = event.currentTarget;
var value = input.value;
if (!value){
input.invalid = true;
input.errorMessage = "Name is required";
} else {
input.invalid = false;
SpellLists.update(this._id, {
$set: {name: value}
}, {
removeEmptyStrings: false,
trimStrings: false,
});
}
}),
"change #spellListSaveDCInput, input #spellListSaveDCInput":
debounce(function(event){
var value = event.currentTarget.value;
SpellLists.update(this._id, {$set: {name: value}});
},
"change #spellListSaveDCInput, input #spellListSaveDCInput": function(event){
var value = event.currentTarget.value;
SpellLists.update(this._id, {$set: {saveDC: value}});
},
SpellLists.update(this._id, {
$set: {saveDC: value}
}, {
removeEmptyStrings: false,
trimStrings: false,
});
}),
"change #spellListAttackBonusInput, input #spellListAttackBonusInput":
function(event){
debounce(function(event){
var value = event.currentTarget.value;
SpellLists.update(this._id, {$set: {attackBonus: value}});
},
SpellLists.update(this._id, {
$set: {attackBonus: value}
}, {
removeEmptyStrings: false,
trimStrings: false,
});
}),
"change #spellListMaxPreparedInput, input #spellListMaxPreparedInput":
function(event){
debounce(function(event){
var value = event.currentTarget.value;
SpellLists.update(this._id, {$set: {maxPrepared: value}});
},
"change #spellListDescriptionInput": function(event){
SpellLists.update(this._id, {
$set: {maxPrepared: value}
}, {
removeEmptyStrings: false,
trimStrings: false,
});
}),
"input #spellListDescriptionInput": debounce(function(event){
var value = event.currentTarget.value;
SpellLists.update(this._id, {$set: {description: value}});
},
});
Template.spellListDialog.helpers({
spellList: function(){
return SpellLists.findOne(this.spellListId);
}
SpellLists.update(this._id, {
$set: {description: value}
}, {
removeEmptyStrings: false,
trimStrings: false,
});
}),
});