Fix active discussion not highlighting in pane

This commit is contained in:
Toby Zerner 2015-06-25 15:33:56 +09:30
parent 1b499326a3
commit ad47f022b7

View File

@ -4,7 +4,6 @@ import listItems from 'flarum/helpers/list-items';
import highlight from 'flarum/helpers/highlight'; import highlight from 'flarum/helpers/highlight';
import icon from 'flarum/helpers/icon'; import icon from 'flarum/helpers/icon';
import humanTime from 'flarum/utils/human-time'; import humanTime from 'flarum/utils/human-time';
import classList from 'flarum/utils/class-list';
import ItemList from 'flarum/utils/item-list'; import ItemList from 'flarum/utils/item-list';
import abbreviateNumber from 'flarum/utils/abbreviate-number'; import abbreviateNumber from 'flarum/utils/abbreviate-number';
import DropdownButton from 'flarum/components/dropdown-button'; import DropdownButton from 'flarum/components/dropdown-button';
@ -19,10 +18,15 @@ export default class DiscussionListItem extends Component {
this.subtree = new SubtreeRetainer( this.subtree = new SubtreeRetainer(
() => this.props.discussion.freshness, () => this.props.discussion.freshness,
() => app.session.user() && app.session.user().readTime() () => app.session.user() && app.session.user().readTime(),
() => this.active()
); );
} }
active() {
return m.route.param('id') === this.props.discussion.id();
}
view() { view() {
var discussion = this.props.discussion; var discussion = this.props.discussion;
@ -32,9 +36,8 @@ export default class DiscussionListItem extends Component {
var jumpTo = Math.min(discussion.lastPostNumber(), (discussion.readNumber() || 0) + 1); var jumpTo = Math.min(discussion.lastPostNumber(), (discussion.readNumber() || 0) + 1);
var relevantPosts = this.props.q ? discussion.relevantPosts() : ''; var relevantPosts = this.props.q ? discussion.relevantPosts() : '';
var controls = discussion.controls(this).toArray(); var controls = discussion.controls(this).toArray();
var isActive = m.route.param('id') === discussion.id();
return this.subtree.retain() || m('div.discussion-list-item', {config: this.onload.bind(this)}, [ return this.subtree.retain() || m('div.discussion-list-item', {className: this.active() ? 'active' : ''}, [
controls.length ? DropdownButton.component({ controls.length ? DropdownButton.component({
items: controls, items: controls,
className: 'contextual-controls', className: 'contextual-controls',
@ -47,12 +50,7 @@ export default class DiscussionListItem extends Component {
onclick: this.markAsRead.bind(this) onclick: this.markAsRead.bind(this)
}, icon('check icon')), }, icon('check icon')),
m('div.slidable-slider.discussion-summary', { m('div.slidable-slider.discussion-summary', {className: isUnread ? 'unread' : ''}, [
className: classList({
unread: isUnread,
active: isActive
})
}, [
m((startUser ? 'a' : 'span')+'.author', { m((startUser ? 'a' : 'span')+'.author', {
href: startUser ? app.route.user(startUser) : undefined, href: startUser ? app.route.user(startUser) : undefined,
@ -112,7 +110,7 @@ export default class DiscussionListItem extends Component {
return items; return items;
} }
onload(element, isInitialized, context) { config(element, isInitialized, context) {
if (isInitialized) return; if (isInitialized) return;
if (window.ontouchstart !== 'undefined') { if (window.ontouchstart !== 'undefined') {