diff --git a/app/assets/javascripts/discourse/controllers/history_controller.js b/app/assets/javascripts/discourse/controllers/history_controller.js index 7d8a8026172..26e697feb75 100644 --- a/app/assets/javascripts/discourse/controllers/history_controller.js +++ b/app/assets/javascripts/discourse/controllers/history_controller.js @@ -22,11 +22,13 @@ Discourse.HistoryController = Discourse.ObjectController.extend(Discourse.ModalF createdAtDate: function() { return moment(this.get("created_at")).format("LLLL"); }.property("created_at"), - previousVersionNumber: function() { return this.get("version") - 1; }.property("version"), - currentVersionNumber: Em.computed.alias("version"), + previousVersion: function() { return this.get("version") - 1; }.property("version"), - isFirstVersion: Em.computed.equal("version", 2), - isLastVersion: Discourse.computed.propertyEqual("version", "revisions_count"), + displayGoToFirst: Em.computed.gt("version", 3), + displayGoToPrevious: Em.computed.gt("version", 2), + displayRevisions: Em.computed.gt("revisions_count", 2), + displayGoToNext: function() { return this.get("version") < this.get("revisions_count"); }.property("version", "revisions_count"), + displayGoToLast: function() { return this.get("version") < this.get("revisions_count") - 1; }.property("version", "revisions_count"), displayingInline: Em.computed.equal("viewMode", "inline"), displayingSideBySide: Em.computed.equal("viewMode", "side_by_side"), diff --git a/app/assets/javascripts/discourse/templates/modal/history.js.handlebars b/app/assets/javascripts/discourse/templates/modal/history.js.handlebars index 7415153602a..ec31a6e5ea4 100644 --- a/app/assets/javascripts/discourse/templates/modal/history.js.handlebars +++ b/app/assets/javascripts/discourse/templates/modal/history.js.handlebars @@ -1,38 +1,35 @@ <div class="modal-body"> - {{#if loading}} - {{i18n loading}} - {{else}} - <div> - <div id="revision-controls"> - <button class="btn standard" title="{{i18n post.revisions.controls.first}}" {{action loadFirstVersion}} {{bind-attr disabled=isFirstVersion}}><i class="fa fa-fast-backward"></i></button> - <button class="btn standard" title="{{i18n post.revisions.controls.previous}}" {{action loadPreviousVersion}} {{bind-attr disabled=isFirstVersion}}><i class="fa fa-backward"></i></button> - {{{i18n post.revisions.controls.comparing_previous_to_current_out_of_total previous=previousVersionNumber current=currentVersionNumber total=revisions_count}}} - <button class="btn standard" title="{{i18n post.revisions.controls.next}}" {{action loadNextVersion}} {{bind-attr disabled=isLastVersion}}><i class="fa fa-forward"></i></button> - <button class="btn standard" title="{{i18n post.revisions.controls.last}}" {{action loadLastVersion}} {{bind-attr disabled=isLastVersion}}><i class="fa fa-fast-forward"></i></button> + <div> + <div id="revision-controls"> + {{#if displayGoToFirst}}<button class="btn standard" title="{{i18n post.revisions.controls.first}}" {{bind-attr disabled=loading}} {{action loadFirstVersion}}><i class="fa fa-fast-backward"></i></button>{{/if}} + {{#if displayGoToPrevious}}<button class="btn standard" title="{{i18n post.revisions.controls.previous}}" {{bind-attr disabled=loading}} {{action loadPreviousVersion}}><i class="fa fa-backward"></i></button>{{/if}} + {{#if displayRevisions}}{{{i18n post.revisions.controls.comparing_previous_to_current_out_of_total previous=previousVersion current=version total=revisions_count}}}{{/if}} + {{#if displayGoToNext}}<button class="btn standard" title="{{i18n post.revisions.controls.next}}" {{bind-attr disabled=loading}} {{action loadNextVersion}}><i class="fa fa-forward"></i></button>{{/if}} + {{#if displayGoToLast}}<button class="btn standard" title="{{i18n post.revisions.controls.last}}" {{bind-attr disabled=loading}} {{action loadLastVersion}}><i class="fa fa-fast-forward"></i></button>{{/if}} + </div> + {{#if loading}}<div id='revision-loading'><i class='fa fa-spinner fa-spin'></i>{{i18n loading}}</div>{{/if}} + <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> + {{#unless Discourse.Mobile.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> + <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> + {{/unless}} + </div> + </div> + <div id="revision-details"> + {{i18n post.revisions.details.edited_by}} {{avatar this imageSize="small"}} {{username}} <span class="date">{{unboundDate path="created_at" leaveAgo="true"}}</span> {{#if edit_reason}} — <span class="edit-reason">{{edit_reason}}</span>{{/if}} + </div> + <div id="revisions"> + {{#if title_changes}} + <div class="row"> + <h2>{{{title_diff}}}</h2> </div> - <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> - {{#unless Discourse.Mobile.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> - <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> - {{/unless}} + {{/if}} + {{#if category_changes}} + <div class="row"> + {{{category_diff}}} </div> - </div> - <div id="revision-details"> - {{i18n post.revisions.details.edited_by}} {{avatar this imageSize="small"}} {{username}} <span class="date">{{unboundDate path="created_at" leaveAgo="true"}}</span> {{#if edit_reason}} — <span class="edit-reason">{{edit_reason}}</span>{{/if}} - </div> - <div id="revisions"> - {{#if title_changes}} - <div class="row"> - <h2>{{{title_diff}}}</h2> - </div> - {{/if}} - {{#if category_changes}} - <div class="row"> - {{{category_diff}}} - </div> - {{/if}} - {{{body_diff}}} - </div> - {{/if}} + {{/if}} + {{{body_diff}}} + </div> </div> diff --git a/app/assets/stylesheets/desktop/history.scss b/app/assets/stylesheets/desktop/history.scss index 6aefebf9bab..7594229bf13 100644 --- a/app/assets/stylesheets/desktop/history.scss +++ b/app/assets/stylesheets/desktop/history.scss @@ -17,6 +17,13 @@ #display-modes { text-align: right; } + #revision-loading { + float: left; + margin: 5px 0 0 10px; + .fa { + margin-right: 7px; + } + } #revision-details { background-color: lighten($secondary_background_color, 76%); padding: 5px;