mirror of
https://github.com/documize/community.git
synced 2025-07-24 15:49:44 +02:00
WIP new document UX/UI
This commit is contained in:
Harvey Kandola
parent
21ba55a58f
commit
36be6243ad
23 changed files with 910 additions and 4231 deletions
|
|
@ -11,16 +11,18 @@
|
|||
|
||||
import { Promise as EmberPromise } from 'rsvp';
|
||||
import { inject as service } from '@ember/service';
|
||||
import Tooltips from '../../../mixins/tooltip';
|
||||
import Notifier from '../../../mixins/notifier';
|
||||
import Controller from '@ember/controller';
|
||||
import TooltipMixin from '../../../mixins/tooltip';
|
||||
|
||||
export default Controller.extend(TooltipMixin, {
|
||||
export default Controller.extend(Tooltips, Notifier, {
|
||||
documentService: service('document'),
|
||||
templateService: service('template'),
|
||||
sectionService: service('section'),
|
||||
linkService: service('link'),
|
||||
// currentPageId: '',
|
||||
tab: 'content',
|
||||
tabCount: 0, // how many items inside the tab?
|
||||
queryParams: ['currentPageId'],
|
||||
|
||||
actions: {
|
||||
|
|
@ -28,16 +30,19 @@ export default Controller.extend(TooltipMixin, {
|
|||
this.set('tab', tab);
|
||||
if (tab === 'content') {
|
||||
this.send('refresh');
|
||||
}
|
||||
}
|
||||
},
|
||||
|
||||
onShowPage(pageId) {
|
||||
this.set('tab', 'content');
|
||||
this.get('browser').scrollTo(`#page-${pageId}`);
|
||||
this.get('browser').scrollTo(`#page-${pageId}`);
|
||||
},
|
||||
|
||||
onSaveDocument(doc) {
|
||||
this.get('documentService').save(doc);
|
||||
this.showWait();
|
||||
this.get('documentService').save(doc).then(() => {
|
||||
this.showDone();
|
||||
});
|
||||
this.get('browser').setTitle(doc.get('name'));
|
||||
this.get('browser').setMetaDescription(doc.get('excerpt'));
|
||||
},
|
||||
|
|
@ -67,11 +72,13 @@ export default Controller.extend(TooltipMixin, {
|
|||
},
|
||||
|
||||
onSavePage(page, meta) {
|
||||
this.showWait();
|
||||
|
||||
let document = this.get('document');
|
||||
let documentId = document.get('id');
|
||||
let constants = this.get('constants');
|
||||
|
||||
// if document approval mode is locked return
|
||||
// if document approval mode is locked return
|
||||
if (document.get('protection') == constants.ProtectionType.Lock) {
|
||||
// should not really happen
|
||||
return;
|
||||
|
|
@ -84,6 +91,8 @@ export default Controller.extend(TooltipMixin, {
|
|||
};
|
||||
|
||||
this.get('documentService').updatePage(documentId, page.get('id'), model).then((/*up*/) => {
|
||||
this.showDone();
|
||||
|
||||
this.get('documentService').fetchPages(documentId, this.get('session.user.id')).then((pages) => {
|
||||
this.set('pages', pages);
|
||||
this.get('linkService').getDocumentLinks(documentId).then((links) => {
|
||||
|
|
@ -98,7 +107,7 @@ export default Controller.extend(TooltipMixin, {
|
|||
let deleteId = deletePage.id;
|
||||
let deleteChildren = deletePage.children;
|
||||
let pendingChanges = [];
|
||||
|
||||
|
||||
let pages = this.get('pages');
|
||||
let pageIndex = _.findIndex(pages, function(i) { return i.get('page.id') === deleteId; });
|
||||
let item = pages[pageIndex];
|
||||
|
|
@ -118,7 +127,7 @@ export default Controller.extend(TooltipMixin, {
|
|||
|
||||
this.get('documentService').deletePages(documentId, deleteId, pendingChanges).then(() => {
|
||||
this.get('documentService').fetchPages(this.get('document.id'), this.get('session.user.id')).then((pages) => {
|
||||
this.set('pages', pages);
|
||||
this.set('pages', pages);
|
||||
});
|
||||
});
|
||||
} else {
|
||||
|
|
@ -131,10 +140,13 @@ export default Controller.extend(TooltipMixin, {
|
|||
},
|
||||
|
||||
onInsertSection(data) {
|
||||
this.showWait();
|
||||
|
||||
return new EmberPromise((resolve) => {
|
||||
this.get('documentService').addPage(this.get('document.id'), data).then((newPage) => {
|
||||
let data = this.get('store').normalize('page', newPage);
|
||||
this.get('store').push(data);
|
||||
this.showDone();
|
||||
|
||||
this.get('documentService').fetchPages(this.get('document.id'), this.get('session.user.id')).then((pages) => {
|
||||
this.set('pages', pages);
|
||||
|
|
@ -179,14 +191,18 @@ export default Controller.extend(TooltipMixin, {
|
|||
},
|
||||
|
||||
onSaveTemplate(name, desc) {
|
||||
this.get('templateService').saveAsTemplate(this.get('document.id'), name, desc).then(function () {});
|
||||
this.showWait();
|
||||
|
||||
this.get('templateService').saveAsTemplate(this.get('document.id'), name, desc).then(function () {
|
||||
this.showDone();
|
||||
});
|
||||
},
|
||||
|
||||
onPageSequenceChange(currentPageId, changes) {
|
||||
this.set('currentPageId', currentPageId);
|
||||
this.get('documentService').changePageSequence(this.get('document.id'), changes).then(() => {
|
||||
this.get('documentService').fetchPages(this.get('document.id'), this.get('session.user.id')).then( (pages) => {
|
||||
this.set('pages', pages);
|
||||
this.set('pages', pages);
|
||||
});
|
||||
});
|
||||
},
|
||||
|
|
@ -195,15 +211,19 @@ export default Controller.extend(TooltipMixin, {
|
|||
this.set('currentPageId', currentPageId);
|
||||
this.get('documentService').changePageLevel(this.get('document.id'), changes).then(() => {
|
||||
this.get('documentService').fetchPages(this.get('document.id'), this.get('session.user.id')).then( (pages) => {
|
||||
this.set('pages', pages);
|
||||
this.set('pages', pages);
|
||||
});
|
||||
});
|
||||
},
|
||||
|
||||
onTagChange(tags) {
|
||||
this.showDone();
|
||||
|
||||
let doc = this.get('document');
|
||||
doc.set('tags', tags);
|
||||
this.get('documentService').save(doc);
|
||||
this.get('documentService').save(doc).then(()=> {
|
||||
this.showWait();
|
||||
});
|
||||
},
|
||||
|
||||
onRollback(pageId, revisionId) {
|
||||
|
|
@ -225,6 +245,10 @@ export default Controller.extend(TooltipMixin, {
|
|||
resolve();
|
||||
});
|
||||
});
|
||||
},
|
||||
|
||||
onReady(count) {
|
||||
this.set('tabCount', count);
|
||||
}
|
||||
}
|
||||
});
|
||||
|
|
|
|||
|
|
@ -1,58 +1,93 @@
|
|||
{{toolbar/nav-bar}}
|
||||
{{#layout/top-bar}}
|
||||
<li class="item">
|
||||
{{#link-to "folder.index" folder.id folder.slug class='link'}}
|
||||
{{folder.name}}
|
||||
{{/link-to}}
|
||||
</li>
|
||||
<li class="item">
|
||||
{{#link-to 'document.index' folder.id folder.slug document.id document.slug class="link selected"}}
|
||||
{{document.name}}
|
||||
{{/link-to}}
|
||||
</li>
|
||||
{{/layout/top-bar}}
|
||||
|
||||
{{toolbar/for-document document=document spaces=folders space=folder
|
||||
permissions=permissions roles=roles tab=tab versions=versions
|
||||
onDocumentDelete=(action 'onDocumentDelete')
|
||||
onSaveTemplate=(action 'onSaveTemplate')
|
||||
onSaveDocument=(action 'onSaveDocument')
|
||||
refresh=(action 'refresh')}}
|
||||
{{#layout/middle-zone}}
|
||||
{{#layout/middle-zone-content}}
|
||||
|
||||
<div id="doc-view" class="container">
|
||||
<div class="row">
|
||||
<div class="col-12">
|
||||
{{document/document-heading document=document permissions=permissions
|
||||
versions=versions
|
||||
onSaveDocument=(action 'onSaveDocument')}}
|
||||
{{document/document-meta document=document folder=folder folders=folders
|
||||
permissions=permissions pages=pages versions=versions
|
||||
onSaveDocument=(action 'onSaveDocument')}}
|
||||
{{toolbar/for-document
|
||||
document=document
|
||||
spaces=folders
|
||||
space=folder
|
||||
permissions=permissions
|
||||
roles=roles
|
||||
tab=tab
|
||||
versions=versions
|
||||
onDocumentDelete=(action 'onDocumentDelete')
|
||||
onSaveTemplate=(action 'onSaveTemplate')
|
||||
onSaveDocument=(action 'onSaveDocument')
|
||||
refresh=(action 'refresh')}}
|
||||
|
||||
{{document/document-heading
|
||||
document=document
|
||||
permissions=permissions
|
||||
versions=versions
|
||||
onSaveDocument=(action 'onSaveDocument')}}
|
||||
|
||||
{{document/document-meta
|
||||
document=document
|
||||
folder=folder
|
||||
folders=folders
|
||||
permissions=permissions
|
||||
pages=pages
|
||||
versions=versions
|
||||
onSaveDocument=(action 'onSaveDocument')}}
|
||||
|
||||
<div class="text-center non-printable document-tabnav">
|
||||
<ul class="tabnav-control">
|
||||
<li class="tab {{if (eq tab 'content') 'selected'}}" {{action 'onTabChange' 'content'}}>Content</li>
|
||||
<li class="tab {{if (eq tab 'attachment') 'selected'}}" {{action 'onTabChange' 'attachment'}}>
|
||||
Attachments
|
||||
({{tabCount}})
|
||||
</li>
|
||||
{{#if session.authenticated}}
|
||||
<li class="tab {{if (eq tab 'revision') 'selected'}}" {{action 'onTabChange' 'revision'}}>Revisions</li>
|
||||
{{/if}}
|
||||
</ul>
|
||||
</div>
|
||||
</div>
|
||||
<div class="row">
|
||||
<div class="col-12">
|
||||
{{document/document-toc document=document folder=folder pages=pages page=page
|
||||
permissions=permissions roles=roles tab=tab currentPageId=currentPageId onShowPage=(action 'onShowPage')
|
||||
onPageSequenceChange=(action 'onPageSequenceChange') onPageLevelChange=(action 'onPageLevelChange')}}
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="row no-gutters mb-5">
|
||||
<div class="col-12">
|
||||
<div class="text-center non-printable document-tabnav">
|
||||
<ul class="tabnav-control">
|
||||
<li class="tab {{if (eq tab 'content') 'selected'}}" {{action 'onTabChange' 'content'}}>Content</li>
|
||||
<li class="tab {{if (eq tab 'attachment') 'selected'}}" {{action 'onTabChange' 'attachment'}}>Attachments</li>
|
||||
{{#if session.authenticated}}
|
||||
<li class="tab {{if (eq tab 'revision') 'selected'}}" {{action 'onTabChange' 'revision'}}>Revisions</li>
|
||||
{{/if}}
|
||||
</ul>
|
||||
</div>
|
||||
{{#if (eq tab 'content')}}
|
||||
{{document/view-content
|
||||
document=document links=links pages=pages blocks=blocks currentPageId=currentPageId
|
||||
folder=folder folders=folders sections=sections permissions=permissions roles=roles
|
||||
onSavePage=(action 'onSavePage') onInsertSection=(action 'onInsertSection')
|
||||
onSavePageAsBlock=(action 'onSavePageAsBlock') onDeleteBlock=(action 'onDeleteBlock')
|
||||
onCopyPage=(action 'onCopyPage') onMovePage=(action 'onMovePage') onDeletePage=(action 'onPageDeleted')
|
||||
refresh=(action 'refresh')}}
|
||||
{{/if}}
|
||||
{{#if (eq tab 'attachment')}}
|
||||
{{document/view-attachment document=document permissions=permissions onReady=(action 'onReady')}}
|
||||
{{/if}}
|
||||
{{#if (eq tab 'revision')}}
|
||||
{{document/view-revision document=document folder=folder pages=pages permissions=permissions onRollback=(action 'onRollback')}}
|
||||
{{/if}}
|
||||
|
||||
{{#if (eq tab 'content')}}
|
||||
{{document/view-content
|
||||
document=document links=links pages=pages blocks=blocks currentPageId=currentPageId
|
||||
folder=folder folders=folders sections=sections permissions=permissions roles=roles
|
||||
onSavePage=(action 'onSavePage') onInsertSection=(action 'onInsertSection')
|
||||
onSavePageAsBlock=(action 'onSavePageAsBlock') onDeleteBlock=(action 'onDeleteBlock')
|
||||
onCopyPage=(action 'onCopyPage') onMovePage=(action 'onMovePage') onDeletePage=(action 'onPageDeleted')
|
||||
refresh=(action 'refresh')}}
|
||||
{{/if}}
|
||||
{{#if (eq tab 'attachment')}}
|
||||
{{document/view-attachment document=document permissions=permissions}}
|
||||
{{/if}}
|
||||
{{#if (eq tab 'revision')}}
|
||||
{{document/view-revision document=document folder=folder pages=pages permissions=permissions onRollback=(action 'onRollback')}}
|
||||
{{/if}}
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
{{/layout/middle-zone-content}}
|
||||
|
||||
{{#layout/middle-zone-sidebar}}
|
||||
{{document/document-toc
|
||||
document=document
|
||||
folder=folder
|
||||
pages=pages
|
||||
page=page
|
||||
permissions=permissions
|
||||
roles=roles
|
||||
tab=tab
|
||||
currentPageId=currentPageId
|
||||
onShowPage=(action 'onShowPage')
|
||||
onPageSequenceChange=(action 'onPageSequenceChange')
|
||||
onPageLevelChange=(action 'onPageLevelChange')}}
|
||||
{{/layout/middle-zone-sidebar}}
|
||||
{{/layout/middle-zone}}
|
||||
|
||||
{{#layout/bottom-bar}}
|
||||
{{/layout/bottom-bar}}
|
||||
|
|
|
|||
Loading…
Add table
Add a link
Reference in a new issue