Generalised some dialogs

This commit is contained in:
Thaum
2015-02-27 06:14:34 +00:00
parent 56f8e95d81
commit 040d5a514b
50 changed files with 532 additions and 954 deletions

View File

@@ -1,56 +1,31 @@
<template name="featureDialog">
{{#with feature}}
<core-header-panel fit>
<core-toolbar class={{colorClass}} hero-id="toolbar" hero>
<paper-icon-button id="backButton" role="button" tabindex="0" icon="arrow-back" aria-label="close"></paper-icon-button>
<div flex>{{name}}</div>
<paper-icon-button id="deleteFeature"
role="button"
tabindex="0"
icon="delete"
aria-label="Delete Feature"
noink></paper-icon-button>
</core-toolbar>
<div class="detailContent">
<!--name-->
<paper-input id="featureNameInput" label="Name" floatinglabel value={{name}}></paper-input>
<!--color-->
{{> colorDropdown}}
<hr style="margin: 16px 0 16px 0;">
<!--description-->
<paper-input-decorator label="Description" floatinglabel layout vertical>
<paper-autogrow-textarea>
<textarea id="featureDescriptionInput" placeholder aria-label="Description" value={{description}}></textarea>
</paper-autogrow-textarea>
</paper-input-decorator>
<hr style="margin: 16px 0 16px 0;">
<div layout horizontal center style="height: 60px;">
<div class="caption">Limit Uses</div>
<paper-toggle-button id="limitUseCheck"
checked={{usesSet}}
role="button"
aria-pressed="false"
tabindex="0"
touch-action="pan-y"
style="margin-left: 8px; margin-right:8px;">
</paper-toggle-button>
{{#if usesSet}}
<paper-input id="usesInput" label="Uses" floatinglabel value={{uses}}></paper-input>
{{/if}}
</div>
{{#if effects}}
<hr style="margin: 16px 0 16px 0;">
<div id="effects">
<h2>Effects</h2>
{{#each effects}}
{{>effectEdit}}
{{/each}}
</div>
{{#baseDialog title=name class=colorClass}}
<!--name-->
<paper-input id="featureNameInput" label="Name" floatinglabel value={{name}}></paper-input>
<hr style="margin: 16px 0 16px 0;">
<!--description-->
<paper-input-decorator label="Description" floatinglabel layout vertical>
<paper-autogrow-textarea>
<textarea id="featureDescriptionInput" placeholder aria-label="Description" value={{description}}></textarea>
</paper-autogrow-textarea>
</paper-input-decorator>
<hr style="margin: 16px 0 16px 0;">
<div layout horizontal center style="height: 60px;">
<div class="caption">Limit Uses</div>
<paper-toggle-button id="limitUseCheck"
checked={{usesSet}}
role="button"
aria-pressed="false"
tabindex="0"
touch-action="pan-y"
style="margin-left: 8px; margin-right:8px;">
</paper-toggle-button>
{{#if usesSet}}
<paper-input id="usesInput" label="Uses" floatinglabel value={{uses}}></paper-input>
{{/if}}
<div layout horizontal end-justified>
<paper-button id="addEffectButton" raised>Add Effect</paper-button>
</div>
</div>
</core-header-panel>
{{> effectsEditList sourceId=_id charId=charId type="feature"}}
{{/baseDialog}}
{{/with}}
</template>

View File

@@ -1,38 +1,11 @@
Template.featureDialog.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.featureDialog.events({
"tap #backButton": function(){
GlobalUI.closeDetail()
"color-change": function(event, instance){
Features.update(instance.data.featureId, {$set: {color: event.color}});
},
"tap #deleteFeature": function(){
Features.remove(this._id);
"tap #deleteButton": function(event, instance){
Features.remove(instance.data.featureId);
GlobalUI.closeDetail()
},
"tap #addEffectButton": function(){
Effects.insert({
charId: Template.currentData().charId,
sourceId: this._id,
operation: "add",
type: "feature"
});
},
"change #featureNameInput": function(event){
var name = Template.instance().find("#featureNameInput").value;
Features.update(this._id, {$set: {name: name}});
@@ -54,12 +27,6 @@ Template.featureDialog.events({
var value = event.target.value;
var featureId = this._id;
Features.update(featureId, {$set: {uses: value}});
},
"core-select .colorDropdown": function(event){
var detail = event.originalEvent.detail;
if(!detail.isSelected) return;
var value = detail.item.getAttribute("name");
Features.update(this._id, {$set: {color: value}});
}
});
@@ -67,10 +34,6 @@ Template.featureDialog.helpers({
feature: function(){
return Features.findOne(this.featureId);
},
effects: function(){
var cursor = Effects.find({sourceId: this._id, type: "feature"})
return cursor;
},
usesSet: function(){
return _.isString(this.uses);
},