Ghost/ghost/admin/views/mobile/parent-view.js
Matt Enlow e48b5edbb4 Abstract mobile transition interactions
Closes #4032
- Created "mobile" views: `parent-view`, `content-view` and `index-view`
- `mobile/parent-view` has three callbacks for managing layout, and a mediaQuery listener to keep in sync with the user
- content-view and index-view use their parent-views callbacks to bring themselves into and out of the viewport as appropriate
- fixed media queries for post content list from 800px to 900px
- Created `mobile-index-route` to intelligently transition to a new route on desktops (used by both PostsIndexRoute and SettingsIndexRoute)
- Extract mobile interactions from settings views to new mobile utility views
- `js-` prefixed settings view transitions
- removed unused openEditor action from PostsRoute
- removed unused mobile util "responsiveAction"
2014-09-16 07:28:03 -06:00

34 lines
1002 B
JavaScript

import mobileQuery from 'ghost/utils/mobile';
//A mobile parent view needs to implement three methods,
// showContent, showAll, and showMenu
// Which are called by MobileIndex and MobileContent views
var MobileParentView = Ember.View.extend({
showContent: Ember.K,
showMenu: Ember.K,
showAll: Ember.K,
setChangeLayout: function () {
var self = this;
this.set('changeLayout', function changeLayout() {
if (mobileQuery.matches) {
//transitioned to mobile layout, so show content
self.showContent();
} else {
//went from mobile to desktop
self.showAll();
}
});
}.on('init'),
attachChangeLayout: function () {
mobileQuery.addListener(this.changeLayout);
}.on('didInsertElement'),
detachChangeLayout: function () {
mobileQuery.removeListener(this.changeLayout);
}.on('willDestroyElement')
});
export default MobileParentView;