re-worked to use new BLOCK table

app/app/components/document/document-sidebar.js

@@ -25,8 +25,8 @@ export default Ember.Component.extend(TooltipMixin, NotifierMixin, {
 
 	init() {
 		this._super(...arguments);
-		this.get('sectionService').getSpaceSectionTemplates(this.get('folder.id')).then((t) => {
-			this.set('templates', t);
+		this.get('sectionService').getSpaceBlocks(this.get('folder.id')).then((b) => {
+			this.set('blocks', b);
 		});
 	},
 
@@ -101,9 +101,9 @@ export default Ember.Component.extend(TooltipMixin, NotifierMixin, {
 			this.attrs.onAddSection(section);
 		},
 
-		onInsertTemplate(template) {
+		onInsertBlock(block) {
 			this.send('showToc');
-			this.attrs.onInsertTemplate(template);
+			this.attrs.onInsertBlock(block);
 		},
 
 		scrollTop() {

app/app/components/document/document-view.js

@@ -70,14 +70,8 @@ export default Ember.Component.extend(NotifierMixin, TooltipMixin, {
 	},
 
 	actions: {
-		onSaveAsPage(id, title) {
-			let params = {
-				documentId: this.get('document.id'),
-				pageId: id,
-				title: title,
-			};
-
-			this.attrs.onSaveAsPage(params);
+		onAddBlock(block) {
+			this.attrs.onAddBlock(block);
 		},
 
 		onDeletePage(id, deleteChildren) {

app/app/components/document/page-heading.js

@@ -13,14 +13,16 @@ import Ember from 'ember';
 import TooltipMixin from '../../mixins/tooltip';
 
 const {
-	computed
+	computed,
+	inject: { service }
 } = Ember;
 
 export default Ember.Component.extend(TooltipMixin, {
+	documentService: service('document'),
 	deleteChildren: false,
 	menuOpen: false,
-	saveAsTitle: "",
-
+	blockTitle: "",
+	blockExcerpt: "",
 
 	checkId: computed('page', function () {
 		let id = this.get('page.id');
@@ -42,9 +44,13 @@ export default Ember.Component.extend(TooltipMixin, {
 		let id = this.get('page.id');
 		return `save-as-dialog-${id}`;
 	}),
-	saveAsTitleId: computed('page', function () {
+	blockTitleId: computed('page', function () {
 		let id = this.get('page.id');
-		return `save-as-title-${id}`;
+		return `block-title-${id}`;
+	}),
+	blockExcerptId: computed('page', function () {
+		let id = this.get('page.id');
+		return `block-excerpt-${id}`;
 	}),
 
 	didRender() {
@@ -55,7 +61,8 @@ export default Ember.Component.extend(TooltipMixin, {
 			});
 		}
 
-		$("#" + this.get('saveAsTitleId')).removeClass('error');
+		$("#" + this.get('blockTitleId')).removeClass('error');
+		$("#" + this.get('blockExcerptId')).removeClass('error');
 	},
 
 	willDestroyElement() {
@@ -79,20 +86,44 @@ export default Ember.Component.extend(TooltipMixin, {
 			this.attrs.onDeletePage(id, this.get('deleteChildren'));
 		},
 
-		saveAsPage(id) {
-			let titleElem = '#' + this.get('saveAsTitleId');
-			let saveAsTitle = this.get('saveAsTitle');
-			if (is.empty(saveAsTitle)) {
+		onAddBlock(page) {
+			let titleElem = '#' + this.get('blockTitleId');
+			let blockTitle = this.get('blockTitle');
+			if (is.empty(blockTitle)) {
 				$(titleElem).addClass('error');
 				return;
 			}
 
-			this.attrs.onSaveAsPage(id, saveAsTitle);
-			this.set('menuOpen', false);
-			this.set('saveAsTitle', '');
-			$(titleElem).removeClass('error');
+			let excerptElem = '#' + this.get('blockExcerptId');
+			let blockExcerpt = this.get('blockExcerpt');
+			blockExcerpt = blockExcerpt.replace(/\n/g, "");
+			if (is.empty(blockExcerpt)) {
+				$(excerptElem).addClass('error');
+				return;
+			}
 
-			return true;
+			this.get('documentService').getPageMeta(this.get('document.id'), page.get('id')).then((pm) => {
+				let block = {
+					folderId: this.get('folder.id'),
+					contentType: page.get('contentType'),
+					pageType: page.get('pageType'),
+					title: blockTitle,
+					body: page.get('body'),
+					excerpt: blockExcerpt,
+					rawBody: pm.get('rawBody'),
+					config: pm.get('config'),
+					externalSource: pm.get('externalSource')
+				};
+
+				this.attrs.onAddBlock(block);
+				this.set('menuOpen', false);
+				this.set('blockTitle', '');
+				this.set('blockExcerpt', '');
+				$(titleElem).removeClass('error');
+				$(excerptElem).removeClass('error');
+
+				return true;
+			});
 		},
 	}
 });

app/app/components/document/page-wizard.js

@@ -17,8 +17,7 @@ export default Ember.Component.extend(NotifierMixin, {
 	hasTemplates: false,
 
 	didReceiveAttrs() {
-		console.log(this.get('templates.length'));
-		this.set('hasTemplates', this.get('templates.length') > 0);
+		this.set('hasBlocks', this.get('blocks.length') > 0);
 	},
 
 	didRender() {
@@ -43,8 +42,8 @@ export default Ember.Component.extend(NotifierMixin, {
 			this.attrs.onAddSection(section);
 		},
 
-		insertTemplate(template) {
-			this.attrs.onInsertTemplate(template);
+		onInsertBlock(block) {
+			this.attrs.onInsertBlock(block);
 		}
 	}
 });

app/app/components/folder/folders-list.js

@@ -53,7 +53,7 @@ export default Ember.Component.extend(TooltipMixin, NotifierMixin, {
             };
 
 			saved.forEach(function(t) {
-				t.img = "template-saved";
+				Ember.set(t, 'img', 'template-saved');
 			});
 
             saved.unshiftObject(emptyTemplate);

app/app/models/block.js

@@ -13,14 +13,18 @@ import Model from 'ember-data/model';
 import attr from 'ember-data/attr';
 
 export default Model.extend({
-	documentId: attr('string'),
 	orgId: attr('string'),
+	folderId: attr('string'),
+	userId: attr('string'),
 	contentType: attr('string'),
 	pageType: attr('string'),
-	preset: attr('boolean', { defaultValue: false }),
-	presetId: attr('string'),
 	title: attr('string'),
 	body: attr('string'),
+	excerpt: attr('string'),
+	used: attr('number', { defaultValue: 0 }),
+	rawBody: attr(),
+	config: attr(),
+	externalSource: attr('boolean', { defaultValue: false }),
 	firstname: attr('string'),
 	lastname: attr('string'),
 	created: attr(),

app/app/models/page.js

@@ -22,8 +22,7 @@ export default Model.extend({
 	level: attr('number', { defaultValue: 1 }),
 	sequence: attr('number', { defaultValue: 0 }),
 	revisions: attr('number', { defaultValue: 0 }),
-	preset: attr('boolean', { defaultValue: false }),
-	presetId: attr('string'),
+	blockId: attr('string'),
 	title: attr('string'),
 	body: attr('string'),
 	rawBody: attr('string'),

app/app/pods/document/controller.js

@@ -142,24 +142,25 @@ export default Ember.Controller.extend(NotifierMixin, {
 			});
 		},
 
-		onInsertTemplate(template) {
-			this.audit.record("added-section-template-" + template.get('contentType'));
+		onInsertBlock(block) {
+			this.audit.record("added-content-block-" + block.get('contentType'));
 
 			let page = {
 				documentId: this.get('model.document.id'),
-				title: `${template.get('title')}`,
+				title: `${block.get('title')}`,
 				level: 1,
 				sequence: 0,
-				body: template.get('body'),
-				contentType: template.get('contentType'),
-				pageType: template.get('pageType'),
-				presetId: template.get('id')
+				body: block.get('body'),
+				contentType: block.get('contentType'),
+				pageType: block.get('pageType'),
+				blockId: block.get('id')
 			};
 
 			let meta = {
 				documentId: this.get('model.document.id'),
-				rawBody: "",
-				config: ""
+				rawBody: block.get('rawBody'),
+				config: block.get('config'),
+				externalSource: block.get('externalSource')
 			};
 
 			let model = {

app/app/pods/document/index/controller.js

@@ -86,8 +86,8 @@ export default Ember.Controller.extend(NotifierMixin, {
 			});
 		},
 
-		onSaveAsPage(params) {
-			this.get('sectionService').saveSectionTemplate(params).then(() => {
+		onAddBlock(block) {
+			this.get('sectionService').addBlock(block).then(() => {
 				this.showNotification("Published");
 			});
 		},

app/app/pods/document/index/template.hbs

@@ -1,2 +1,2 @@
 {{document/document-view document=model.document links=model.links allPages=model.allPages tabs=model.tabs pages=model.pages folder=model.folder folders=model.folders isEditor=model.isEditor
-	gotoPage=(action 'gotoPage') onSaveAsPage=(action 'onSaveAsPage') onDeletePage=(action 'onPageDeleted')}}
+	gotoPage=(action 'gotoPage') onAddBlock=(action 'onAddBlock') onDeletePage=(action 'onPageDeleted')}}

app/app/pods/document/template.hbs

@@ -2,7 +2,7 @@
 
 {{#layout/zone-sidebar}}
 	{{document/document-sidebar document=model.document folder=model.folder pages=model.pages page=model.page isEditor=model.isEditor sections=model.sections
-		onAddSection=(action 'onAddSection') onInsertTemplate=(action 'onInsertTemplate') changePageSequence=(action 'onPageSequenceChange') changePageLevel=(action 'onPageLevelChange') gotoPage=(action 'gotoPage')}}
+		onAddSection=(action 'onAddSection') onInsertBlock=(action 'onInsertBlock') changePageSequence=(action 'onPageSequenceChange') changePageLevel=(action 'onPageLevelChange') gotoPage=(action 'gotoPage')}}
 {{/layout/zone-sidebar}}
 
 {{#layout/zone-content}}

app/app/services/section.js

@@ -70,13 +70,13 @@ export default BaseService.extend({
 		});
 	},
 
-	/******************************
-	* Reusable section blocks
-	******************************/
+	/**************************************************
+	 * Reusable Content Blocks
+	 **************************************************/
 
-	// Saves section as template
-	saveSectionTemplate(payload) {
-		let url = `sections/templates`;
+	// Save new reusable content block.
+	addBlock(payload) {
+		let url = `sections/blocks`;
 
 		return this.get('ajax').post(url, {
 			data: JSON.stringify(payload),
@@ -84,15 +84,15 @@ export default BaseService.extend({
 		});
 	},
 
-	// Returns all available sections.
-	getSpaceSectionTemplates(folderId) {
-		return this.get('ajax').request(`sections/templates/${folderId}`, {
+	// Returns all available reusable content block for section.
+	getSpaceBlocks(folderId) {
+		return this.get('ajax').request(`sections/blocks/${folderId}`, {
 			method: 'GET'
 		}).then((response) => {
 			let data = [];
 
 			data = response.map((obj) => {
-				let data = this.get('store').normalize('pageTemplate', obj);
+				let data = this.get('store').normalize('block', obj);
 				return this.get('store').push(data);
 			});
 

app/app/templates/components/document/document-sidebar.hbs

@@ -25,7 +25,7 @@
 			gotoPage=(action 'gotoPage')}}
 	{{/if}}
 	{{#if showSections}}
-		{{document/page-wizard display='section' document=document folder=folder sections=sections templates=templates
-		onCancel=(action 'onCancel') onAddSection=(action 'onAddSection') onInsertTemplate=(action 'onInsertTemplate')}}
+		{{document/page-wizard display='section' document=document folder=folder sections=sections blocks=blocks
+		onCancel=(action 'onCancel') onAddSection=(action 'onAddSection') onInsertBlock=(action 'onInsertBlock')}}
 	{{/if}}
 </div>

app/app/templates/components/document/document-view.hbs

@@ -17,7 +17,7 @@
 		{{#each pages key="id" as |page index|}}
 			<div class="wysiwyg">
 				<div id="page-{{ page.id }}" class="is-a-page" data-id="{{ page.id }}" data-type="{{ page.contentType }}">
-					{{document/page-heading tagName=page.tagName document=document folder=folder page=page isEditor=isEditor onSaveAsPage=(action 'onSaveAsPage') onDeletePage=(action 'onDeletePage')}}
+					{{document/page-heading tagName=page.tagName document=document folder=folder page=page isEditor=isEditor onAddBlock=(action 'onAddBlock') onDeletePage=(action 'onDeletePage')}}
 					{{section/base-renderer page=page}}
 				</div>
 			</div>

app/app/templates/components/document/page-heading.hbs

@@ -30,7 +30,7 @@
 	                    <label for="{{checkId}}">&nbsp;Delete child pages</label>
 	                </p>
 	            {{/dropdown-dialog}}
-				{{#dropdown-dialog id=saveAsDialogId target=saveAsTarget position="top right" button="Publish" color="flat-green" focusOn=saveAsTitleId onAction=(action 'saveAsPage' page.id)}}
+				{{#dropdown-dialog id=saveAsDialogId target=saveAsTarget position="top right" button="Publish" color="flat-green" focusOn=blockTitleId onAction=(action 'onAddBlock' page)}}
 					<div class="form-header">
 						<div class="tip">
 							<span class="bold">{{folder.name}}:</span> Content Block
@@ -38,8 +38,13 @@
 					</div>
 					<div class="input-control">
 						<label>Name</label>
-						<div class="tip">Short description to help others understand<br/>this reusable content block</div>
-						{{textarea rows="3" value=saveAsTitle id=saveAsTitleId}}
+						<div class="tip">Short title for reusable content block</div>
+						{{input type="text" value=blockTitle id=blockTitleId}}
+					</div>
+					<div class="input-control">
+						<label>Name</label>
+						<div class="tip">Short description to help others understand<br/>the reusable content block</div>
+						{{textarea rows="3" value=blockExcerpt id=blockExcerptId}}
 					</div>
 	            {{/dropdown-dialog}}
 			{{/if}}

app/app/templates/components/document/page-wizard.hbs

@@ -19,25 +19,29 @@
 				</li>
 			{{/each}}
 		</ul>
-		{{#if hasTemplates}}
+		{{#if hasBlocks}}
 			<div class="divider"></div>
-			<div class="template-caption">Published content blocks</div>
+			<div class="template-caption">Reusable Content</div>
 			<ul class="list">
-				{{#each templates as |template|}}
-					<li class="item" {{action 'insertTemplate' template}}>
+				{{#each blocks as |block|}}
+					<li class="item" {{action 'onInsertBlock' block}}>
 						<div class="icon">
 							<img class="img" src="/assets/img/section-saved.png" srcset="/assets/img/section-saved@2x.png" />
 						</div>
 						<div class="details">
 							<div class='title'>
-								{{template.title}}
+								{{block.title}}
 							</div>
-							<div class='desc'>{{template.firstname}} {{template.lastname}} &middot; {{time-ago template.created}}</div>
+							<div class='desc'>{{block.excerpt}}</div>
+							<div class='desc'>By {{block.firstname}} {{block.lastname}}, {{time-ago block.created}} (used: {{ block.used }})</div>
 						</div>
 						<div class="clearfix" />
 					</li>
 				{{/each}}
 			</ul>
+		{{else}}
+			<div class="divider"></div>
+			<div class="template-caption">No reusable content</div>
 		{{/if}}
 	</div>
 </div>