Implemented Hero-dialog editing of features
This commit is contained in:
@@ -1,27 +1,32 @@
|
||||
<template name="featureDialog">
|
||||
{{#with feature}}
|
||||
<paper-menu-button>
|
||||
<paper-icon-button role="button" tabindex="0" icon="delete" aria-label="Delete Feature" noink></paper-icon-button>
|
||||
<paper-dropdown class="dropdown">
|
||||
<paper-button id="deleteFeature">Delete Feature</paper-button>
|
||||
<paper-button>Cancel</paper-button>
|
||||
</paper-dropdown>
|
||||
</paper-menu-button>
|
||||
|
||||
|
||||
<div class="featureDialogWidth"></div>
|
||||
<paper-input id="featureNameInput" label="Name" floatinglabel value={{name}}></paper-input>
|
||||
<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>
|
||||
<h3>Effects</h3>
|
||||
{{#each effects}}
|
||||
{{>effectEdit}}
|
||||
{{/each}}
|
||||
<br>
|
||||
<paper-icon-button id="addEffectButton" role="button" tabindex="0" icon="add" aria-label="addEffect"></paper-icon-button>
|
||||
<core-header-panel fit>
|
||||
<core-toolbar>
|
||||
<paper-icon-button id="backButton" role="button" tabindex="0" icon="arrow-back" aria-label="close"></paper-icon-button>
|
||||
<div flex>{{name}}</div>
|
||||
<paper-menu-button>
|
||||
<paper-icon-button role="button" tabindex="0" icon="delete" aria-label="Delete Feature" noink></paper-icon-button>
|
||||
<paper-dropdown layered class="dropdown">
|
||||
<paper-button id="deleteFeature">Delete Feature</paper-button>
|
||||
<paper-button>Cancel</paper-button>
|
||||
</paper-dropdown>
|
||||
</paper-menu-button>
|
||||
</core-toolbar>
|
||||
<div class="featureContent">
|
||||
<paper-input id="featureNameInput" label="Name" floatinglabel value={{name}}></paper-input>
|
||||
<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>
|
||||
<h3>Effects</h3>
|
||||
{{#each effects}}
|
||||
{{>effectEdit}}
|
||||
{{/each}}
|
||||
<div layout horizontal end-justified>
|
||||
<paper-button id="addEffectButton" raised>Add Effect</paper-button>
|
||||
</div>
|
||||
</div>
|
||||
</core-header-panel>
|
||||
{{/with}}
|
||||
<paper-button affirmative>Done</paper-button>
|
||||
</template>
|
||||
@@ -5,13 +5,19 @@ Template.featureDialog.rendered = function(){
|
||||
if(feature && feature.name) Session.set("global.ui.dialogHeader", feature.name);
|
||||
})
|
||||
//after the dialog is built, open it
|
||||
_.defer(function(){GlobalUI.dialog.open()});
|
||||
if (!this.alreadyRendered){
|
||||
Session.set("global.ui.detailShow", true);
|
||||
this.alreadyRendered = true;
|
||||
}
|
||||
}
|
||||
|
||||
Template.featureDialog.events({
|
||||
"tap #backButton": function(){
|
||||
GlobalUI.closeDetail()
|
||||
},
|
||||
"tap #deleteFeature": function(){
|
||||
Features.remove(this._id);
|
||||
GlobalUI.closeDialog()
|
||||
GlobalUI.closeDetail()
|
||||
},
|
||||
"tap #addEffectButton": function(){
|
||||
Effects.insert({
|
||||
|
||||
@@ -1,3 +1,12 @@
|
||||
body /deep/ .featureDialogWidth {
|
||||
width: 560px;
|
||||
}
|
||||
|
||||
.featureContent {
|
||||
padding: 24px;
|
||||
}
|
||||
|
||||
#addEffectButton {
|
||||
background: #d23f31;
|
||||
color: #fff;
|
||||
}
|
||||
|
||||
@@ -9,7 +9,7 @@
|
||||
</div>
|
||||
<div class="features">
|
||||
{{#each features}}
|
||||
<paper-shadow class="featureCard">
|
||||
<paper-shadow class="featureCard" hero-id="main">
|
||||
<div class="featureCardTop">
|
||||
<h2>{{name}}</h2>
|
||||
</div>
|
||||
@@ -20,6 +20,13 @@
|
||||
</div>
|
||||
<div class="fab-buffer"></div>
|
||||
</div>
|
||||
<paper-fab id="addFeature" class="floatyButton" icon="add" title="Add" role="button" tabindex="0" aria-label="Add"></paper-fab>
|
||||
<paper-fab id="addFeature"
|
||||
class="floatyButton"
|
||||
icon="add"
|
||||
title="Add"
|
||||
role="button"
|
||||
tabindex="0"
|
||||
aria-label="Add"
|
||||
hero-id="main"></paper-fab>
|
||||
</div>
|
||||
</template>
|
||||
@@ -8,20 +8,18 @@ Template.features.helpers({
|
||||
Template.features.events({
|
||||
"tap #addFeature": function(event){
|
||||
var featureId = Features.insert({name: "New Feature", charId: this._id});
|
||||
GlobalUI.setDialog({
|
||||
heading: "New Feature",
|
||||
template: "featureDialog",
|
||||
data: {featureId: featureId, charId: this._id},
|
||||
fullOnMobile: true
|
||||
GlobalUI.setDetail({
|
||||
template: "featureDialog",
|
||||
data: {featureId: featureId, charId: this._id},
|
||||
hero: $(event.currentTarget)
|
||||
})
|
||||
},
|
||||
"tap .featureCard": function(event){
|
||||
var featureId = this._id;
|
||||
GlobalUI.setDialog({
|
||||
heading: this.name,
|
||||
template: "featureDialog",
|
||||
data: {featureId: featureId, charId: Template.parentData()._id},
|
||||
fullOnMobile: true
|
||||
GlobalUI.setDetail({
|
||||
template: "featureDialog",
|
||||
data: {featureId: featureId, charId: Template.parentData()._id},
|
||||
hero: $(event.currentTarget)
|
||||
})
|
||||
}
|
||||
});
|
||||
Reference in New Issue
Block a user