Merge pull request #162 from documize/export-html

Export spaces, categories, documents to self-enclosed HTML file

README.md

@@ -58,9 +58,9 @@ Space view.
 
 ## Latest version
 
-[Community edition: v1.67.0](https://github.com/documize/community/releases)
+[Community edition: v1.68.0](https://github.com/documize/community/releases)
 
-[Enterprise edition: v1.69.0](https://documize.com/downloads)
+[Enterprise edition: v1.70.0](https://documize.com/downloads)
 
 ## OS support
 

domain/document/endpoint.go

@@ -726,3 +726,48 @@ func (h *Handler) Vote(w http.ResponseWriter, r *http.Request) {
 
 	response.WriteEmpty(w)
 }
+
+// Export returns content as self-enclosed HTML file.
+func (h *Handler) Export(w http.ResponseWriter, r *http.Request) {
+	method := "document.Export"
+	ctx := domain.GetRequestContext(r)
+
+	// Deduce ORG if anon user.
+	if len(ctx.OrgID) == 0 {
+		ctx.Subdomain = organization.GetSubdomainFromHost(r)
+		org, err := h.Store.Organization.GetOrganizationByDomain(ctx.Subdomain)
+		if err != nil {
+			response.WriteServerError(w, method, err)
+			h.Runtime.Log.Error(method, err)
+			return
+		}
+		ctx.OrgID = org.RefID
+	}
+
+	defer streamutil.Close(r.Body)
+	body, err := ioutil.ReadAll(r.Body)
+	if err != nil {
+		response.WriteBadRequestError(w, method, err.Error())
+		h.Runtime.Log.Error(method, err)
+		return
+	}
+
+	spec := exportSpec{}
+	err = json.Unmarshal(body, &spec)
+	if err != nil {
+		response.WriteBadRequestError(w, method, err.Error())
+		h.Runtime.Log.Error(method, err)
+		return
+	}
+
+	export, err := BuildExport(ctx, *h.Store, spec)
+	if err != nil {
+		response.WriteServerError(w, method, err)
+		h.Runtime.Log.Error(method, err)
+		return
+	}
+
+	w.Header().Set("Content-Type", "text/html; charset=utf-8")
+	w.WriteHeader(http.StatusOK)
+	w.Write([]byte(export))
+}

edition/community.go

@@ -41,7 +41,7 @@ func main() {
 	// product details
 	rt.Product = env.ProdInfo{}
 	rt.Product.Major = "1"
-	rt.Product.Minor = "67"
+	rt.Product.Minor = "68"
 	rt.Product.Patch = "0"
 	rt.Product.Version = fmt.Sprintf("%s.%s.%s", rt.Product.Major, rt.Product.Minor, rt.Product.Patch)
 	rt.Product.Edition = "Community"

gui/app/components/folder/documents-list.js

@@ -81,6 +81,16 @@ export default Component.extend(TooltipMixin, {
 			return true;
 		},
 
+		onExport() {
+			let list = this.get('selectedDocuments');
+			this.set('selectedDocuments', A([]));
+
+			let cb = this.get('onExportDocument');
+			cb(list);
+
+			return true;
+		},
+
         selectDocument(documentId) {
             let doc = this.get('documents').findBy('id', documentId);
             let list = this.get('selectedDocuments');

gui/app/components/toolbar/for-document.js

@@ -14,14 +14,17 @@ import { inject as service } from '@ember/service';
 import AuthMixin from '../../mixins/auth';
 import TooltipMixin from '../../mixins/tooltip';
 import ModalMixin from '../../mixins/modal';
+import Notifier from '../../mixins/notifier';
 import Component from '@ember/component';
 
-export default Component.extend(ModalMixin, TooltipMixin, AuthMixin, {
+export default Component.extend(ModalMixin, TooltipMixin, AuthMixin, Notifier, {
 	store: service(),
 	spaceSvc: service('folder'),
 	session: service(),
 	appMeta: service(),
 	pinned: service(),
+	browserSvc: service('browser'),
+	documentSvc: service('document'),
 
 	init() {
 		this._super(...arguments);
@@ -130,5 +133,22 @@ export default Component.extend(ModalMixin, TooltipMixin, AuthMixin, {
 
 			return true;
 		},
+
+		onExport() {
+			this.showWait();
+
+			let spec = {
+				spaceId: this.get('document.folderId'),
+				data: [],
+				filterType: 'document',
+			};
+
+			spec.data.push(this.get('document.id'));
+
+			this.get('documentSvc').export(spec).then((htmlExport) => {
+				this.get('browserSvc').downloadFile(htmlExport, this.get('document.slug') + '.html');
+				this.showDone();
+			});
+		}
 	}
 });

gui/app/components/toolbar/for-space.js

@@ -16,12 +16,15 @@ import { inject as service } from '@ember/service';
 import TooltipMixin from '../../mixins/tooltip';
 import ModalMixin from '../../mixins/modal';
 import AuthMixin from '../../mixins/auth';
+import Notifier from '../../mixins/notifier';
 import Component from '@ember/component';
 
-export default Component.extend(ModalMixin, TooltipMixin, AuthMixin, {
+export default Component.extend(ModalMixin, TooltipMixin, AuthMixin, Notifier, {
 	spaceService: service('folder'),
 	localStorage: service(),
 	templateService: service('template'),
+	browserSvc: service('browser'),
+	documentSvc: service('document'),
 	session: service(),
 	appMeta: service(),
 	pinned: service(),
@@ -29,21 +32,24 @@ export default Component.extend(ModalMixin, TooltipMixin, AuthMixin, {
 	copyTemplate: true,
 	copyPermission: true,
 	copyDocument: false,
-
 	spaceSettings: computed('permissions', function() {
 		return this.get('permissions.spaceOwner') || this.get('permissions.spaceManage');
 	}),
 	deleteSpaceName: '',
-
 	hasTemplates: computed('templates', function() {
 		return this.get('templates.length') > 0;
 	}),
+	hasCategories: computed('categories', function() {
+		return this.get('categories.length') > 0;
+	}),
+	hasDocuments: computed('documents', function() {
+		return this.get('documents.length') > 0;
+	}),
 	emptyDocName: '',
 	emptyDocNameError: false,
 	templateDocName: '',
 	templateDocNameError: false,
 	selectedTemplate: '',
-
 	dropzone: null,
 
 	init() {
@@ -71,6 +77,11 @@ export default Component.extend(ModalMixin, TooltipMixin, AuthMixin, {
 			this.set('pinState.newName', folder.get('name'));
 			this.renderTooltips();
 		});
+
+		let cats = this.get('categories');
+		cats.forEach((cat) => {
+			cat.set('exportSelected', false);
+		})
 	},
 
 	didInsertElement() {
@@ -290,6 +301,39 @@ export default Component.extend(ModalMixin, TooltipMixin, AuthMixin, {
 				let cb = this.get('onRefresh');
 				cb();
 			}
+		},
+
+		onShowExport() {
+			this.modalOpen("#space-export-modal", {"show": true});
+		},
+
+		onExport() {
+			this.showWait();
+
+			let spec = {
+				spaceId: this.get('space.id'),
+				data: [],
+				filterType: '',
+			};
+
+			let cats = this.get('categories');
+			cats.forEach((cat) => {
+				if (cat.get('exportSelected')) spec.data.push(cat.get('id'));
+			});
+
+			if (spec.data.length > 0) {
+				spec.filterType = 'category';
+			} else {
+				spec.filterType = 'space';
+				spec.data.push(this.get('space.id'));
+			}
+
+			this.get('documentSvc').export(spec).then((htmlExport) => {
+				this.get('browserSvc').downloadFile(htmlExport, this.get('space.slug') + '.html');
+				this.showDone();
+			});
+
+			this.modalClose("#space-export-modal");
 		}
 	}
 });

gui/app/pods/customize/folders/controller.js

@@ -12,11 +12,14 @@
 import $ from 'jquery';
 import { computed } from '@ember/object';
 import { inject as service } from '@ember/service';
-import Controller from '@ember/controller';
+import Notifier from '../../../mixins/notifier';
 import TooltipMixin from '../../../mixins/tooltip';
+import Controller from '@ember/controller';
 
-export default Controller.extend(TooltipMixin, {
+export default Controller.extend(TooltipMixin, Notifier, {
 	folderService: service('folder'),
+	browserSvc: service('browser'),
+	documentSvc: service('document'),
 	dropdown: null,
 
 	init() {
@@ -70,6 +73,21 @@ export default Controller.extend(TooltipMixin, {
 					this.set('folders', nonPrivateFolders);
 				});
 			});
+		},
+
+		onExport() {
+			this.showWait();
+
+			let spec = {
+				spaceId: '',
+				data: _.pluck(this.get('folders'), 'id'),
+				filterType: 'space',
+			};
+
+			this.get('documentSvc').export(spec).then((htmlExport) => {
+				this.get('browserSvc').downloadFile(htmlExport, 'documize.html');
+				this.showDone();
+			});
 		}
 	}
 });

gui/app/pods/customize/folders/template.hbs

@@ -3,6 +3,7 @@
 		<div class="col">
 			<div class="view-customize">
 				<h1 class="admin-heading">{{folders.length}} shared {{label}}</h1>
+				<button type="button" class="btn btn-success" onclick={{action 'onExport'}}>Export as HTML</button>
 			</div>
 		</div>
 	</div>

gui/app/pods/folder/index/controller.js

@@ -18,6 +18,8 @@ export default Controller.extend(NotifierMixin, {
 	documentService: service('document'),
 	folderService: service('folder'),
 	localStorage: service('localStorage'),
+	browserSvc: service('browser'),
+	documentSvc: service('document'),
 	queryParams: ['category'],
 	category: '',
 	filteredDocs: null,
@@ -71,6 +73,21 @@ export default Controller.extend(NotifierMixin, {
 			});
 		},
 
+		onExportDocument(documents) {
+			this.showWait();
+
+			let spec = {
+				spaceId: this.get('model.folder.id'),
+				data: documents,
+				filterType: 'document',
+			};
+
+			this.get('documentSvc').export(spec).then((htmlExport) => {
+				this.get('browserSvc').downloadFile(htmlExport, this.get('model.folder.slug') + '.html');
+				this.showDone();
+			});
+		},
+
 		onFiltered(docs) {
 			this.set('filteredDocs', docs);
 		}

gui/app/pods/folder/index/template.hbs

@@ -13,6 +13,9 @@
 			space=model.folder
 			permissions=model.permissions
 			templates=model.templates
+			category=category
+			categories=model.categories
+			documents=filteredDocs
 			onRefresh=(action 'onRefresh')
 			onDeleteSpace=(action 'onDeleteSpace')}}
 
@@ -22,6 +25,7 @@
 			space=model.folder
 			templates=model.templates
 			permissions=model.permissions
+			onExportDocument=(action 'onExportDocument')
 			onDeleteDocument=(action 'onDeleteDocument')
 			onMoveDocument=(action 'onMoveDocument')}}
 	{{/layout/middle-zone-content}}

gui/app/services/browser.js

@@ -52,5 +52,22 @@ export default Service.extend({
                 scrollTop: elem.top
             }, 250);
         });
-    }
+	},
+
+	downloadFile(content, filename) {
+		let b = new Blob([content], { type: 'text/html' });
+
+		let a = document.createElement("a");
+		a.style = "display: none";
+		document.body.appendChild(a);
+
+		let url = window.URL.createObjectURL(b);
+
+		a.href = url;
+		a.download = filename;
+		a.click();
+
+		window.URL.revokeObjectURL(url);
+		document.body.removeChild(a);
+	}
 });

gui/app/services/document.js

@@ -355,6 +355,18 @@ export default Service.extend({
 		});
 	},
 
+	//**************************************************
+	// Export
+	//**************************************************
+
+	export(spec) {
+		return this.get('ajax').post('export', {
+			data: JSON.stringify(spec),
+			contentType: 'json',
+			dataType: 'html'
+		});
+	},
+
 	//**************************************************
 	// Fetch bulk data
 	//**************************************************

gui/app/templates/components/folder/documents-list.hbs

@@ -22,6 +22,10 @@
 					</div>
 					{{#if document.selected}}
 						<div class="actions">
+							<div class="move-documents-button button-icon-green button-icon-small align-middle" {{action 'onExport'}} data-toggle="tooltip" data-placement="top" title="Export as HTML">
+								<i class="material-icons">import_export</i>
+							</div>
+							<div class="button-icon-gap" />
 							{{#if permissions.documentMove}}
 								<div class="move-documents-button button-icon-green button-icon-small align-middle" {{action 'onShowMoveDocuments'}} data-toggle="tooltip" data-placement="top" title="Move">
 									<i class="material-icons">compare_arrows</i>

gui/app/templates/components/toolbar/for-document.hbs

@@ -19,6 +19,11 @@
 	</div>
 	<div class="button-icon-gap" />
 
+	<div id="space-export-button" class="button-icon-danger align-middle" data-toggle="tooltip" data-placement="top" title="Export as HTML" {{action 'onExport'}}>
+		<i class="material-icons">import_export</i>
+	</div>
+	<div class="button-icon-gap" />
+
 	{{#if pinState.isPinned}}
 		<div id="document-pin-button" class="button-icon-gold align-middle" data-toggle="tooltip" data-placement="top" title="Remove favorite" {{action 'onUnpin'}}>
 			<i class="material-icons">star</i>

gui/app/templates/components/toolbar/for-space.hbs

@@ -101,6 +101,13 @@
 			<div class="button-icon-gap" />
 		{{/if}}
 
+		{{#if hasDocuments}}
+			<div id="space-export-button" class="button-icon-danger align-middle" data-toggle="tooltip" data-placement="top" title="Export as HTML" {{action 'onShowExport'}}>
+				<i class="material-icons">import_export</i>
+			</div>
+			<div class="button-icon-gap" />
+		{{/if}}
+
 		{{#if permissions.spaceOwner}}
 			<div id="space-delete-button" class="button-icon-danger align-middle" data-toggle="tooltip" data-placement="top" title="Delete space">
 				<i class="material-icons" data-toggle="modal" data-target="#space-delete-modal" data-backdrop="static">delete</i>
@@ -142,3 +149,25 @@
 		</div>
 	</div>
 </div>
+
+<div id="space-export-modal" class="modal" tabindex="-1" role="dialog">
+	<div class="modal-dialog" role="document">
+		<div class="modal-content">
+			<div class="modal-header">Export as HTML</div>
+			<div class="modal-body">
+				{{#if hasCategories}}
+					<p>Export all space content as HTML or select categories.</p>
+					{{#each categories as |cat|}}
+						{{#ui/ui-checkbox selected=cat.exportSelected}}{{cat.category}}{{/ui/ui-checkbox}}
+					{{/each}}
+				{{else}}
+					<p>All space content will be exported as a single self-enclosed HTML file.</p>
+				{{/if}}
+			</div>
+			<div class="modal-footer">
+				<button type="button" class="btn btn-outline-secondary" data-dismiss="modal">Cancel</button>
+				<button type="button" class="btn btn-success" onclick={{action 'onExport'}}>Export</button>
+			</div>
+		</div>
+	</div>
+</div>

gui/package.json

@@ -1,6 +1,6 @@
 {
 	"name": "documize",
-	"version": "1.67.0",
+	"version": "1.68.0",
 	"description": "The Document IDE",
 	"private": true,
 	"repository": "",

server/routing/routes.go

@@ -192,6 +192,8 @@ func RegisterEndpoints(rt *env.Runtime, s *domain.Store) {
 	AddPrivate(rt, "category/{categoryID}/permission", []string{"GET", "OPTIONS"}, nil, permission.GetCategoryPermissions)
 	AddPrivate(rt, "category/{categoryID}/user", []string{"GET", "OPTIONS"}, nil, permission.GetCategoryViewers)
 
+	AddPrivate(rt, "export", []string{"POST", "OPTIONS"}, nil, document.Export)
+
 	// fetch methods exist to speed up UI rendering by returning data in bulk
 	AddPrivate(rt, "fetch/category/space/{spaceID}", []string{"GET", "OPTIONS"}, nil, category.FetchSpaceData)
 	AddPrivate(rt, "fetch/document/{documentID}", []string{"GET", "OPTIONS"}, nil, document.FetchDocumentData)