Skip to content

Instantly share code, notes, and snippets.

@dalgard
Last active May 29, 2016 18:35
Show Gist options
  • Save dalgard/cf0a8c6c0d4db4e8ad87 to your computer and use it in GitHub Desktop.
Save dalgard/cf0a8c6c0d4db4e8ad87 to your computer and use it in GitHub Desktop.
<template name="openModal">
<button class="button" {{bind 'openModal: myModalTemplate'}}>Open modal</button>
</template>
ViewModel.addBinding("openModal", {
on: "click",
// Open Semantic UI modal
get(event, elem, prop) {
let template_instance = this.templateInstance,
container = $(".ui-dimmer").get(0),
parent_view = template_instance.parent().view;
if (container)
Blaze.renderWithData(Template[this.args[0]], this.data, container, parent_view);
}
}, {
// This binding doesn't need a viewmodel
detached: true
});
<template name="modal">
<aside class="ui {{#if small}}small{{/if}} modal" {{bind 'modal'}}>
{{> Template.contentBlock}}
</aside>
</template>
ViewModel.addBinding("modal", {
// Initialize Semantic UI modal
init($elem) {
let options = {
detachable: false,
context: $elem.parent(),
duration: 0,
selector: {
deny: ".actions .deny",
approve: ".actions .approve"
},
onApprove() {
// Modals should be closed explicitly after a successful operation
return false;
},
onHidden() {
// Get the outer modal view
let parent_view = Blaze.getView(this).templateInstance().parent().view;
// Destroy modal after hide transition
Blaze.remove(parent_view);
}
};
// Init modal on element
$elem.modal(options);
// Show modal immediately upon render
$elem.modal("show");
}
}, {
// This binding doesn't need a viewmodel
detached: true
});
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment