Cache pages and page nodes for offline use
All checks were successful
continuous-integration/drone/push Build is passing
All checks were successful
continuous-integration/drone/push Build is passing
This commit is contained in:
@@ -21,7 +21,12 @@
|
||||
</ion-header>
|
||||
|
||||
<ion-content>
|
||||
<ng-container>
|
||||
<ng-container *ngIf="editorService.notAvailable">
|
||||
<div class="editor-root ion-padding" style="text-align: center; padding-top: 100px; color: #494949; font-size: 1.2em;">
|
||||
Sorry, this page is not available offline yet.
|
||||
</div>
|
||||
</ng-container>
|
||||
<ng-container *ngIf="!editorService.notAvailable">
|
||||
<div class="editor-root ion-padding">
|
||||
<div
|
||||
class="host-container"
|
||||
|
||||
@@ -1,7 +1,5 @@
|
||||
import {Component, Host, HostListener, Input, OnInit, ViewChild, ViewChildren} from '@angular/core';
|
||||
import {Component, HostListener, Input, OnInit} from '@angular/core';
|
||||
import HostRecord from '../../structures/HostRecord';
|
||||
import PageRecord from '../../structures/PageRecord';
|
||||
import {PageService} from '../../service/page.service';
|
||||
import {ActivatedRoute, Router} from '@angular/router';
|
||||
import {LoadingController, PopoverController} from '@ionic/angular';
|
||||
import {NodePickerComponent} from '../../components/editor/node-picker/node-picker.component';
|
||||
@@ -15,13 +13,8 @@ import {NodeTypeIcons} from '../../structures/node-types';
|
||||
styleUrls: ['./editor.page.scss'],
|
||||
})
|
||||
export class EditorPage implements OnInit {
|
||||
// @ViewChildren('editorHosts') editorHosts;
|
||||
// @ViewChild('titleBar') titleBar;
|
||||
|
||||
public typeIcons = NodeTypeIcons;
|
||||
|
||||
@Input() pageId: string;
|
||||
public pageName = '';
|
||||
|
||||
constructor(
|
||||
protected route: ActivatedRoute,
|
||||
@@ -96,7 +89,6 @@ export class EditorPage implements OnInit {
|
||||
});
|
||||
|
||||
popover.onDidDismiss().then(result => {
|
||||
console.log('adding node', result.data);
|
||||
if ( !result.data ) {
|
||||
return;
|
||||
}
|
||||
@@ -104,238 +96,6 @@ export class EditorPage implements OnInit {
|
||||
this.editorService.addNode(result.data, position, positionNodeId);
|
||||
});
|
||||
|
||||
// popover.onDidDismiss().then(arg => {
|
||||
// const defValue = this.getDefaultValue(arg.data);
|
||||
// const hostRec = new HostRecord(defValue);
|
||||
// hostRec.type = arg.data;
|
||||
// hostRec.PageId = this.pageRecord.UUID;
|
||||
//
|
||||
// if ( hostRec.type === 'ul' ) {
|
||||
// hostRec.value = JSON.stringify([{value: '', indentationLevel: 0}]);
|
||||
// }
|
||||
//
|
||||
// this.hostRecords.push(hostRec);
|
||||
// if ( hostRec.isNorm() ) {
|
||||
// setTimeout(() => {
|
||||
// this.editorHosts.toArray().reverse()[0].takeFocus();
|
||||
// }, 0);
|
||||
// } else {
|
||||
// this.onSaveClick();
|
||||
// }
|
||||
// });
|
||||
|
||||
await popover.present();
|
||||
}
|
||||
|
||||
// buttonIsVisible(index) {
|
||||
// return this.visibleButtons.includes(index);
|
||||
// }
|
||||
//
|
||||
// makeVisible(index) {
|
||||
// if ( !this.buttonIsVisible(index) ) {
|
||||
// this.visibleButtons.push(index);
|
||||
// }
|
||||
// }
|
||||
//
|
||||
// makeInvisible(index) {
|
||||
// this.visibleButtons = this.visibleButtons.filter(x => x !== index);
|
||||
// }
|
||||
//
|
||||
// ionViewDidEnter() {
|
||||
// if ( this.pageId ) {
|
||||
// this.pages.load(this.pageId).subscribe(pageRecord => {
|
||||
// this.pageRecord = pageRecord;
|
||||
// this.pages.get_nodes(pageRecord).subscribe((hosts: Array<HostRecord>) => {
|
||||
// this.hostRecords = hosts;
|
||||
// if ( !pageRecord.isViewOnly() ) {
|
||||
// this.onSaveClick();
|
||||
// }
|
||||
// });
|
||||
// });
|
||||
// } else {
|
||||
// this.router.navigate(['/home']);
|
||||
// }
|
||||
// }
|
||||
//
|
||||
// onHostRecordChange($event, i) {
|
||||
// if ( !this.pageRecord.isViewOnly() ) {
|
||||
// this.hostRecords[i] = $event;
|
||||
// }
|
||||
// }
|
||||
//
|
||||
// async onAddClick($event) {
|
||||
// if ( this.pageRecord.isViewOnly() ) {
|
||||
// return;
|
||||
// }
|
||||
//
|
||||
// const popover = await this.popover.create({
|
||||
// component: NodePickerComponent,
|
||||
// event: $event,
|
||||
// });
|
||||
//
|
||||
// popover.onDidDismiss().then(arg => {
|
||||
// const defValue = this.getDefaultValue(arg.data);
|
||||
// const hostRec = new HostRecord(defValue);
|
||||
// hostRec.type = arg.data;
|
||||
// hostRec.PageId = this.pageRecord.UUID;
|
||||
//
|
||||
// if ( hostRec.type === 'ul' ) {
|
||||
// hostRec.value = JSON.stringify([{value: '', indentationLevel: 0}]);
|
||||
// }
|
||||
//
|
||||
// this.hostRecords.push(hostRec);
|
||||
// if ( hostRec.isNorm() ) {
|
||||
// setTimeout(() => {
|
||||
// this.editorHosts.toArray().reverse()[0].takeFocus();
|
||||
// }, 0);
|
||||
// } else {
|
||||
// this.onSaveClick();
|
||||
// }
|
||||
// });
|
||||
//
|
||||
// await popover.present();
|
||||
// }
|
||||
//
|
||||
// getDefaultValue(type: string) {
|
||||
// if ( type === 'paragraph' ) {
|
||||
// return '';
|
||||
// } else if ( type === 'header1' ) {
|
||||
// return '# ';
|
||||
// } else if ( type === 'header2' ) {
|
||||
// return '## ';
|
||||
// } else if ( type === 'header3' ) {
|
||||
// return '### ';
|
||||
// } else if ( type === 'header4' ) {
|
||||
// return '#### ';
|
||||
// } else if ( type === 'block_code' ) {
|
||||
// return '```';
|
||||
// } else if ( type === 'click_link' ) {
|
||||
// return 'https://';
|
||||
// } else if ( type === 'page_sep' ) {
|
||||
// return '===';
|
||||
// } else {
|
||||
// return '';
|
||||
// }
|
||||
// }
|
||||
//
|
||||
// onNewHostRequested($event) {
|
||||
// if ( this.pageRecord.isViewOnly() ) {
|
||||
// return;
|
||||
// }
|
||||
//
|
||||
// const insertAfter = this.getIndexFromRecord($event.record);
|
||||
// const record = new HostRecord('');
|
||||
// const newHosts = []
|
||||
// this.hostRecords.forEach((rec, i) => {
|
||||
// newHosts.push(rec);
|
||||
// if ( i === insertAfter ) {
|
||||
// newHosts.push(record);
|
||||
// }
|
||||
// })
|
||||
//
|
||||
// this.hostRecords = newHosts;
|
||||
//
|
||||
// setTimeout(() => {
|
||||
// this.editorHosts.toArray()[insertAfter + 1].takeFocus();
|
||||
// }, 0);
|
||||
// }
|
||||
//
|
||||
// onDestroyHostRequested($event) {
|
||||
// if ( this.pageRecord.isViewOnly() ) {
|
||||
// return;
|
||||
// }
|
||||
//
|
||||
// let removedIndex = 0;
|
||||
// const newHostRecords = this.editorHosts.filter((host, i) => {
|
||||
// if ( $event.record === host.record ) {
|
||||
// removedIndex = i;
|
||||
// }
|
||||
// return host.record !== $event.record;
|
||||
// });
|
||||
//
|
||||
// const removedHost = this.editorHosts[removedIndex];
|
||||
//
|
||||
// const hostRecords = newHostRecords.map(host => host.record);
|
||||
// this.hostRecords = hostRecords;
|
||||
//
|
||||
// setTimeout(() => {
|
||||
// let focusIndex;
|
||||
// if ( removedIndex === 0 && this.editorHosts.toArray().length ) {
|
||||
// focusIndex = 0;
|
||||
// } else if ( removedIndex !== 0 ) {
|
||||
// focusIndex = removedIndex - 1;
|
||||
// }
|
||||
//
|
||||
// if ( focusIndex >= 0 ) {
|
||||
// this.editorHosts.toArray()[focusIndex].takeFocus(false);
|
||||
// }
|
||||
// }, 0);
|
||||
// }
|
||||
//
|
||||
// protected getIndexFromRecord(record) {
|
||||
// let index;
|
||||
// this.editorHosts.toArray().forEach((host, i) => {
|
||||
// if ( host.record === record ) {
|
||||
// index = i;
|
||||
// }
|
||||
// });
|
||||
// return index;
|
||||
// }
|
||||
//
|
||||
// onSaveClick() {
|
||||
// if ( this.pageRecord.isViewOnly() ) {
|
||||
// return;
|
||||
// }
|
||||
//
|
||||
// this.loader.create({message: 'Saving changes...'}).then(loader => {
|
||||
// loader.present().then(() => {
|
||||
// this.pageRecord.Name = this.titleBar.el.innerText.trim();
|
||||
//
|
||||
// // First, save the page record itself
|
||||
// this.pages.save(this.pageRecord).subscribe(pageRecord => {
|
||||
// this.pageRecord = pageRecord;
|
||||
//
|
||||
// // Now, save the nodes
|
||||
// this.pages.save_nodes(pageRecord, this.hostRecords).subscribe(result => {
|
||||
// this.hostRecords = result;
|
||||
// loader.dismiss();
|
||||
// });
|
||||
// });
|
||||
// });
|
||||
// });
|
||||
// }
|
||||
//
|
||||
// async onOptionsClick($event, i) {
|
||||
// if ( this.pageRecord.isViewOnly() ) {
|
||||
// return;
|
||||
// }
|
||||
//
|
||||
// const popover = await this.popover.create({
|
||||
// component: HostOptionsComponent,
|
||||
// event: $event,
|
||||
// componentProps: {
|
||||
// editor: this,
|
||||
// index: i,
|
||||
// event: $event,
|
||||
// hostRecord: this.hostRecords[i],
|
||||
// }
|
||||
// });
|
||||
//
|
||||
// popover.onDidDismiss().then((result) => {
|
||||
// if ( result.data === 'delete_node' ) {
|
||||
// $event.record = this.hostRecords[i];
|
||||
// this.onDestroyHostRequested($event);
|
||||
// }
|
||||
// })
|
||||
//
|
||||
// await popover.present();
|
||||
// }
|
||||
//
|
||||
// onEditorKeydown($event) {
|
||||
// if ( $event.key === 's' && $event.ctrlKey ) {
|
||||
// $event.preventDefault();
|
||||
// this.onSaveClick();
|
||||
// }
|
||||
// }
|
||||
|
||||
}
|
||||
|
||||
Reference in New Issue
Block a user