Docker/documize
Docker/documize
1
0
Fork 0
mirror of https://github.com/documize/community.git synced 2025-07-20 05:39:42 +02:00
Code Releases Activity

improved TOC/page jumps

Browse source
This commit is contained in:
Harvey Kandola 2017-12-14 16:48:12 +00:00
parent 215f644d11
commit 6f1b0564e2
5 changed files with 105 additions and 90 deletions
Download patch file Download diff file Expand all files Collapse all files

33
gui/app/components/document/document-toc.js
View file

@ -10,16 +10,18 @@
// https://documize.com // https://documize.com
import { computed } from '@ember/object'; import { computed } from '@ember/object';
import { schedule } from '@ember/runloop'; import { schedule } from '@ember/runloop'
import { inject as service } from '@ember/service';
import Component from '@ember/component'; import Component from '@ember/component';
import tocUtil from '../../utils/toc'; import tocUtil from '../../utils/toc';
import NotifierMixin from '../../mixins/notifier'; import NotifierMixin from '../../mixins/notifier';
export default Component.extend(NotifierMixin, { export default Component.extend(NotifierMixin, {
documentService: service('document'),
document: {}, document: {},
folder: {}, folder: {},
pages: [], pages: [],
currentPageId: "", currentPageId: '',
state: { state: {
actionablePage: false, actionablePage: false,
upDisabled: true, upDisabled: true,
@ -40,6 +42,8 @@ export default Component.extend(NotifierMixin, {
if (is.not.null(this.get('currentPageId'))) { if (is.not.null(this.get('currentPageId'))) {
this.send('onEntryClick', this.get('currentPageId')); this.send('onEntryClick', this.get('currentPageId'));
} }
this.setState(this.get('currentPageId'));
}, },
didInsertElement() { didInsertElement() {
@ -49,11 +53,6 @@ export default Component.extend(NotifierMixin, {
this.eventBus.subscribe('documentPageAdded', this, 'onDocumentPageAdded'); this.eventBus.subscribe('documentPageAdded', this, 'onDocumentPageAdded');
this.eventBus.subscribe('resized', this, 'onResize'); this.eventBus.subscribe('resized', this, 'onResize');
schedule('afterRender', () => {
// let dg = $('#doc-toc').draggabilly({});
// this.set('dg', dg);
});
}, },
willDestroyElement() { willDestroyElement() {
@ -190,9 +189,6 @@ export default Component.extend(NotifierMixin, {
if (pendingChanges.length > 0) { if (pendingChanges.length > 0) {
this.attrs.onPageSequenceChange(pendingChanges); this.attrs.onPageSequenceChange(pendingChanges);
this.send('onEntryClick', this.get('currentPageId'));
this.showNotification("Moved up");
} }
}, },
@ -209,9 +205,6 @@ export default Component.extend(NotifierMixin, {
if (pendingChanges.length > 0) { if (pendingChanges.length > 0) {
this.attrs.onPageSequenceChange(pendingChanges); this.attrs.onPageSequenceChange(pendingChanges);
this.send('onEntryClick', this.get('currentPageId'));
this.showNotification("Moved down");
} }
}, },
@ -228,9 +221,6 @@ export default Component.extend(NotifierMixin, {
if (pendingChanges.length > 0) { if (pendingChanges.length > 0) {
this.attrs.onPageLevelChange(pendingChanges); this.attrs.onPageLevelChange(pendingChanges);
this.showNotification("Indent");
this.send('onEntryClick', this.get('currentPageId'));
} }
}, },
@ -247,15 +237,18 @@ export default Component.extend(NotifierMixin, {
if (pendingChanges.length > 0) { if (pendingChanges.length > 0) {
this.attrs.onPageLevelChange(pendingChanges); this.attrs.onPageLevelChange(pendingChanges);
this.showNotification("Outdent");
this.send('onEntryClick', this.get('currentPageId'));
} }
}, },
onEntryClick(id) { onEntryClick(id) {
if (id !== '') {
let jumpTo = "#page-" + id;
if (!$(jumpTo).inView()) {
$(jumpTo).velocity("scroll", { duration: 250, offset: -100 });
}
this.setState(id); this.setState(id);
this.attrs.onGotoPage(id); }
} }
} }
}); });

15
gui/app/components/document/view-content.js
View file

@ -32,12 +32,12 @@ export default Component.extend(NotifierMixin, TooltipMixin, {
this._super(...arguments); this._super(...arguments);
this.loadBlocks(); this.loadBlocks();
schedule('afterRender', () => { // schedule('afterRender', () => {
let jumpTo = "#page-" + this.get('pageId'); // let jumpTo = "#page-" + this.get('pageId');
if (!$(jumpTo).inView()) { // if (!$(jumpTo).inView()) {
$(jumpTo).velocity("scroll", { duration: 250, offset: -100 }); // $(jumpTo).velocity("scroll", { duration: 250, offset: -100 });
} // }
}); // });
}, },
didRender() { didRender() {
@ -49,6 +49,9 @@ export default Component.extend(NotifierMixin, TooltipMixin, {
this._super(...arguments); this._super(...arguments);
this.setupAddWizard(); this.setupAddWizard();
console.log(this.get('pageId'));
this.attrs.onGotoPage(this.get('pageId'));
this.renderTooltips(); this.renderTooltips();
}, },

111
gui/app/pods/document/index/controller.js
View file

@ -19,9 +19,6 @@ export default Controller.extend(TooltipMixin, {
templateService: service('template'), templateService: service('template'),
sectionService: service('section'), sectionService: service('section'),
linkService: service('link'), linkService: service('link'),
folder: {},
pages: [],
toggled: false,
queryParams: ['pageId', 'tab'], queryParams: ['pageId', 'tab'],
pageId: '', pageId: '',
tab: 'content', tab: 'content',
@ -39,7 +36,7 @@ export default Controller.extend(TooltipMixin, {
}, },
onCopyPage(pageId, targetDocumentId) { onCopyPage(pageId, targetDocumentId) {
let documentId = this.get('model.document.id'); let documentId = this.get('document.id');
this.get('documentService').copyPage(documentId, pageId, targetDocumentId).then(() => { this.get('documentService').copyPage(documentId, pageId, targetDocumentId).then(() => {
// refresh data if copied to same document // refresh data if copied to same document
@ -47,15 +44,15 @@ export default Controller.extend(TooltipMixin, {
this.set('pageId', ''); this.set('pageId', '');
this.get('target._routerMicrolib').refresh(); this.get('target._routerMicrolib').refresh();
this.get('linkService').getDocumentLinks(this.get('model.document.id')).then((links) => { this.get('linkService').getDocumentLinks(this.get('document.id')).then((links) => {
this.set('model.links', links); this.set('links', links);
}); });
} }
}); });
}, },
onMovePage(pageId, targetDocumentId) { onMovePage(pageId, targetDocumentId) {
let documentId = this.get('model.document.id'); let documentId = this.get('document.id');
this.get('documentService').copyPage(documentId, pageId, targetDocumentId).then(() => { this.get('documentService').copyPage(documentId, pageId, targetDocumentId).then(() => {
this.send('onPageDeleted', { id: pageId, children: false }); this.send('onPageDeleted', { id: pageId, children: false });
@ -63,7 +60,7 @@ export default Controller.extend(TooltipMixin, {
}, },
onSavePage(page, meta) { onSavePage(page, meta) {
let documentId = this.get('model.document.id'); let documentId = this.get('document.id');
let model = { let model = {
page: page.toJSON({ includeId: true }), page: page.toJSON({ includeId: true }),
meta: meta.toJSON({ includeId: true }) meta: meta.toJSON({ includeId: true })
@ -72,15 +69,15 @@ export default Controller.extend(TooltipMixin, {
this.get('documentService').updatePage(documentId, page.get('id'), model).then((up) => { this.get('documentService').updatePage(documentId, page.get('id'), model).then((up) => {
page = up; page = up;
this.set('pageId', page.get('id')); this.set('pageId', page.get('id'));
this.get('linkService').getDocumentLinks(this.get('model.document.id')).then((links) => { this.get('linkService').getDocumentLinks(this.get('document.id')).then((links) => {
this.set('model.links', links); this.set('links', links);
}); });
}); });
}, },
onPageDeleted(deletePage) { onPageDeleted(deletePage) {
let documentId = this.get('model.document.id'); let documentId = this.get('document.id');
let pages = this.get('model.pages'); let pages = this.get('pages');
let deleteId = deletePage.id; let deleteId = deletePage.id;
let deleteChildren = deletePage.children; let deleteChildren = deletePage.children;
let page = _.findWhere(pages, { let page = _.findWhere(pages, {
@ -113,18 +110,18 @@ export default Controller.extend(TooltipMixin, {
// update our models so we don't have to reload from db // update our models so we don't have to reload from db
for (var i = 0; i < pendingChanges.length; i++) { for (var i = 0; i < pendingChanges.length; i++) {
let pageId = pendingChanges[i].pageId; let pageId = pendingChanges[i].pageId;
this.set('model.pages', _.reject(pages, function (p) { //jshint ignore: line this.set('pages', _.reject(pages, function (p) { //jshint ignore: line
return p.get('id') === pageId; return p.get('id') === pageId;
})); }));
} }
this.set('model.pages', _.sortBy(pages, "sequence")); this.set('pages', _.sortBy(pages, "sequence"));
this.get('target._routerMicrolib').refresh(); this.get('target._routerMicrolib').refresh();
}); });
} else { } else {
// page delete followed by re-leveling child pages // page delete followed by re-leveling child pages
this.get('documentService').deletePage(documentId, deleteId).then(() => { this.get('documentService').deletePage(documentId, deleteId).then(() => {
this.set('model.pages', _.reject(pages, function (p) { this.set('pages', _.reject(pages, function (p) {
return p.get('id') === deleteId; return p.get('id') === deleteId;
})); }));
@ -135,20 +132,20 @@ export default Controller.extend(TooltipMixin, {
onInsertSection(data) { onInsertSection(data) {
return new EmberPromise((resolve) => { return new EmberPromise((resolve) => {
this.get('documentService').addPage(this.get('model.document.id'), data).then((newPage) => { this.get('documentService').addPage(this.get('document.id'), data).then((newPage) => {
let data = this.get('store').normalize('page', newPage); let data = this.get('store').normalize('page', newPage);
this.get('store').push(data); this.get('store').push(data);
this.set('pageId', newPage.id); this.set('pageId', newPage.id);
this.get('documentService').getPages(this.get('model.document.id')).then((pages) => { this.get('documentService').getPages(this.get('document.id')).then((pages) => {
this.set('model.pages', pages); this.set('pages', pages);
if (newPage.pageType === 'tab') { if (newPage.pageType === 'tab') {
this.transitionToRoute('document.section', this.transitionToRoute('document.section',
this.get('model.folder.id'), this.get('folder.id'),
this.get('model.folder.slug'), this.get('folder.slug'),
this.get('model.document.id'), this.get('document.id'),
this.get('model.document.slug'), this.get('document.slug'),
newPage.id); newPage.id);
} else { } else {
resolve(newPage.id); resolve(newPage.id);
@ -175,66 +172,78 @@ export default Controller.extend(TooltipMixin, {
}, },
onDocumentDelete() { onDocumentDelete() {
this.get('documentService').deleteDocument(this.get('model.document.id')).then(() => { this.get('documentService').deleteDocument(this.get('document.id')).then(() => {
this.transitionToRoute('folder', this.get('model.folder.id'), this.get('model.folder.slug')); this.transitionToRoute('folder', this.get('folder.id'), this.get('folder.slug'));
}); });
}, },
onSaveTemplate(name, desc) { onSaveTemplate(name, desc) {
this.get('templateService').saveAsTemplate(this.get('model.document.id'), name, desc).then(function () {}); this.get('templateService').saveAsTemplate(this.get('document.id'), name, desc).then(function () {});
}, },
onPageSequenceChange(changes) { onPageSequenceChange(changes) {
this.get('documentService').changePageSequence(this.get('model.document.id'), changes).then(() => { this.get('documentService').changePageSequence(this.get('document.id'), changes).then(() => {
_.each(changes, (change) => { this.get('documentService').getPages(this.get('document.id')).then( (pages) => {
let pageContent = _.findWhere(this.get('model.pages'), { this.set('pages', pages);
id: change.pageId
}); });
// _.each(changes, (change) => {
// let pageContent = _.findWhere(this.get('pages'), {
// id: change.pageId
// });
if (is.not.undefined(pageContent)) { // if (is.not.undefined(pageContent)) {
pageContent.set('sequence', change.sequence); // pageContent.set('sequence', change.sequence);
} // }
}); // });
this.set('model.pages', this.get('model.pages').sortBy('sequence')); // this.set('pages', this.get('pages').sortBy('sequence'));
this.get('target._routerMicrolib').refresh(); // this.get('target._routerMicrolib').refresh();
}); });
}, },
onPageLevelChange(changes) { onPageLevelChange(changes) {
this.get('documentService').changePageLevel(this.get('model.document.id'), changes).then(() => { this.get('documentService').changePageLevel(this.get('document.id'), changes).then(() => {
_.each(changes, (change) => { this.get('documentService').getPages(this.get('document.id')).then( (pages) => {
let pageContent = _.findWhere(this.get('model.pages'), { this.set('pages', pages);
id: change.pageId
}); });
// _.each(changes, (change) => {
// let pageContent = _.findWhere(this.get('pages'), {
// id: change.pageId
// });
if (is.not.undefined(pageContent)) { // if (is.not.undefined(pageContent)) {
pageContent.set('level', change.level); // pageContent.set('level', change.level);
} // }
}); // });
let pages = this.get('model.pages'); // let pages = this.get('pages');
pages = pages.sortBy('sequence'); // pages = pages.sortBy('sequence');
this.set('model.pages', []);
this.set('model.pages', pages); // this.set('pages', []);
this.get('target._routerMicrolib').refresh(); // this.set('pages', pages);
// this.get('target._routerMicrolib').refresh();
}); });
}, },
onGotoPage(id) { onGotoPage(id) {
if (this.get('pageId') !== id && id !== '') { if (id !== '') {
this.set('pageId', id); this.set('pageId', id);
let jumpTo = "#page-" + id;
if (!$(jumpTo).inView()) {
$(jumpTo).velocity("scroll", { duration: 250, offset: -100 });
}
} }
}, },
onTagChange(tags) { onTagChange(tags) {
let doc = this.get('model.document'); let doc = this.get('document');
doc.set('tags', tags); doc.set('tags', tags);
this.get('documentService').save(doc); this.get('documentService').save(doc);
}, },
onRollback(pageId, revisionId) { onRollback(pageId, revisionId) {
this.get('documentService').rollbackPage(this.get('model.document.id'), pageId, revisionId).then(() => { this.get('documentService').rollbackPage(this.get('document.id'), pageId, revisionId).then(() => {
this.set('tab', 'content'); this.set('tab', 'content');
this.get('target._routerMicrolib').refresh(); this.get('target._routerMicrolib').refresh();
}); });

10
gui/app/pods/document/index/route.js
View file

@ -34,5 +34,15 @@ export default Route.extend(AuthenticatedRouteMixin, {
sections: this.modelFor('document').sections, sections: this.modelFor('document').sections,
permissions: this.modelFor('document').permissions permissions: this.modelFor('document').permissions
}); });
},
setupController(controller, model) {
controller.set('folders', model.folders);
controller.set('folder', model.folder);
controller.set('document', model.document);
controller.set('pages', model.pages);
controller.set('links', model.links);
controller.set('sections', model.sections);
controller.set('permissions', model.permissions);
} }
}); });

18
gui/app/pods/document/index/template.hbs
View file

@ -4,23 +4,23 @@
<div class="row"> <div class="row">
<div class="col-12 mb-5"> <div class="col-12 mb-5">
{{toolbar/for-document document=model.document spaces=model.folders space=model.folder permissions=model.permissions {{toolbar/for-document document=document spaces=folders space=folder permissions=permissions
onDocumentDelete=(action 'onDocumentDelete') onSaveTemplate=(action 'onSaveTemplate')}} onDocumentDelete=(action 'onDocumentDelete') onSaveTemplate=(action 'onSaveTemplate')}}
</div> </div>
</div> </div>
<div class="row"> <div class="row">
<div class="col-12"> <div class="col-12">
{{document/document-heading document=model.document permissions=model.permissions {{document/document-heading document=document permissions=permissions
onSaveDocument=(action 'onSaveDocument')}} onSaveDocument=(action 'onSaveDocument')}}
{{document/document-meta document=model.document folder=model.folder folders=model.folders permissions=model.permissions {{document/document-meta document=document folder=folder folders=folders permissions=permissions
onSaveDocument=(action 'onSaveDocument')}} onSaveDocument=(action 'onSaveDocument')}}
</div> </div>
</div> </div>
<div class="row"> <div class="row">
<div class="col-12"> <div class="col-12">
{{document/document-toc document=model.document folder=model.folder pages=model.pages page=model.page permissions=model.permissions {{document/document-toc document=document folder=folder pages=pages page=page permissions=permissions currentPageId=pageId
onPageSequenceChange=(action 'onPageSequenceChange') onPageLevelChange=(action 'onPageLevelChange') onGotoPage=(action 'onGotoPage')}} onPageSequenceChange=(action 'onPageSequenceChange') onPageLevelChange=(action 'onPageLevelChange') onGotoPage=(action 'onGotoPage')}}
</div> </div>
</div> </div>
@ -38,23 +38,23 @@
{{#if (eq tab 'content')}} {{#if (eq tab 'content')}}
{{document/view-content {{document/view-content
document=model.document links=model.links pages=model.pages document=document links=links pages=pages
folder=model.folder folders=model.folders sections=model.sections permissions=model.permissions pageId=pageId folder=folder folders=folders sections=sections permissions=permissions pageId=pageId
onSavePage=(action 'onSavePage') onInsertSection=(action 'onInsertSection') onSavePage=(action 'onSavePage') onInsertSection=(action 'onInsertSection')
onSavePageAsBlock=(action 'onSavePageAsBlock') onDeleteBlock=(action 'onDeleteBlock') onGotoPage=(action 'onGotoPage') onSavePageAsBlock=(action 'onSavePageAsBlock') onDeleteBlock=(action 'onDeleteBlock') onGotoPage=(action 'onGotoPage')
onCopyPage=(action 'onCopyPage') onMovePage=(action 'onMovePage') onDeletePage=(action 'onPageDeleted')}} onCopyPage=(action 'onCopyPage') onMovePage=(action 'onMovePage') onDeletePage=(action 'onPageDeleted')}}
{{/if}} {{/if}}
{{#if (eq tab 'attachment')}} {{#if (eq tab 'attachment')}}
{{document/view-attachment document=model.document permissions=model.permissions}} {{document/view-attachment document=document permissions=permissions}}
{{/if}} {{/if}}
{{#if (eq tab 'activity')}} {{#if (eq tab 'activity')}}
{{document/view-activity document=model.document pages=model.pages permissions=model.permissions}} {{document/view-activity document=document pages=pages permissions=permissions}}
{{/if}} {{/if}}
{{#if (eq tab 'revision')}} {{#if (eq tab 'revision')}}
{{document/view-revision document=model.document folder=model.folder pages=model.pages onRollback=(action 'onRollback')}} {{document/view-revision document=document folder=folder pages=pages onRollback=(action 'onRollback')}}
{{/if}} {{/if}}
</div> </div>
</div> </div>