Skip to content

Instantly share code, notes, and snippets.

@mupkoo mupkoo/application.hbs
Last active Aug 29, 2015

Embed
What would you like to do?
Ember Notifications component
{{! Rest of the file is omited }}
<div class="notifications">
{{#each controllers.notifications.notifications}}
{{system-notification content=this}}
{{/each}}
</div>
{{! Rest of the file is omited }}
App.ApplicationController = Ember.Controller.extend
# We will need the notifications, so we can render them in the application.hbs file
needs: [ 'notifications' ]
App.NotificationsController = Ember.Controller.extend
notifications: Ember.A()
clearNotifications: (->
notifications = @get('notifications')
if notifications.length and notifications.isEvery('closed')
@set 'notifications', Ember.A()
).observes('notifications.@each.closed')
notify: (msg, type = 'info') ->
notification = Ember.Object.create
type: type
msg: msg
closed: false
@notifications.pushObject notification
<a class="close" {{ action "close" }}>&times;</a>
<p>{{ content.msg }}</p>
App.SimpleNotificationComponent = Ember.Component.extend
timeout: null
timeVisible: 6000,
visible: false
classNameBindings: [ ':notification', 'content.type', 'content.closed', 'visible' ]
didInsertElement: ->
@startTimeout()
Ember.run.later =>
@set 'visible', true
, 1
startTimeout: ->
@set 'timeout', setTimeout =>
@send 'close'
, @get('timeVisible')
clearTimeout: ->
clearTimeout @get('timeout') if @get('timeout')
eventManager:
mouseEnter: (e, view) ->
view.clearTimeout()
mouseLeave: (e, view) ->
view.startTimeout()
actions:
close: ->
@set 'visible', false
setTimeout =>
@set 'content.closed', true
@clearTimeout()
, 300
App.SomeController = Ember.Controller.extend
# We will need to have access to the notifications controller
# to be able to add new notifications
needs: [ 'notifications' ]
actions:
save: ->
# When everything is done
@get('controllers.notifications').notify 'The notification message'
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
You can’t perform that action at this time.