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

Implemented Spell Dialogs

Browse Source
This commit is contained in:
Thaum
2015-02-16 08:16:05 +00:00
parent b200478425
commit 360c9bd63b
15 changed files with 357 additions and 32 deletions
Download Patch File Download Diff File Expand all files Collapse all files

89
rpg-docs/client/views/character/spells/spellDialog/spellDialog.html Normal file
View File

@@ -0,0 +1,89 @@
<template name="spellDialog">
{{#with spell}}
<core-header-panel fit class="spellDialog">
<core-toolbar hero-id="toolbar" class={{colorClass}} hero>
<paper-icon-button id="backButton" role="button" tabindex="0" icon="arrow-back" aria-label="close"></paper-icon-button>
<div flex hero-id="title" hero>{{name}}</div>
<paper-icon-button id="deleteSpell"
role="button"
tabindex="0"
icon="delete"
aria-label="Delete Feature"
noink></paper-icon-button>
</core-toolbar>
<div class="detailContent">
<!--Name-->
<div horizontal layout>
<paper-input id="spellNameInput" label="Name" floatinglabel value={{name}} flex></paper-input>
<!--Color-->
{{> colorDropdown}}<br>
</div>
<!--List dropdown-->
<paper-dropdown-menu id="listDropdown" label="Spell List">
<paper-dropdown layered class="dropdown">
<core-menu class="menu" selected={{listId}}>
{{#each spellLists}}
<paper-item name={{_id}} class="containerMenuItem">{{name}}</paper-item>
{{/each}}
</core-menu>
</paper-dropdown>
</paper-dropdown-menu>
<!--Level-->
<paper-dropdown-menu id="levelDropdown" label="Level">
<paper-dropdown layered class="dropdown">
<core-menu class="menu" selected={{level}}>
{{#each spellLevels}}
<paper-item name={{level}} class="containerMenuItem">{{name}}</paper-item>
{{/each}}
</core-menu>
</paper-dropdown>
</paper-dropdown-menu>
<!--School-->
<paper-dropdown-menu id="schoolDropdown" label="School">
<paper-dropdown layered class="dropdown">
<core-menu class="menu" selected={{school}}>
{{#each magicSchools}}
<paper-item name={{this}} class="containerMenuItem">{{this}}</paper-item>
{{/each}}
</core-menu>
</paper-dropdown>
</paper-dropdown-menu>
<!--Prepared-->
<paper-dropdown-menu id="preparedDropdown" label="School">
<paper-dropdown layered class="dropdown">
<core-menu class="menu" selected={{prepared}}>
{{#each preparedOptions}}
<paper-item name={{value}} class="containerMenuItem">{{name}}</paper-item>
{{/each}}
</core-menu>
</paper-dropdown>
</paper-dropdown-menu>
<!--Casting Time-->
<paper-input id="castingTimeInput" class="fullwidth" label="Casting Time" floatinglabel value={{castingTime}} flex></paper-input>
<!--Range-->
<paper-input id="rangeInput" class="fullwidth" label="Range" floatinglabel value={{range}} flex></paper-input>
<!--Duration-->
<paper-input id="durationInput" class="fullwidth" label="Duration" floatinglabel value={{duration}} flex></paper-input>
<!--Components-->
<div horizontal layout wrap>
<div>Verbal:</div>
<paper-checkbox id="verbalCheckbox" checked={{components.verbal}}></paper-checkbox>
<div>Somatic:</div>
<paper-checkbox id="somaticCheckbox" checked={{components.somatic}}></paper-checkbox>
<div>Concentration:</div>
<paper-checkbox id="concentrationCheckbox" checked={{components.concentration}}></paper-checkbox>
<!--Ritual-->
<div>Ritual: </div>
<paper-checkbox id="ritualCheckbox" checked={{ritual}}></paper-checkbox>
</div>
<paper-input id="materialInput" class="fullwidth" label="Material Components" floatinglabel value={{components.material}} flex></paper-input>
<!--Description-->
<paper-input-decorator label="Description" floatinglabel layout vertical>
<paper-autogrow-textarea>
<textarea id="descriptionInput" placeholder value={{description}}></textarea>
</paper-autogrow-textarea>
</paper-input-decorator>
</div>
</core-header-panel>
{{/with}}
</template>

138
rpg-docs/client/views/character/spells/spellDialog/spellDialog.js Normal file
View File

@@ -0,0 +1,138 @@
var spellLevels = [
{ name: "Cantrips", level: 0 },
{ name: "Level 1", level: 1 },
{ name: "Level 2", level: 2 },
{ name: "Level 3", level: 3 },
{ name: "Level 4", level: 4 },
{ name: "Level 5", level: 5 },
{ name: "Level 6", level: 6 },
{ name: "Level 7", level: 7 },
{ name: "Level 8", level: 8 },
{ name: "Level 9", level: 9 },
];
Template.spellDialog.rendered = function(){
var self = this;
//update all autogrows after they've been filled
var pata = this.$("paper-autogrow-textarea");
pata.each(function(index, el){
el.update($(el).children().get(0));
})
//update all input fields as well
var input = this.$("paper-input");
input.each(function(index, el){
el.valueChanged();
})
//after the dialog is built, open it
if (!this.alreadyRendered){
Session.set("global.ui.detailShow", true);
this.alreadyRendered = true;
}
}
Template.spellDialog.events({
"tap #backButton": function(){
GlobalUI.closeDetail();
},
"tap #deleteSpell": function(){
Spells.remove(this._id);
GlobalUI.closeDetail();
},
//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 #spellNameInput, input #spellNameInput": function(event){
var value = event.currentTarget.value
Spells.update(this._id, {$set: {name: value}});
},
"change #castingTimeInput": function(event){
var value = event.currentTarget.value
Spells.update(this._id, {$set: {castingTime: value}});
},
"change #rangeInput": function(event){
var value = event.currentTarget.value
Spells.update(this._id, {$set: {range: value}});
},
"change #durationInput": function(event){
var value = event.currentTarget.value
Spells.update(this._id, {$set: {duration: value}});
},
"change #materialInput": function(event){
var value = event.currentTarget.value
Spells.update(this._id, {$set: {"components.material": value}});
},
"change #descriptionInput": function(event){
var value = event.currentTarget.value
Spells.update(this._id, {$set: {"description": value}});
},
"core-select #listDropdown": function(event){
var detail = event.originalEvent.detail;
if(!detail.isSelected) return;
var value = detail.item.getAttribute("name");
Spells.update(this._id, {$set: {listId: value}});
},
"core-select #levelDropdown": function(event){
var detail = event.originalEvent.detail;
if(!detail.isSelected) return;
var value = detail.item.getAttribute("name");
Spells.update(this._id, {$set: {level: value}});
},
"core-select #schoolDropdown": function(event){
var detail = event.originalEvent.detail;
if(!detail.isSelected) return;
var value = detail.item.getAttribute("name");
Spells.update(this._id, {$set: {school: value}});
},
"core-select #preparedDropdown": function(event){
var detail = event.originalEvent.detail;
if(!detail.isSelected) return;
var value = detail.item.getAttribute("name");
Spells.update(this._id, {$set: {prepared: value}});
},
"core-select .colorDropdown": function(event){
var detail = event.originalEvent.detail;
if(!detail.isSelected) return;
var value = detail.item.getAttribute("name");
Spells.update(this._id, {$set: {color: value}});
},
"change #verbalCheckbox": function(event){
var value = event.currentTarget.checked;
Spells.update(this._id, {$set: {"components.verbal": value}});
},
"change #somaticCheckbox": function(event){
var value = event.currentTarget.checked;
Spells.update(this._id, {$set: {"components.somatic": value}});
},
"change #concentrationCheckbox": function(event){
var value = event.currentTarget.checked;
Spells.update(this._id, {$set: {"components.concentration": value}});
},
"change #ritualCheckbox": function(event){
var value = event.currentTarget.checked;
Spells.update(this._id, {$set: {"ritual": value}});
},
});
Template.spellDialog.helpers({
spell: function(){
return Spells.findOne(this.spellId);
},
colorClass: function(){
return getColorClass(this.color)
},
spellLists: function(){
return SpellLists.find({charId: this.charId}, {fields: {name: 1}});
},
magicSchools: function(){
return magicSchools;
},
spellLevels: function(){
return spellLevels;
},
preparedOptions: function(){
return [
{name: "Prepared", value: "prepared"},
{name: "Unprepared", value: "unprepared"},
{name: "Always Prepared", value: "always"}
];
}
});