Skip to content

Instantly share code, notes, and snippets.

@rlivsey
Created May 24, 2012 09:56
Show Gist options
  • Save rlivsey/2780541 to your computer and use it in GitHub Desktop.
Save rlivsey/2780541 to your computer and use it in GitHub Desktop.
Ember.js modal
MB.ModalHeaderView = Ember.View.extend({
classNames: ["modal-header"]
contentBinding: "parentView.content"
titleBinding: "parentView.title"
defaultTemplate: Ember.Handlebars.compile("""
<a href="#" {{action close target="view.parentView"}} class="close">x</a>
<h3>{{view.title}}</h3>
""")
})
MB.ModalFooterView = Ember.View.extend({
classNames: ["modal-footer"]
contentBinding: "parentView.content"
defaultTemplate: Ember.Handlebars.compile('the footer')
})
MB.ModalBodyView = Ember.View.extend({
classNames: ["modal-body"]
contentBinding: "parentView.content"
defaultTemplate: Ember.Handlebars.compile('the body')
})
MB.ModalView = Ember.ContainerView.extend({
classNames: ["modal"]
childViews: (() ->
[@get('headerView'), @get('bodyView'), @get('footerView')].compact()
).property('headerView', 'bodyView', 'footerView')
title: "Default Title"
hasCloseButton: true
headerView: MB.ModalHeaderView
bodyView: MB.ModalBodyView
footerView: null # don't default to having a footer
close: (e) ->
e.preventDefault()
@destroy()
});
MB.ModalView.reopenClass({
display: (options={}) ->
modal = @create(options)
modal.append()
modal
})
MB.MyModalView = MB.ModalView.extend({
bodyView: MB.ModalBodyView.extend({
templateName: "templates/modals/some-template"
})
})
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment