1
0
mirror of https://github.com/TryGhost/Ghost.git synced 2024-12-15 11:34:24 +03:00
Ghost/core/client/app/components/gh-menu-toggle.js
Jason Williams 42166c8d9f Update Ember to 1.13.2
- Refactor to handle deprecations including removal of
  all Views, ArrayControllers, and ItemControllers.
2015-06-24 11:47:28 -05:00

50 lines
1.3 KiB
JavaScript

/*
This cute little component has two jobs.
On desktop, it toggles autoNav behaviour. It tracks
that state via the maximise property, and uses the
state to render the appropriate icon.
On mobile, it renders a closing icon, and clicking it
closes the mobile menu
*/
import Ember from 'ember';
import mobileQuery from 'ghost/utils/mobile';
export default Ember.Component.extend({
classNames: ['gh-menu-toggle'],
isMobile: false,
maximise: false,
iconClass: Ember.computed('maximise', 'isMobile', function () {
if (this.get('maximise') && !this.get('isMobile')) {
return 'icon-maximise';
} else {
return 'icon-minimise';
}
}),
didInsertElement: function () {
this.set('isMobile', mobileQuery.matches);
this.set('mqListener', Ember.run.bind(this, function (mql) {
this.set('isMobile', mql.matches);
}));
mobileQuery.addListener(this.get('mqListener'));
},
willDestroyElement: function () {
mobileQuery.removeListener(this.get('mqListener'));
},
click: function () {
if (this.get('isMobile')) {
this.sendAction('mobileAction');
} else {
this.toggleProperty('maximise');
this.sendAction('desktopAction');
}
}
});