Merge pull request #3535 from rwjblue/properly-transition-on-mobile

Handle toggleing the content screen on mobile.
This commit is contained in:
Hannah Wolfe 2014-08-03 17:23:25 +01:00
commit 05ce783bd5
4 changed files with 28 additions and 5 deletions

View File

@ -72,6 +72,18 @@ var PostsController = Ember.ArrayController.extend(PaginationControllerMixin, {
//this is necesariy because we do not have access to the model inside the Controller::init method
this._super({'modelType': 'post'});
},
actions: {
showContentPreview: function () {
$('.content-list').animate({right: '100%', left: '-100%', 'margin-right': '15px'}, 300);
$('.content-preview').animate({right: '0', left: '0', 'margin-left': '0'}, 300);
},
hideContentPreview: function () {
$('.content-list').animate({right: '0', left: '0', 'margin-right': '0'}, 300);
$('.content-preview').animate({right: '-100%', left: '100%', 'margin-left': '15px'}, 300);
},
}
});

View File

@ -1,4 +1,5 @@
import loadingIndicator from 'ghost/mixins/loading-indicator';
import {mobileQuery} from 'ghost/utils/mobile';
var PostsIndexRoute = Ember.Route.extend(SimpleAuth.AuthenticatedRouteMixin, loadingIndicator, {
// This route's only function is to determine whether or not a post
@ -7,7 +8,8 @@ var PostsIndexRoute = Ember.Route.extend(SimpleAuth.AuthenticatedRouteMixin, loa
beforeModel: function () {
var self = this,
// the store has been populated so we can work with the local copy
posts = this.store.all('post');
posts = this.store.all('post'),
currentPost = this.controllerFor('posts').get('currentPost');
return this.store.find('user', 'me').then(function (user) {
// return the first post find that matches the following criteria:
@ -23,6 +25,10 @@ var PostsIndexRoute = Ember.Route.extend(SimpleAuth.AuthenticatedRouteMixin, loa
})
.then(function (post) {
if (post) {
if (currentPost === post && mobileQuery.matches) {
self.controllerFor('posts').send('hideContentPreview');
}
return self.transitionTo('posts.post', post);
}
});

View File

@ -1,5 +1,6 @@
import loadingIndicator from 'ghost/mixins/loading-indicator';
import ShortcutsRoute from 'ghost/mixins/shortcuts-route';
import {mobileQuery} from 'ghost/utils/mobile';
var PostsPostRoute = Ember.Route.extend(SimpleAuth.AuthenticatedRouteMixin, loadingIndicator, ShortcutsRoute, {
model: function (params) {
@ -52,6 +53,10 @@ var PostsPostRoute = Ember.Route.extend(SimpleAuth.AuthenticatedRouteMixin, load
this._super(controller, model);
this.controllerFor('posts').set('currentPost', model);
if (mobileQuery.matches) {
this.controllerFor('posts').send('hideContentPreview');
}
},
shortcuts: {

View File

@ -1,24 +1,24 @@
import {responsiveAction} from 'ghost/utils/mobile';
var PostsView = Ember.View.extend({
target: Ember.computed.alias('controller'),
classNames: ['content-view-container'],
tagName: 'section',
mobileInteractions: function () {
Ember.run.scheduleOnce('afterRender', this, function () {
var self = this;
// ### Show content preview when swiping left on content list
$('.manage').on('click', '.content-list ol li', function (event) {
responsiveAction(event, '(max-width: 800px)', function () {
$('.content-list').animate({right: '100%', left: '-100%', 'margin-right': '15px'}, 300);
$('.content-preview').animate({right: '0', left: '0', 'margin-left': '0'}, 300);
self.send('showContentPreview');
});
});
// ### Hide content preview
$('.manage').on('click', '.content-preview .button-back', function (event) {
responsiveAction(event, '(max-width: 800px)', function () {
$('.content-list').animate({right: '0', left: '0', 'margin-right': '0'}, 300);
$('.content-preview').animate({right: '-100%', left: '100%', 'margin-left': '15px'}, 300);
self.send('hideContentPreview');
});
});
});