From 3c81297fc62e9c00a79954ff857a235c76368289 Mon Sep 17 00:00:00 2001 From: sauls8t Date: Thu, 20 Dec 2018 13:05:22 +0000 Subject: [PATCH] Move revisions to new ui framework --- .../components/document/document-toolbar.js | 9 +++ gui/app/components/document/view-revision.js | 43 +++-------- gui/app/constants/constants.js | 4 + gui/app/pods/document/index/controller.js | 16 ---- gui/app/pods/document/index/template.hbs | 53 +++++-------- gui/app/pods/document/revisions/controller.js | 33 ++++++++ gui/app/pods/document/revisions/route.js | 75 +++++++++++++++++++ gui/app/pods/document/revisions/template.hbs | 38 ++++++++++ gui/app/router.js | 3 + gui/app/styles/core/view/document/all.scss | 4 +- gui/app/styles/core/view/document/likes.scss | 29 +++++++ .../styles/core/view/document/revisions.scss | 11 +++ .../styles/core/view/document/section.scss | 4 +- .../core/view/document/view-revision.scss | 16 ---- .../styles/core/view/document/vote-likes.scss | 25 ------- .../components/document/document-toolbar.hbs | 25 ++++--- .../components/document/view-content.hbs | 24 +++--- .../components/document/view-revision.hbs | 52 +++++-------- .../components/folder/space-toolbar.hbs | 14 ++-- 19 files changed, 288 insertions(+), 190 deletions(-) create mode 100644 gui/app/pods/document/revisions/controller.js create mode 100644 gui/app/pods/document/revisions/route.js create mode 100644 gui/app/pods/document/revisions/template.hbs create mode 100644 gui/app/styles/core/view/document/likes.scss create mode 100644 gui/app/styles/core/view/document/revisions.scss delete mode 100644 gui/app/styles/core/view/document/view-revision.scss delete mode 100644 gui/app/styles/core/view/document/vote-likes.scss diff --git a/gui/app/components/document/document-toolbar.js b/gui/app/components/document/document-toolbar.js index 1aac2bb0..4e18d534 100644 --- a/gui/app/components/document/document-toolbar.js +++ b/gui/app/components/document/document-toolbar.js @@ -11,6 +11,7 @@ import $ from 'jquery'; import { inject as service } from '@ember/service'; +import { computed } from '@ember/object'; import AuthMixin from '../../mixins/auth'; import ModalMixin from '../../mixins/modal'; import Notifier from '../../mixins/notifier'; @@ -24,6 +25,14 @@ export default Component.extend(ModalMixin, AuthMixin, Notifier, { pinned: service(), browserSvc: service('browser'), documentSvc: service('document'), + showRevisions: computed('permissions', 'document.protection', function() { + if (!this.get('session.authenticated')) return false; + if (!this.get('session.viewUsers')) return false; + if (this.get('document.protection') === this.get('constants').ProtectionType.None) return true; + if (this.get('document.protection') === this.get('constants').ProtectionType.Review && this.get('permissions.documentApprove')) return true; + + return false; + }), init() { this._super(...arguments); diff --git a/gui/app/components/document/view-revision.js b/gui/app/components/document/view-revision.js index 97e3a799..646617df 100644 --- a/gui/app/components/document/view-revision.js +++ b/gui/app/components/document/view-revision.js @@ -9,19 +9,15 @@ // // https://documize.com -import { computed, set } from '@ember/object'; +import { computed } from '@ember/object'; import { inject as service } from '@ember/service'; import ModalMixin from '../../mixins/modal'; import Component from '@ember/component'; export default Component.extend(ModalMixin, { documentService: service('document'), - revision: null, - revisions: null, diff: '', - hasRevisions: computed('revisions', function() { - return this.get('revisions').length > 0; - }), + revision: null, hasDiff: computed('diff', function() { return this.get('diff').length > 0; }), @@ -34,32 +30,17 @@ export default Component.extend(ModalMixin, { this.get('document.protection') === constants.ProtectionType.None; }), - init() { - this._super(...arguments); - this.revisions = []; - }, - didReceiveAttrs() { this._super(...arguments); - this.fetchRevisions(); - }, - fetchRevisions() { - this.get('documentService').getDocumentRevisions(this.get('document.id')).then((revisions) => { - revisions.forEach((r) => { - set(r, 'deleted', r.revisions === 0); - let date = moment(r.created).format('Do MMMM YYYY HH:mm'); - let format = `${r.firstname} ${r.lastname} on ${date} changed ${r.title}`; - set(r, 'label', format); - }); + let revision = this.get('revision'); - this.set('revisions', revisions); - - if (revisions.length > 0 && is.null(this.get('revision'))) { - this.send('onSelectRevision', revisions[0]); + if (is.not.null(revision)) { + if (!revision.deleted) { + this.fetchDiff(revision.pageId, revision.id); } - }); - }, + } +}, fetchDiff(pageId, revisionId) { this.get('documentService').getPageRevisionDiff(this.get('document.id'), pageId, revisionId).then((revision) => { @@ -68,12 +49,8 @@ export default Component.extend(ModalMixin, { }, actions: { - onSelectRevision(revision) { - this.set('revision', revision); - - if (!revision.deleted) { - this.fetchDiff(revision.pageId, revision.id); - } + onShowModal() { + this.modalOpen('#document-rollback-modal', {show:true}); }, onRollback() { diff --git a/gui/app/constants/constants.js b/gui/app/constants/constants.js index 4d280dd7..1242bda7 100644 --- a/gui/app/constants/constants.js +++ b/gui/app/constants/constants.js @@ -245,6 +245,10 @@ let constants = EmberObject.extend({ Settings: 'dicon-settings-gear', Tag: 'dicon-delete-key', TimeBack: 'dicon-time', + TriangleSmallUp: 'dicon-small-triangle-up', + TriangleSmallDown: 'dicon-small-triangle-down', + TriangleSmallLeft: 'dicon-small-triangle-left', + TriangleSmallRight: 'dicon-small-triangle-right', Unlocked: 'dicon-unlocked', World: 'dicon-globe', }, diff --git a/gui/app/pods/document/index/controller.js b/gui/app/pods/document/index/controller.js index 0e51926e..0e73be56 100644 --- a/gui/app/pods/document/index/controller.js +++ b/gui/app/pods/document/index/controller.js @@ -21,7 +21,6 @@ export default Controller.extend(Notifier, { linkService: service('link'), router: service(), sidebarTab: 'toc', - tab: 'content', queryParams: ['currentPageId', 'source'], actions: { @@ -29,15 +28,7 @@ export default Controller.extend(Notifier, { this.set('sidebarTab', tab); }, - onTabChange(tab) { - this.set('tab', tab); - if (tab === 'content') { - this.send('refresh'); - } - }, - onShowPage(pageId) { - this.set('tab', 'content'); this.get('browser').scrollTo(`#page-${pageId}`); }, @@ -222,13 +213,6 @@ export default Controller.extend(Notifier, { }); }, - onRollback(pageId, revisionId) { - this.get('documentService').rollbackPage(this.get('document.id'), pageId, revisionId).then(() => { - this.set('tab', 'content'); - this.get('target._routerMicrolib').refresh(); - }); - }, - onEditMeta() { if (!this.get('permissions.documentEdit')) return; diff --git a/gui/app/pods/document/index/template.hbs b/gui/app/pods/document/index/template.hbs index 1d67f374..f69d2439 100644 --- a/gui/app/pods/document/index/template.hbs +++ b/gui/app/pods/document/index/template.hbs @@ -75,38 +75,25 @@ - {{#if (eq tab "content")}} - {{document/view-content - roles=roles - links=links - pages=pages - blocks=blocks - folder=folder - folders=folders - sections=sections - document=document - permissions=permissions - currentPageId=currentPageId - refresh=(action "refresh") - onSavePage=(action "onSavePage") - onCopyPage=(action "onCopyPage") - onMovePage=(action "onMovePage") - onDeletePage=(action "onPageDeleted") - onInsertSection=(action "onInsertSection") - onSavePageAsBlock=(action "onSavePageAsBlock") - onPageLevelChange=(action "onPageLevelChange") - onPageSequenceChange=(action "onPageSequenceChange")}} - {{/if}} - - {{#if (eq tab "revision")}} - {{#if showRevisions}} - {{document/view-revision - pages=pages - folder=folder - document=document - permissions=permissions - onRollback=(action "onRollback")}} - {{/if}} - {{/if}} + {{document/view-content + roles=roles + links=links + pages=pages + blocks=blocks + folder=folder + folders=folders + sections=sections + document=document + permissions=permissions + currentPageId=currentPageId + refresh=(action "refresh") + onSavePage=(action "onSavePage") + onCopyPage=(action "onCopyPage") + onMovePage=(action "onMovePage") + onDeletePage=(action "onPageDeleted") + onInsertSection=(action "onInsertSection") + onSavePageAsBlock=(action "onSavePageAsBlock") + onPageLevelChange=(action "onPageLevelChange") + onPageSequenceChange=(action "onPageSequenceChange")}} {{/layout/master-content}} diff --git a/gui/app/pods/document/revisions/controller.js b/gui/app/pods/document/revisions/controller.js new file mode 100644 index 00000000..0b244f54 --- /dev/null +++ b/gui/app/pods/document/revisions/controller.js @@ -0,0 +1,33 @@ +// Copyright 2016 Documize Inc. . All rights reserved. +// +// This software (Documize Community Edition) is licensed under +// GNU AGPL v3 http://www.gnu.org/licenses/agpl-3.0.en.html +// +// You can operate outside the AGPL restrictions by purchasing +// Documize Enterprise Edition and obtaining a commercial license +// by contacting . +// +// https://documize.com + +import { inject as service } from '@ember/service'; +import Notifier from '../../../mixins/notifier'; +import Controller from '@ember/controller'; + +export default Controller.extend(Notifier, { + documentService: service('document'), + router: service(), + selectedRevision: null, + + actions: { + onRevision(revision) { + this.set('selectedRevision', revision); + }, + + onRollback(pageId, revisionId) { + this.get('documentService').rollbackPage(this.get('document.id'), pageId, revisionId).then(() => { + this.notifySuccess('Reverted to selected revision'); + this.get('router').transitionTo('document.index'); + }); + } + } +}); diff --git a/gui/app/pods/document/revisions/route.js b/gui/app/pods/document/revisions/route.js new file mode 100644 index 00000000..6b59c968 --- /dev/null +++ b/gui/app/pods/document/revisions/route.js @@ -0,0 +1,75 @@ +// Copyright 2016 Documize Inc. . All rights reserved. +// +// This software (Documize Community Edition) is licensed under +// GNU AGPL v3 http://www.gnu.org/licenses/agpl-3.0.en.html +// +// You can operate outside the AGPL restrictions by purchasing +// Documize Enterprise Edition and obtaining a commercial license +// by contacting . +// +// https://documize.com + +import { set } from '@ember/object'; +import { Promise as EmberPromise, hash } from 'rsvp'; +import { inject as service } from '@ember/service'; +import AuthenticatedRouteMixin from 'ember-simple-auth/mixins/authenticated-route-mixin'; +import Route from '@ember/routing/route'; + +export default Route.extend(AuthenticatedRouteMixin, { + docSvc: service('document'), + linkService: service('link'), + folderService: service('folder'), + userService: service('user'), + + beforeModel() { + return new EmberPromise((resolve) => { + let doc = this.modelFor('document').document; + + this.get('docSvc').getDocumentRevisions(doc.get('id')).then((revisions) => { + revisions.forEach((r) => { + set(r, 'deleted', r.revisions === 0); + }); + + this.set('revisions', revisions); + + resolve(revisions) + }); + }); + }, + + model() { + return hash({ + folders: this.modelFor('document').folders, + folder: this.modelFor('document').folder, + document: this.modelFor('document').document, + pages: this.get('pages'), + permissions: this.modelFor('document').permissions, + roles: this.modelFor('document').roles, + revisions: this.get('revisions') + }); + }, + + setupController(controller, model) { + this._super(controller, model); + + controller.set('folders', model.folders); + controller.set('folder', model.folder); + controller.set('document', model.document); + controller.set('pages', model.pages); + controller.set('permissions', model.permissions); + controller.set('roles', model.roles); + controller.set('revisions', model.revisions); + + if (model.revisions.length > 0) { + controller.set('selectedRevision', model.revisions[0]); + } + }, + + activate: function () { + this._super(...arguments); + + let document = this.modelFor('document').document; + this.browser.setTitleWithoutSuffix(document.get('name')); + this.browser.setMetaDescription(document.get('excerpt')); + } +}); diff --git a/gui/app/pods/document/revisions/template.hbs b/gui/app/pods/document/revisions/template.hbs new file mode 100644 index 00000000..6c3cd77c --- /dev/null +++ b/gui/app/pods/document/revisions/template.hbs @@ -0,0 +1,38 @@ +{{#layout/master-sidebar}} + {{ui/ui-spacer size=300}} + + {{#link-to "document.index"}} + {{ui/ui-button color=constants.Color.Yellow light=true icon=constants.Icon.ArrowLeft label="Document"}} + {{/link-to}} + + {{ui/ui-spacer size=400}} + +
+
REVISIONS
+
+ {{#each revisions as |revision|}} +
+ +
{{formatted-date revision.created}}
+
+ {{/each}} +
+
+{{/layout/master-sidebar}} + +{{#layout/master-content}} + {{layout/logo-heading + title="Content Revisions" + desc="Review previous content changes and roll back edits" + icon=constants.Icon.TimeBack}} + + {{document/view-revision + pages=pages + folder=folder + document=document + permissions=permissions + revisions=revisions + revision=selectedRevision + onRollback=(action "onRollback")}} +{{/layout/master-content}} + diff --git a/gui/app/router.js b/gui/app/router.js index 96b79637..169521ef 100644 --- a/gui/app/router.js +++ b/gui/app/router.js @@ -56,6 +56,9 @@ export default Router.map(function () { this.route('settings', { path: 'settings' }); + this.route('revisions', { + path: 'revisions' + }); } ); diff --git a/gui/app/styles/core/view/document/all.scss b/gui/app/styles/core/view/document/all.scss index cfc0bd87..a8def036 100644 --- a/gui/app/styles/core/view/document/all.scss +++ b/gui/app/styles/core/view/document/all.scss @@ -7,6 +7,6 @@ @import "sidebar-toc.scss"; @import "sidebar-attachment.scss"; @import "view-activity.scss"; -@import "view-revision.scss"; -@import "vote-likes.scss"; +@import "revisions.scss"; +@import "likes.scss"; @import "wysiwyg.scss"; diff --git a/gui/app/styles/core/view/document/likes.scss b/gui/app/styles/core/view/document/likes.scss new file mode 100644 index 00000000..36bcea67 --- /dev/null +++ b/gui/app/styles/core/view/document/likes.scss @@ -0,0 +1,29 @@ +.vote-box { + margin: 50px 0; + // max-width: 400px; + display: flex; + flex-direction: column; + align-items: center; + align-content: center; + justify-content: center; + + > .prompt { + text-align: center; + font-size: 1.5rem; + font-weight: 500; + color: map-get($yellow-shades, 700); + } + + > .buttons { + text-align: center; + } + + > .thanks { + font-size: 1.2rem; + font-weight: 500; + color: map-get($yellow-shades, 600); + } +} + + + diff --git a/gui/app/styles/core/view/document/revisions.scss b/gui/app/styles/core/view/document/revisions.scss new file mode 100644 index 00000000..614d1ff1 --- /dev/null +++ b/gui/app/styles/core/view/document/revisions.scss @@ -0,0 +1,11 @@ +.view-revision { + > h1 { + color: map-get($yellow-shades, 800); + } + + > h2 { + color: map-get($yellow-shades, 700); + font-size: 1.2rem; + font-weight: 400; + } +} diff --git a/gui/app/styles/core/view/document/section.scss b/gui/app/styles/core/view/document/section.scss index 1ff1ae0b..9c76882f 100644 --- a/gui/app/styles/core/view/document/section.scss +++ b/gui/app/styles/core/view/document/section.scss @@ -51,12 +51,10 @@ } .start-section { - @include border-radius(5px); @extend .no-select; text-align: right; margin: 1.5rem 0; display: block; - cursor: pointer; > i { background-color: map-get($yellow-shades, 100); @@ -65,6 +63,8 @@ padding: 0.5rem; font-size: 16px; @extend %toolbar-shadow; + @include border-radius(5px); + cursor: pointer; &:hover { color: map-get($yellow-shades, 700); diff --git a/gui/app/styles/core/view/document/view-revision.scss b/gui/app/styles/core/view/document/view-revision.scss deleted file mode 100644 index a3533486..00000000 --- a/gui/app/styles/core/view/document/view-revision.scss +++ /dev/null @@ -1,16 +0,0 @@ -.view-revision { - > .diff-zone { - @extend .transition-all; - @include border-radius(2px); - @include ease-in(); - position: relative; - padding: 25px 50px; - box-shadow: 0 0 0 0.75pt map-get($gray-shades, 200),0 0 3pt 0.75pt map-get($gray-shades, 200); - background-color: $color-white; - margin: 50px 0; - - > .canvas { - padding: 0; - } - } -} diff --git a/gui/app/styles/core/view/document/vote-likes.scss b/gui/app/styles/core/view/document/vote-likes.scss deleted file mode 100644 index edbe3f3b..00000000 --- a/gui/app/styles/core/view/document/vote-likes.scss +++ /dev/null @@ -1,25 +0,0 @@ -.vote-box { - margin: 50px 0; - padding: 30px 50px; - text-align: center; - max-width: 400px; - border: 1px dotted map-get($gray-shades, 300); - background: map-get($gray-shades, 100); - @include border-radius(3px); - - > .prompt { - font-size: 1.5rem; - font-weight: 600; - color: map-get($gray-shades, 800); - } - - > .buttons { - margin: 20px 0 0 0; - } - - > .ack { - font-size: 1.2rem; - font-weight: 600; - color: map-get($green-shades, 600); - } -} diff --git a/gui/app/templates/components/document/document-toolbar.hbs b/gui/app/templates/components/document/document-toolbar.hbs index cc593221..0eda1f4e 100644 --- a/gui/app/templates/components/document/document-toolbar.hbs +++ b/gui/app/templates/components/document/document-toolbar.hbs @@ -1,11 +1,5 @@
{{#ui/ui-toolbar dark=false light=true raised=true large=true bordered=true}} - {{ui/ui-toolbar-icon icon=constants.Icon.Print color=constants.Color.Gray - tooltip="Print" onClick=(action "onPrintDocument")}} - - {{ui/ui-toolbar-icon icon=constants.Icon.Download color=constants.Color.Gray - tooltip="Export as complete HTML file" onClick=(action "onExport")}} - {{#if pinState.isPinned}} {{ui/ui-toolbar-icon icon=constants.Icon.BookmarkDelete color=constants.Color.Yellow tooltip="Remove from bookmarks" onClick=(action "onUnpin")}} @@ -19,6 +13,17 @@ tooltip="Save as template" onClick=(action "onShowTemplateModal")}} {{/if}} + {{#if showRevisions}} + {{ui/ui-toolbar-icon icon=constants.Icon.TimeBack color=constants.Color.Gray + tooltip="Revisions and rollback" linkTo="document.revisions"}} + {{/if}} + + {{ui/ui-toolbar-icon icon=constants.Icon.Download color=constants.Color.Gray + tooltip="Download as HTML file" onClick=(action "onExport")}} + + {{ui/ui-toolbar-icon icon=constants.Icon.Print color=constants.Color.Gray + tooltip="Print" onClick=(action "onPrintDocument")}} + {{#if permissions.documentDelete}} {{ui/ui-toolbar-icon icon=constants.Icon.Delete color=constants.Color.Gray tooltip="Delete" onClick=(action "onShowDeleteModal")}} @@ -50,8 +55,8 @@
- - + {{ui/ui-button color=constants.Color.Gray light=true label=constants.Label.Cancel dismiss=true}} + {{ui/ui-button color=constants.Color.Green light=true label=constants.Label.Delete onClick=(action "onSaveTemplate")}}
@@ -65,8 +70,8 @@

Are you sure you want to delete this document?

- - + {{ui/ui-button color=constants.Color.Gray light=true label=constants.Label.Cancel dismiss=true}} + {{ui/ui-button color=constants.Color.Red light=true label=constants.Label.Delete onClick=(action "onDocumentDelete")}}
diff --git a/gui/app/templates/components/document/view-content.hbs b/gui/app/templates/components/document/view-content.hbs index de844cf4..efe70c33 100644 --- a/gui/app/templates/components/document/view-content.hbs +++ b/gui/app/templates/components/document/view-content.hbs @@ -39,23 +39,21 @@ {{/if}} {{#if showLikes}} -
-
- {{#unless voteThanks}} -
- {{folder.likes}} -
+
+ {{#if voteThanks}} +
Thanks for the feedback!
+ {{else}} +
{{folder.likes}}
+ {{ui/ui-spacer size=200}}
-    - + {{ui/ui-button color=constants.Color.Yellow light=true label="Yes, thanks!" onClick=(action "onVote" 1)}} + {{ui/ui-button-gap}} + {{ui/ui-button color=constants.Color.Yellow light=true label="Not really" onClick=(action "onVote" 2)}}
- {{else}} -
Thanks for the feedback!
- {{/unless}} -
+ {{/if}}
{{/if}} -{{else }} +{{else}} {{#if canEdit}}
diff --git a/gui/app/templates/components/document/view-revision.hbs b/gui/app/templates/components/document/view-revision.hbs index 9457210b..a90e9842 100644 --- a/gui/app/templates/components/document/view-revision.hbs +++ b/gui/app/templates/components/document/view-revision.hbs @@ -1,37 +1,23 @@ -
- {{#unless hasRevisions}} -

No revisions made

- {{else}} -
-
-
- {{ui/ui-select tagName="span" class="revision-picker" content=revisions action=(action "onSelectRevision") optionValuePath="id" optionLabelPath="label"}} -
-
+{{#unless revisions}} +

No revisions made

+{{/unless}} + +
+ {{#if hasDiff}} +

{{revision.title}}

+

Changed by {{revision.firstname}} {{revision.lastname}}

+ {{ui/ui-spacer size=200}} +
+ {{{diff}}}
-
-
-
- {{#if hasDiff}} -
- {{{diff}}} -
- {{/if}} -
-
-
- {{#if canRollback}} -
-
-
-
Restore to this version
-
-
-
- {{/if}} - {{/unless}} + {{/if}}
+{{#if canRollback}} + {{ui/ui-spacer size=400}} + {{ui/ui-button color=constants.Color.Red icon=constants.Icon.TimeBack light=true label=constants.Label.Restore onClick=(action "onShowModal")}} +{{/if}} + diff --git a/gui/app/templates/components/folder/space-toolbar.hbs b/gui/app/templates/components/folder/space-toolbar.hbs index 7819750e..8843ee50 100644 --- a/gui/app/templates/components/folder/space-toolbar.hbs +++ b/gui/app/templates/components/folder/space-toolbar.hbs @@ -45,8 +45,8 @@
- - + {{ui/ui-button color=constants.Color.Gray light=true label=constants.Label.Cancel dismiss=true}} + {{ui/ui-button color=constants.Color.Green light=true label=constants.Label.Add onClick=(action "onAddEmptyDoc")}}
@@ -78,8 +78,8 @@
- - + {{ui/ui-button color=constants.Color.Gray light=true label=constants.Label.Cancel dismiss=true}} + {{ui/ui-button color=constants.Color.Green light=true label=constants.Label.Add onClick=(action "onAddTemplateDoc")}}
@@ -105,7 +105,7 @@
- + {{ui/ui-button color=constants.Color.Gray light=true label=constants.Label.Cancel dismiss=true}}
@@ -127,8 +127,8 @@ {{/if}}
- - + {{ui/ui-button color=constants.Color.Gray light=true label=constants.Label.Cancel dismiss=true}} + {{ui/ui-button color=constants.Color.Green light=true label=constants.Label.Export onClick=(action "onExport")}}