Ghost/ghost/admin/app/components/gh-notification.js

53 lines
1.4 KiB
JavaScript

import Component from '@ember/component';
import {computed} from '@ember/object';
import {inject as service} from '@ember/service';
export default Component.extend({
notifications: service(),
tagName: 'article',
classNames: ['gh-notification', 'gh-notification-passive'],
classNameBindings: ['typeClass'],
message: null,
typeClass: computed('message.type', function () {
let type = this.get('message.type');
let classes = '';
let typeMapping;
typeMapping = {
success: 'green',
error: 'red',
warn: 'yellow'
};
if (typeMapping[type] !== undefined) {
classes += `gh-notification-${typeMapping[type]}`;
}
return classes;
}),
didInsertElement() {
this._super(...arguments);
this.$().on('animationend webkitAnimationEnd oanimationend MSAnimationEnd', (event) => {
if (event.originalEvent.animationName === 'fade-out') {
this.get('notifications').closeNotification(this.get('message'));
}
});
},
willDestroyElement() {
this._super(...arguments);
this.$().off('animationend webkitAnimationEnd oanimationend MSAnimationEnd');
},
actions: {
closeNotification() {
this.get('notifications').closeNotification(this.get('message'));
}
}
});