IntenseWebs/discourse
3
0
Fork 0
mirror of https://github.com/discourse/discourse.git synced 2024-12-02 05:29:17 -06:00
Code Issues Packages Projects Releases Wiki Activity

FIX: edit history navigation issues

Browse Source
This commit is contained in:
Régis Hanol 2015-08-19 21:10:12 +02:00
parent 42cb1fcaf6
commit ffb0690119
5 changed files with 85 additions and 52 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

19
app/assets/javascripts/discourse/components/d-button.js.es6
View File

@ -1,4 +1,5 @@
import { iconHTML } from 'discourse/helpers/fa-icon'; import { iconHTML } from 'discourse/helpers/fa-icon';
import computed from 'ember-addons/ember-computed-decorators';
export default Ember.Component.extend({ export default Ember.Component.extend({
tagName: 'button', tagName: 'button',
@ -7,17 +8,15 @@ export default Ember.Component.extend({
noText: Ember.computed.empty('translatedLabel'), noText: Ember.computed.empty('translatedLabel'),
translatedTitle: function() { @computed("title", "translatedLabel")
const title = this.get('title'); translatedTitle(title, translatedLabel) {
return title ? I18n.t(title) : this.get('translatedLabel'); return title ? I18n.t(title) : translatedLabel;
}.property('title', 'translatedLabel'), },
translatedLabel: function() { @computed("label")
const label = this.get('label'); translatedLabel(label) {
if (label) { if (label) return I18n.t(label);
return I18n.t(this.get('label')); },
}
}.property('label'),
render(buffer) { render(buffer) {
const label = this.get('translatedLabel'), const label = this.get('translatedLabel'),

80
app/assets/javascripts/discourse/controllers/history.js.es6
View File

@ -1,6 +1,7 @@
import ModalFunctionality from 'discourse/mixins/modal-functionality'; import ModalFunctionality from 'discourse/mixins/modal-functionality';
import { categoryBadgeHTML } from 'discourse/helpers/category-link'; import { categoryBadgeHTML } from 'discourse/helpers/category-link';
import computed from 'ember-addons/ember-computed-decorators'; import computed from 'ember-addons/ember-computed-decorators';
import { propertyGreaterThan, propertyLessThan } from 'discourse/lib/computed';
// This controller handles displaying of history // This controller handles displaying of history
export default Ember.Controller.extend(ModalFunctionality, { export default Ember.Controller.extend(ModalFunctionality, {
@ -15,30 +16,28 @@ export default Ember.Controller.extend(ModalFunctionality, {
refresh(postId, postVersion) { refresh(postId, postVersion) {
this.set("loading", true); this.set("loading", true);
var self = this; Discourse.Post.loadRevision(postId, postVersion).then(result => {
Discourse.Post.loadRevision(postId, postVersion).then(function (result) { this.setProperties({ loading: false, model: result });
self.setProperties({ loading: false, model: result });
}); });
}, },
hide(postId, postVersion) { hide(postId, postVersion) {
var self = this; Discourse.Post.hideRevision(postId, postVersion).then(() => this.refresh(postId, postVersion));
Discourse.Post.hideRevision(postId, postVersion).then(function () {
self.refresh(postId, postVersion);
});
}, },
show(postId, postVersion) { show(postId, postVersion) {
var self = this; Discourse.Post.showRevision(postId, postVersion).then(() => this.refresh(postId, postVersion));
Discourse.Post.showRevision(postId, postVersion).then(function () {
self.refresh(postId, postVersion);
});
}, },
createdAtDate: function() { return moment(this.get("created_at")).format("LLLL"); }.property("created_at"), @computed('model.created_at')
createdAtDate(createdAt) {
return moment(createdAt).format("LLLL");
},
@computed('model.current_version') @computed('model.current_version')
previousVersion(current) { return current - 1; }, previousVersion(current) {
return current - 1;
},
@computed('model.current_revision', 'model.previous_revision') @computed('model.current_revision', 'model.previous_revision')
displayGoToPrevious(current, prev) { displayGoToPrevious(current, prev) {
@ -46,18 +45,28 @@ export default Ember.Controller.extend(ModalFunctionality, {
}, },
displayRevisions: Ember.computed.gt("model.version_count", 2), displayRevisions: Ember.computed.gt("model.version_count", 2),
displayGoToFirst: Ember.computed.gt('model.current_revision', 'model.first_revision'), displayGoToFirst: propertyGreaterThan("model.current_revision", "model.first_revision"),
displayGoToNext: Ember.computed.lt("model.current_revision", "model.next_revision"), displayGoToNext: propertyLessThan("model.current_revision", "model.next_revision"),
displayGoToLast: Ember.computed.lt("model.current_revision", "model.next_revision"), displayGoToLast: propertyLessThan("model.current_revision", "model.next_revision"),
@computed('model.previous_hidden', 'loading') hideGoToFirst: Ember.computed.not("displayGoToFirst"),
displayShow: function(prevHidden, loading) { hideGoToPrevious: Ember.computed.not("displayGoToPrevious"),
return prevHidden && this.currentUser.get('staff') && !loading; hideGoToNext: Ember.computed.not("displayGoToNext"),
hideGoToLast: Ember.computed.not("displayGoToLast"),
loadFirstDisabled: Ember.computed.or("loading", "hideGoToFirst"),
loadPreviousDisabled: Ember.computed.or("loading", "hideGoToPrevious"),
loadNextDisabled: Ember.computed.or("loading", "hideGoToNext"),
loadLastDisabled: Ember.computed.or("loading", "hideGoToLast"),
@computed('model.previous_hidden')
displayShow(prevHidden) {
return prevHidden && this.currentUser.get('staff');
}, },
@computed('model.previous_hidden', 'loading') @computed('model.previous_hidden')
displayHide: function(prevHidden, loading) { displayHide(prevHidden) {
return !prevHidden && this.currentUser.get('staff') && !loading; return !prevHidden && this.currentUser.get('staff');
}, },
isEitherRevisionHidden: Ember.computed.or("model.previous_hidden", "model.current_hidden"), isEitherRevisionHidden: Ember.computed.or("model.previous_hidden", "model.current_hidden"),
@ -78,6 +87,15 @@ export default Ember.Controller.extend(ModalFunctionality, {
displayingSideBySide: Em.computed.equal("viewMode", "side_by_side"), displayingSideBySide: Em.computed.equal("viewMode", "side_by_side"),
displayingSideBySideMarkdown: Em.computed.equal("viewMode", "side_by_side_markdown"), displayingSideBySideMarkdown: Em.computed.equal("viewMode", "side_by_side_markdown"),
@computed("displayingInline")
inlineClass(displayingInline) { return displayingInline ? "btn-primary" : ""; },
@computed("displayingSideBySide")
sideBySideClass(displayingSideBySide) { return displayingSideBySide ? "btn-primary" : ""; },
@computed("displayingSideBySideMarkdown")
sideBySideMarkdownClass(displayingSideBySideMarkdown) { return displayingSideBySideMarkdown ? "btn-primary" : ""; },
@computed('model.category_id_changes') @computed('model.category_id_changes')
previousCategory(changes) { previousCategory(changes) {
if (changes) { if (changes) {
@ -116,16 +134,16 @@ export default Ember.Controller.extend(ModalFunctionality, {
}, },
actions: { actions: {
loadFirstVersion: function() { this.refresh(this.get("model.post_id"), this.get("model.first_revision")); }, loadFirstVersion() { this.refresh(this.get("model.post_id"), this.get("model.first_revision")); },
loadPreviousVersion: function() { this.refresh(this.get("model.post_id"), this.get("model.previous_revision")); }, loadPreviousVersion() { this.refresh(this.get("model.post_id"), this.get("model.previous_revision")); },
loadNextVersion: function() { this.refresh(this.get("model.post_id"), this.get("model.next_revision")); }, loadNextVersion() { this.refresh(this.get("model.post_id"), this.get("model.next_revision")); },
loadLastVersion: function() { this.refresh(this.get("model.post_id"), this.get("model.last_revision")); }, loadLastVersion() { this.refresh(this.get("model.post_id"), this.get("model.last_revision")); },
hideVersion: function() { this.hide(this.get("model.post_id"), this.get("model.current_revision")); }, hideVersion() { this.hide(this.get("model.post_id"), this.get("model.current_revision")); },
showVersion: function() { this.show(this.get("model.post_id"), this.get("model.current_revision")); }, showVersion() { this.show(this.get("model.post_id"), this.get("model.current_revision")); },
displayInline: function() { this.set("viewMode", "inline"); }, displayInline() { this.set("viewMode", "inline"); },
displaySideBySide: function() { this.set("viewMode", "side_by_side"); }, displaySideBySide() { this.set("viewMode", "side_by_side"); },
displaySideBySideMarkdown: function() { this.set("viewMode", "side_by_side_markdown"); } displaySideBySideMarkdown() { this.set("viewMode", "side_by_side_markdown"); }
} }
}); });

12
app/assets/javascripts/discourse/lib/computed.js.es6
View File

@ -26,6 +26,18 @@ export function propertyNotEqual(p1, p2) {
}).property(p1, p2); }).property(p1, p2);
} }
export function propertyGreaterThan(p1, p2) {
return Ember.computed(function() {
return this.get(p1) > this.get(p2);
}).property(p1, p2);
}
export function propertyLessThan(p1, p2) {
return Ember.computed(function() {
return this.get(p1) < this.get(p2);
}).property(p1, p2);
}
/** /**
Returns i18n version of a string based on a property. Returns i18n version of a string based on a property.

18
app/assets/javascripts/discourse/templates/modal/history.hbs
View File

@ -1,27 +1,27 @@
<div class="modal-body"> <div class="modal-body">
<div> <div>
<div id="revision-controls"> <div id="revision-controls">
<button title="{{i18n 'post.revisions.controls.first'}}" {{bind-attr class=":btn :standard :no-text displayGoToFirst::invisible" disabled=loading}} {{action "loadFirstVersion"}}><i class="fa fa-fast-backward"></i></button> {{d-button action="loadFirstVersion" icon="fast-backward" title="post.revisions.controls.first" disabled=loadFirstDisabled}}
<button title="{{i18n 'post.revisions.controls.previous'}}" {{bind-attr class=":btn :standard :no-text displayGoToPrevious::invisible" disabled=loading}} {{action "loadPreviousVersion"}}><i class="fa fa-backward"></i></button> {{d-button action="loadPreviousVersion" icon="backward" title="post.revisions.controls.previous" disabled=loadPreviousDisabled}}
<div id="revision-numbers" {{bind-attr class="displayRevisions::invisible"}}> <div id="revision-numbers" {{bind-attr class="displayRevisions::invisible"}}>
{{#conditional-loading-spinner condition=loading size="small"}} {{#conditional-loading-spinner condition=loading size="small"}}
{{boundI18n revisionsTextKey previousBinding="previousVersion" currentBinding="model.current_version" totalBinding="model.version_count"}} {{boundI18n revisionsTextKey previousBinding="previousVersion" currentBinding="model.current_version" totalBinding="model.version_count"}}
{{/conditional-loading-spinner}} {{/conditional-loading-spinner}}
</div> </div>
<button title="{{i18n 'post.revisions.controls.next'}}" {{bind-attr class=":btn :standard :no-text displayGoToNext::invisible" disabled=loading}} {{action "loadNextVersion"}}><i class="fa fa-forward"></i></button> {{d-button action="loadNextVersion" icon="forward" title="post.revisions.controls.next" disabled=loadNextDisabled}}
<button title="{{i18n 'post.revisions.controls.last'}}" {{bind-attr class=":btn :standard :no-text displayGoToLast::invisible" disabled=loading}} {{action "loadLastVersion"}}><i class="fa fa-fast-forward"></i></button> {{d-button action="loadLastVersion" icon="fast-forward" title="post.revisions.controls.last" disabled=loadLastDisabled}}
{{#if displayHide}} {{#if displayHide}}
<button title="{{i18n 'post.revisions.controls.hide'}}" {{bind-attr class=":btn :standard :no-text :btn-danger" disabled=loading}} {{action "hideVersion"}}><i class="fa fa-trash-o"></i></button> {{d-button action="hideVersion" icon="trash-o" title="post.revisions.controls.hide" class="btn-danger" disabled=loading}}
{{/if}} {{/if}}
{{#if displayShow}} {{#if displayShow}}
<button title="{{i18n 'post.revisions.controls.show'}}" {{bind-attr class=":btn :standard :no-text" disabled=loading}} {{action "showVersion"}}><i class="fa fa-undo"></i></button> {{d-button action="showVersion" icon="undo" title="post.revisions.controls.show" disabled=loading}}
{{/if}} {{/if}}
</div> </div>
<div id="display-modes"> <div id="display-modes">
<button {{bind-attr class=":btn displayingInline:btn-primary:standard"}} title="{{i18n 'post.revisions.displays.inline.title'}}" {{action "displayInline"}}>{{{i18n 'post.revisions.displays.inline.button'}}}</button> {{d-button action="displayInline" label="post.revisions.displays.inline.button" title="post.revisions.displays.inline.title" class=inlineClass}}
{{#unless site.mobileView}} {{#unless site.mobileView}}
<button {{bind-attr class=":btn displayingSideBySide:btn-primary:standard"}} title="{{i18n 'post.revisions.displays.side_by_side.title'}}" {{action "displaySideBySide"}}>{{{i18n 'post.revisions.displays.side_by_side.button'}}}</button> {{d-button action="displaySideBySide" label="post.revisions.displays.side_by_side.button" title="post.revisions.displays.side_by_side.title" class=sideBySideClass}}
<button {{bind-attr class=":btn displayingSideBySideMarkdown:btn-primary:standard"}} title="{{i18n 'post.revisions.displays.side_by_side_markdown.title'}}" {{action "displaySideBySideMarkdown"}}>{{{i18n 'post.revisions.displays.side_by_side_markdown.button'}}}</button> {{d-button action="displaySideBySideMarkdown" label="post.revisions.displays.side_by_side_markdown.button" title="post.revisions.displays.side_by_side_markdown.title" class=sideBySideMarkdownClass}}
{{/unless}} {{/unless}}
</div> </div>
</div> </div>

8
app/assets/stylesheets/desktop/history.scss
View File

@ -11,8 +11,12 @@
} }
#revision-controls { #revision-controls {
float: left; float: left;
.btn[disabled]:hover { .btn[disabled] {
color: $primary; cursor: not-allowed;
background-color: dark-light-diff($primary, $secondary, 90%, -60%);
}
.btn-danger[disabled] {
background-color: dark-light-diff($danger, $secondary, 30%, -60%);
} }
} }
#display-modes { #display-modes {