mirror of
https://github.com/flarum/core.git
synced 2025-08-14 04:14:06 +02:00
Upgrade to Ember 1.11-beta.1
HTMLBars goodness! Since there was some breakage and a lot of fiddling around to get some things working, I took this opportunity to do a big cleanup of the whole Ember app. I accidentally worked on some new features too :3 Note that the app is still broken right now, pending on https://github.com/emberjs/ember.js/issues/10401 Cleanup: - Restructuring of components - Consolidation of some stuff into mixins, cleanup of some APIs that will be public - Change all instances of .property() / .observes() / .on() to Ember.computed() / Ember.observer() / Ember.on() respectively (I think it is more readable) - More comments - Start conforming to a code style (2 spaces for indentation) New features: - Post hiding/restoring - Mark individual discussions as read by clicking - Clicking on a read discussion jumps to the end - Mark all discussions as read - Progressively mark the discussion as read as the page is scrolled - Unordered list post formatting - Post permalink popup Demo once that Ember regression is fixed!
This commit is contained in:
87
ember/app/components/index/discussion-listing.js
Executable file
87
ember/app/components/index/discussion-listing.js
Executable file
@@ -0,0 +1,87 @@
|
||||
import Ember from 'ember';
|
||||
|
||||
import HasItemLists from 'flarum/mixins/has-item-lists';
|
||||
import FadeIn from 'flarum/mixins/fade-in';
|
||||
|
||||
/**
|
||||
Component for a discussion listing on the discussions index. It has `info`
|
||||
and `controls` item lists for a bit of flexibility.
|
||||
*/
|
||||
export default Ember.Component.extend(FadeIn, HasItemLists, {
|
||||
layoutName: 'components/index/discussion-listing',
|
||||
tagName: 'li',
|
||||
attributeBindings: ['discussionId:data-id'],
|
||||
classNames: ['discussion-summary'],
|
||||
classNameBindings: [
|
||||
'discussion.isUnread:unread',
|
||||
'active'
|
||||
],
|
||||
itemLists: ['info', 'controls'],
|
||||
|
||||
terminalPostType: 'last',
|
||||
countType: 'unread',
|
||||
|
||||
discussionId: Ember.computed.alias('discussion.id'),
|
||||
|
||||
active: Ember.computed('childViews.@each.active', function() {
|
||||
return this.get('childViews').anyBy('active');
|
||||
}),
|
||||
|
||||
displayUnread: Ember.computed('countType', 'discussion.isUnread', function() {
|
||||
return this.get('countType') === 'unread' && this.get('discussion.isUnread');
|
||||
}),
|
||||
|
||||
countTitle: Ember.computed('discussion.isUnread', function() {
|
||||
return this.get('discussion.isUnread') ? 'Mark as Read' : '';
|
||||
}),
|
||||
|
||||
displayLastPost: Ember.computed('terminalPostType', 'discussion.repliesCount', function() {
|
||||
return this.get('terminalPostType') === 'last' && this.get('discussion.repliesCount');
|
||||
}),
|
||||
|
||||
start: Ember.computed('discussion.lastPostNumber', 'discussion.readNumber', function() {
|
||||
return Math.min(this.get('discussion.lastPostNumber'), (this.get('discussion.readNumber') || 0) + 1);
|
||||
}),
|
||||
|
||||
relevantPosts: Ember.computed('discussion.relevantPosts', 'discussion.startPost', 'discussion.lastPost', function() {
|
||||
if (this.get('controller.show') !== 'posts') { return []; }
|
||||
if (this.get('controller.searchQuery')) {
|
||||
return this.get('discussion.relevantPosts');
|
||||
} else if (this.get('controller.sort') === 'newest' || this.get('controller.sort') === 'oldest') {
|
||||
return [this.get('discussion.startPost')];
|
||||
} else {
|
||||
return [this.get('discussion.lastPost')];
|
||||
}
|
||||
}),
|
||||
|
||||
populateControls: function(items) {
|
||||
|
||||
},
|
||||
|
||||
populateInfo: function(items) {
|
||||
items.pushObjectWithTag(Ember.Component.extend({
|
||||
classNames: ['terminal-post'],
|
||||
layoutName: 'components/index/discussion-info/terminal-post',
|
||||
discussion: Ember.computed.alias('parent.discussion'),
|
||||
displayLastPost: Ember.computed.alias('parent.displayLastPost'),
|
||||
}).create({parent: this}), 'terminalPost');
|
||||
},
|
||||
|
||||
actions: {
|
||||
// In the template, we render the "controls" dropdown with the contents of
|
||||
// the `renderControls` property. This way, when a post is initially
|
||||
// rendered, it doesn't have to go to the trouble of rendering the
|
||||
// controls right away, which speeds things up. When the dropdown button
|
||||
// is clicked, this will fill in the actual controls.
|
||||
renderControls: function() {
|
||||
this.set('renderControls', this.get('controls'));
|
||||
},
|
||||
|
||||
markAsRead: function() {
|
||||
if (this.get('discussion.isUnread')) {
|
||||
discussion.set('readNumber', discussion.get('lastPostNumber'));
|
||||
discussion.save();
|
||||
}
|
||||
}
|
||||
}
|
||||
});
|
Reference in New Issue
Block a user