Make DiscussionRenamedPost spread across three lines

This also adds a little button for expanding / collapsing this additional information.
It is expanded by default right now because I could not get the toggling to work yet.

Refs #428.
This commit is contained in:
Franz Liedke 2016-03-30 22:13:08 +09:00
parent bc11ec68dd
commit d6c6e78193
3 changed files with 85 additions and 11 deletions

45
js/forum/dist/app.js vendored
View File

@ -21254,10 +21254,12 @@ System.register('flarum/components/DiscussionRenamedNotification', ['flarum/comp
});;
'use strict';
System.register('flarum/components/DiscussionRenamedPost', ['flarum/components/EventPost'], function (_export, _context) {
var EventPost, DiscussionRenamedPost;
System.register('flarum/components/DiscussionRenamedPost', ['flarum/components/Button', 'flarum/components/EventPost'], function (_export, _context) {
var Button, EventPost, DiscussionRenamedPost;
return {
setters: [function (_flarumComponentsEventPost) {
setters: [function (_flarumComponentsButton) {
Button = _flarumComponentsButton.default;
}, function (_flarumComponentsEventPost) {
EventPost = _flarumComponentsEventPost.default;
}],
execute: function () {
@ -21270,14 +21272,21 @@ System.register('flarum/components/DiscussionRenamedPost', ['flarum/components/E
}
babelHelpers.createClass(DiscussionRenamedPost, [{
key: 'init',
value: function init() {
babelHelpers.get(Object.getPrototypeOf(DiscussionRenamedPost.prototype), 'init', this).call(this);
this.expanded = true;
}
}, {
key: 'icon',
value: function icon() {
return 'pencil';
}
}, {
key: 'descriptionKey',
value: function descriptionKey() {
return 'core.forum.post_stream.discussion_renamed_text';
key: 'description',
value: function description(data) {
return [app.translator.trans('core.forum.post_stream.discussion_renamed_text', data), this.toggleButton(), this.expanded ? this.full(data) : null];
}
}, {
key: 'descriptionData',
@ -21299,6 +21308,30 @@ System.register('flarum/components/DiscussionRenamedPost', ['flarum/components/E
)
};
}
}, {
key: 'full',
value: function full(data) {
return [m('br', null), app.translator.trans('core.forum.post_stream.discussion_renamed_old_text', data), m('br', null), app.translator.trans('core.forum.post_stream.discussion_renamed_new_text', data)];
}
}, {
key: 'collapsed',
value: function collapsed() {
return this.toggleButton();
}
}, {
key: 'toggle',
value: function toggle() {
this.expanded = !this.expanded;
}
}, {
key: 'toggleButton',
value: function toggleButton() {
return Button.component({
className: 'Button Button--default Button--more',
icon: 'ellipsis-h',
onclick: this.toggle.bind(this)
});
}
}]);
return DiscussionRenamedPost;
}(EventPost);

View File

@ -1,3 +1,4 @@
import Button from 'flarum/components/Button';
import EventPost from 'flarum/components/EventPost';
/**
@ -9,12 +10,22 @@ import EventPost from 'flarum/components/EventPost';
* - All of the props for EventPost
*/
export default class DiscussionRenamedPost extends EventPost {
init() {
super.init();
this.expanded = true;
}
icon() {
return 'pencil';
}
descriptionKey() {
return 'core.forum.post_stream.discussion_renamed_text';
description(data) {
return [
app.translator.trans('core.forum.post_stream.discussion_renamed_text', data),
this.toggleButton(),
this.expanded ? this.full(data) : null
];
}
descriptionData() {
@ -27,4 +38,29 @@ export default class DiscussionRenamedPost extends EventPost {
'new': <strong className="DiscussionRenamedPost-new">{newTitle}</strong>
};
}
full(data) {
return [
<br />,
app.translator.trans('core.forum.post_stream.discussion_renamed_old_text', data),
<br />,
app.translator.trans('core.forum.post_stream.discussion_renamed_new_text', data)
];
}
collapsed() {
return this.toggleButton();
}
toggle() {
this.expanded = !this.expanded;
}
toggleButton() {
return Button.component({
className: 'Button Button--default Button--more',
icon: 'ellipsis-h',
onclick: this.toggle.bind(this)
});
}
}

View File

@ -224,9 +224,14 @@
font-size: 14px;
}
.DiscussionRenamedPost-old, .DiscussionRenamedPost-new {
font-weight: normal;
font-style: italic;
.DiscussionRenamedPost {
&-old, &-new {
font-weight: normal;
font-style: italic;
}
.Button--more {
margin-left: 5px;
}
}
.Post-footer, .Post-actions {