Files
DiceCloud/rpg-docs/client/views/paperTemplates/fabMenu/fabMenu.js
2017-01-26 10:23:27 +02:00

33 lines
831 B
JavaScript

Template.fabMenu.onCreated(function() {
this.active = new ReactiveVar(false);
});
Template.fabMenu.onRendered(function(){
const fab = this.find("paper-fab.expand-menu");
// Do a spin animation to turn the + icon into a x when active
this.autorun(() => {
const active = this.active.get();
const iconStyle = active ?
"transition: transform 0.3s ease; transform: rotate(225deg);" :
"transition: transform 0.3s ease;";
fab.updateStyles({
["--paper-fab-iron-icon"]: iconStyle,
});
})
});
Template.fabMenu.helpers({
active: function() {
return Template.instance().active.get();
},
});
Template.fabMenu.events({
"tap .expand-menu": function(event, instance) {
instance.active.set(!instance.active.get());
},
"tap .mini-holder paper-fab": function(event, instance) {
instance.active.set(false);
},
});