Merge pull request #6387 from novaugust/post-deletion

Fix post deletion scroll on content and tag screens
This commit is contained in:
Kevin Ansfield 2016-02-15 11:02:42 +00:00
commit 31b87cb8c4
13 changed files with 44 additions and 71 deletions

View File

@ -1,7 +0,0 @@
import Ember from 'ember';
import InfiniteScrollMixin from 'ghost/mixins/infinite-scroll';
const {Component} = Ember;
export default Component.extend(InfiniteScrollMixin, {
});

View File

@ -3,4 +3,10 @@ import InfiniteScrollMixin from 'ghost/mixins/infinite-scroll';
const {Component} = Ember;
export default Component.extend(InfiniteScrollMixin);
export default Component.extend(InfiniteScrollMixin, {
actions: {
checkScroll() {
this._checkScroll();
}
}
});

View File

@ -34,10 +34,6 @@ export default Component.extend(ActiveLinkWrapper, {
return Ember.String.htmlSafe(`background-image: url(${this.get('authorAvatar')})`);
}),
viewOrEdit: computed('previewIsHidden', function () {
return this.get('previewIsHidden') ? 'editor.edit' : 'posts.post';
}),
click() {
this.sendAction('onClick', this.get('post'));
},
@ -54,6 +50,9 @@ export default Component.extend(ActiveLinkWrapper, {
willDestroyElement() {
this._super(...arguments);
this.removeObserver('active', this, this.scrollIntoView);
if (this.get('post.isDeleted') && this.attrs.onDelete) {
this.attrs.onDelete();
}
},
scrollIntoView() {

View File

@ -0,0 +1,11 @@
import Ember from 'ember';
export default Ember.Component.extend({
willDestroyElement() {
this._super(...arguments);
if (this.get('tag.isDeleted') && this.attrs.onDelete) {
this.attrs.onDelete();
}
}
});

View File

@ -81,14 +81,6 @@ export default Controller.extend({
}),
actions: {
showPostContent(post) {
if (!post) {
return;
}
this.transitionToRoute('posts.post', post);
},
toggleDeletePostModal() {
this.toggleProperty('showDeletePostModal');
}

View File

@ -8,10 +8,9 @@ export default Mixin.create({
/**
* Determines if we are past a scroll point where we need to fetch the next page
* @param {object} event The scroll event
*/
checkScroll(event) {
let element = event.target;
_checkScroll() {
let element = this.get('element');
let triggerPoint = this.get('triggerPoint');
let isLoading = this.get('isLoading');
@ -28,11 +27,11 @@ export default Mixin.create({
let el = this.get('element');
el.onscroll = run.bind(this, this.checkScroll);
el.onscroll = run.bind(this, this._checkScroll);
if (el.scrollHeight <= el.clientHeight) {
this.sendAction('fetch');
}
// run on load, on the offchance that the initial load
// did not fill the view.
this._checkScroll();
},
willDestroyElement() {

View File

@ -1 +1 @@
{{yield this}}
{{yield previewIsHidden}}

View File

@ -1 +1 @@
{{yield}}
{{yield (action "checkScroll")}}

View File

@ -0,0 +1,8 @@
<div class="settings-tag">
{{#link-to 'settings.tags.tag' tag class="tag-edit-button"}}
<span class="tag-title">{{tag.name}}</span>
<span class="label label-default">/{{tag.slug}}</span>
<p class="tag-description">{{tag.description}}</p>
<span class="tags-count">{{tag.count.posts}}</span>
{{/link-to}}
</div>

View File

@ -1,4 +1,4 @@
{{#gh-content-view-container as |container|}}
{{#gh-content-view-container as |previewIsHidden|}}
<header class="view-header">
{{#gh-view-title openMobileMenu="openMobileMenu"}}<span>Content</span>{{/gh-view-title}}
<section class="view-actions">
@ -8,11 +8,11 @@
<div class="view-container">
<section class="content-list js-content-list {{if postListFocused 'keyboard-focused'}}">
{{#gh-infinite-scroll-box tagName="section" classNames="content-list-content js-content-scrollbox" fetch="loadNextPage"}}
{{#gh-infinite-scroll tagName="section" classNames="content-list-content js-content-scrollbox" fetch="loadNextPage" as |checkScroll|}}
<ol class="posts-list">
{{#each sortedPosts key="id" as |post|}}
{{#gh-posts-list-item post=post onDoubleClick="openEditor" previewIsHidden=container.previewIsHidden as |component|}}
{{#link-to component.viewOrEdit post.id class="permalink" title="Edit this post"}}
{{#gh-posts-list-item post=post onDoubleClick="openEditor" onDelete=(action checkScroll) as |component|}}
{{#link-to (if previewIsHidden 'editor.edit' 'posts.post') post.id class="permalink" title="Edit this post"}}
<h3 class="entry-title">{{post.title}}</h3>
<section class="entry-meta">
<span class="avatar" style={{component.authorAvatarBackground}}>
@ -37,7 +37,7 @@
{{/gh-posts-list-item}}
{{/each}}
</ol>
{{/gh-infinite-scroll-box}}
{{/gh-infinite-scroll}}
</section>
<section class="content-preview js-content-preview {{if postContentFocused 'keyboard-focused'}}">
{{outlet}}

View File

@ -12,17 +12,11 @@
fetch="loadNextPage"
isLoading=isLoading
classNames="tag-list"
as |checkScroll|
}}
<section class="tag-list-content settings-tags {{if tagListFocused 'keyboard-focused'}}">
{{#each tags as |tag|}}
<div class="settings-tag">
{{#link-to 'settings.tags.tag' tag class="tag-edit-button"}}
<span class="tag-title">{{tag.name}}</span>
<span class="label label-default">/{{tag.slug}}</span>
<p class="tag-description">{{tag.description}}</p>
<span class="tags-count">{{tag.count.posts}}</span>
{{/link-to}}
</div>
{{gh-tag tag=tag onDelete=(action checkScroll)}}
{{/each}}
</section>
{{/gh-infinite-scroll}}

View File

@ -1,28 +0,0 @@
/* jshint expr:true */
import {expect} from 'chai';
import {
describeComponent,
it
} from 'ember-mocha';
describeComponent(
'gh-infinite-scroll-box',
'Unit: Component: gh-infinite-scroll-box',
{
unit: true
// specify the other units that are required for this test
// needs: ['component:foo', 'helper:bar']
},
function () {
it('renders', function () {
// creates the component instance
let component = this.subject();
expect(component._state).to.equal('preRender');
// renders the component on the page
this.render();
expect(component._state).to.equal('inDOM');
});
}
);