From a3194ac8fb9008f8f8fe4cd4a2ac91f67d6ef3bd Mon Sep 17 00:00:00 2001 From: Harvey Kandola Date: Sat, 4 Mar 2017 21:07:39 +0000 Subject: [PATCH] block editing and deletion --- app/app/components/document/document-view.js | 56 +++++++++++-------- app/app/pods/document/block/route.js | 10 +++- app/app/pods/document/block/template.hbs | 21 ++++++- app/app/pods/document/index/controller.js | 39 +++++++------ app/app/pods/document/index/template.hbs | 4 +- app/app/styles/view/document/view.scss | 20 ++++++- .../components/document/document-view.hbs | 2 +- .../components/section/base-editor.hbs | 9 +++ 8 files changed, 117 insertions(+), 44 deletions(-) diff --git a/app/app/components/document/document-view.js b/app/app/components/document/document-view.js index 0344d6c2..a72eebd5 100644 --- a/app/app/components/document/document-view.js +++ b/app/app/components/document/document-view.js @@ -30,19 +30,7 @@ export default Ember.Component.extend(NotifierMixin, TooltipMixin, { toEdit: '', didReceiveAttrs() { - this.get('sectionService').getSpaceBlocks(this.get('folder.id')).then((blocks) => { - if (this.get('isDestroyed') || this.get('isDestroying')) { - return; - } - - this.set('blocks', blocks); - this.set('hasBlocks', blocks.get('length') > 0); - - // to test - blocks.forEach((b) => { - b.set('deleteId', `delete-block-button-${b.id}`); - }); - }); + this.loadBlocks(); }, didRender() { @@ -137,17 +125,30 @@ export default Ember.Component.extend(NotifierMixin, TooltipMixin, { this.send('onHideSectionWizard'); this.set('pageId', ''); - const promise = this.get('onInsertSection')(model); - promise.then((id) => { - if (model.page.pageType === 'section') { - this.set('toEdit', id); + return this.get('onInsertSection')(model); + }, + + loadBlocks() { + this.get('sectionService').getSpaceBlocks(this.get('folder.id')).then((blocks) => { + if (this.get('isDestroyed') || this.get('isDestroying')) { + return; } + + this.set('blocks', blocks); + this.set('hasBlocks', blocks.get('length') > 0); + + blocks.forEach((b) => { + b.set('deleteId', `delete-block-button-${b.id}`); + }); }); }, actions: { onSavePageAsBlock(block) { - this.attrs.onSavePageAsBlock(block); + const promise = this.attrs.onSavePageAsBlock(block); + promise.then(() => { + this.loadBlocks(); + }); }, onCopyPage(pageId, documentId) { @@ -231,7 +232,12 @@ export default Ember.Component.extend(NotifierMixin, TooltipMixin, { this.audit.record("added-section-" + page.contentType); - this.addSection(model); + const promise = this.addSection(model); + promise.then((id) => { + if (model.page.pageType === 'section') { + this.set('toEdit', id); + } + }); }, onInsertBlock(block) { @@ -266,12 +272,18 @@ export default Ember.Component.extend(NotifierMixin, TooltipMixin, { this.audit.record("added-content-block-" + block.get('contentType')); + this.addSection(model); }, - // to test onDeleteBlock(id) { - this.attrs.onDeleteBlock(id); - } + const promise = this.attrs.onDeleteBlock(id); + + promise.then(() => { + this.loadBlocks(); + }); + + return true; + } } }); diff --git a/app/app/pods/document/block/route.js b/app/app/pods/document/block/route.js index 43cdf8a4..30f23f85 100644 --- a/app/app/pods/document/block/route.js +++ b/app/app/pods/document/block/route.js @@ -27,5 +27,13 @@ export default Ember.Route.extend(AuthenticatedRouteMixin, { document: self.modelFor('document').document, block: self.get('sectionService').getBlock(params.block_id), }); - } + }, + + activate() { + $('body').addClass('background-color-off-white'); + }, + + deactivate() { + $('body').removeClass('background-color-off-white'); + } }); diff --git a/app/app/pods/document/block/template.hbs b/app/app/pods/document/block/template.hbs index 4bfed5af..952cb08f 100644 --- a/app/app/pods/document/block/template.hbs +++ b/app/app/pods/document/block/template.hbs @@ -1 +1,20 @@ -{{document/block-editor document=model.document folder=model.folder block=model.block onCancel=(action 'onCancel') onAction=(action 'onAction')}} +
+
+
+
+
+
+ {{#link-to 'document.index' model.folder.id model.folder.slug model.document.id model.document.slug}} + arrow_back {{model.document.name}} + {{/link-to}} +
+ {{document/document-heading document=model.document isEditor=false}} + {{document/block-editor document=model.document folder=model.folder block=model.block onCancel=(action 'onCancel') onAction=(action 'onAction')}} +
+
+
+
+
+ + + diff --git a/app/app/pods/document/index/controller.js b/app/app/pods/document/index/controller.js index 2a832d60..fdd3a678 100644 --- a/app/app/pods/document/index/controller.js +++ b/app/app/pods/document/index/controller.js @@ -138,21 +138,40 @@ export default Ember.Controller.extend(NotifierMixin, { this.get('documentService').getPages(this.get('model.document.id')).then((pages) => { this.set('model.pages', pages); - if (newPage.pageType === 'section') { - resolve(newPage.id); - } else { + if (newPage.pageType === 'tab') { this.transitionToRoute('document.section', this.get('model.folder.id'), this.get('model.folder.slug'), this.get('model.document.id'), this.get('model.document.slug'), newPage.id); + } else { + resolve(newPage.id); } }); }); }); }, + onDeleteBlock(blockId) { + return new Ember.RSVP.Promise((resolve) => { + this.get('sectionService').deleteBlock(blockId).then(() => { + this.audit.record("deleted-block"); + this.send("showNotification", "Deleted"); + resolve(); + }); + }); + }, + + onSavePageAsBlock(block) { + return new Ember.RSVP.Promise((resolve) => { + this.get('sectionService').addBlock(block).then(() => { + this.showNotification("Published"); + resolve(); + }); + }); + }, + // to test onPageSequenceChange(changes) { this.get('documentService').changePageSequence(this.get('model.document.id'), changes).then(() => { @@ -191,24 +210,10 @@ export default Ember.Controller.extend(NotifierMixin, { this.get('target.router').refresh(); }); }, - - // to test - onSavePageAsBlock(block) { - this.get('sectionService').addBlock(block).then(() => { - this.showNotification("Published"); - }); - } } }); /* -onDeleteBlock(blockId) { - this.get('sectionService').deleteBlock(blockId).then(() => { - this.audit.record("deleted-block"); - this.send("showNotification", "Deleted"); - this.transitionToRoute('document.index'); - }); -}, onDocumentDelete() { this.get('documentService').deleteDocument(this.get('model.document.id')).then(() => { diff --git a/app/app/pods/document/index/template.hbs b/app/app/pods/document/index/template.hbs index f2d17ae4..faa8cbef 100644 --- a/app/app/pods/document/index/template.hbs +++ b/app/app/pods/document/index/template.hbs @@ -1,4 +1,5 @@
+
+ diff --git a/app/app/styles/view/document/view.scss b/app/app/styles/view/document/view.scss index de2dfc35..e2601989 100644 --- a/app/app/styles/view/document/view.scss +++ b/app/app/styles/view/document/view.scss @@ -254,11 +254,11 @@ float: left; > .img { - float: left; text-align: center; display: inline-block; height: 30px; width: 30px; + float: left; } } @@ -288,10 +288,28 @@ padding: 12px 0 0 20px; width: 423px; height: 60px; + position: relative; &:hover { @include ease-in(); border-color: $color-link; + + > .block-actions { + display: block; + } + } + + > .block-actions { + @include ease-in(); + display: none; + position: absolute; + top: 10px; + right: 8px; + + .material-icons { + color: $color-stroke; + font-size: 1rem; + } } > .details { diff --git a/app/app/templates/components/document/document-view.hbs b/app/app/templates/components/document/document-view.hbs index dbbd92be..09120c52 100644 --- a/app/app/templates/components/document/document-view.hbs +++ b/app/app/templates/components/document/document-view.hbs @@ -73,7 +73,7 @@