Remove dummy concept in favor of editor group and editors
This commit is contained in:
Mo Bitar
@@ -0,0 +1,17 @@
|
||||
.main-ui-view(
|
||||
ng-class='self.platformString'
|
||||
)
|
||||
#app.app(
|
||||
ng-class='self.state.appClass',
|
||||
ng-if='!self.state.needsUnlock && self.state.ready'
|
||||
)
|
||||
tags-view(application='self.application')
|
||||
notes-view(application='self.application')
|
||||
editor-group-view(
|
||||
application='self.application'
|
||||
)
|
||||
|
||||
footer-view(
|
||||
ng-if='!self.state.needsUnlock && self.state.ready'
|
||||
application='self.application'
|
||||
)
|
||||
318
app/assets/javascripts/views/application/application_view.ts
Normal file
318
app/assets/javascripts/views/application/application_view.ts
Normal file
@@ -0,0 +1,318 @@
|
||||
import { WebDirective, PermissionsModalScope, ModalComponentScope } from '@/types';
|
||||
import { getPlatformString } from '@/utils';
|
||||
import template from './application-view.pug';
|
||||
import { AppStateEvent } from '@/services/state';
|
||||
import { ApplicationEvent, SNComponent } from 'snjs';
|
||||
import angular from 'angular';
|
||||
import {
|
||||
PANEL_NAME_NOTES,
|
||||
PANEL_NAME_TAGS
|
||||
} from '@/views/constants';
|
||||
import {
|
||||
STRING_SESSION_EXPIRED,
|
||||
STRING_DEFAULT_FILE_ERROR
|
||||
} from '@/strings';
|
||||
import { PureViewCtrl } from '@Views/abstract/pure_view_ctrl';
|
||||
import { PermissionDialog } from '@/../../../../snjs/dist/@types/services/component_manager';
|
||||
|
||||
class ApplicationViewCtrl extends PureViewCtrl {
|
||||
private $compile?: ng.ICompileService
|
||||
private $location?: ng.ILocationService
|
||||
private $rootScope?: ng.IRootScopeService
|
||||
public platformString: string
|
||||
private completedInitialSync = false
|
||||
private syncStatus: any
|
||||
private notesCollapsed = false
|
||||
private tagsCollapsed = false
|
||||
private showingDownloadStatus = false
|
||||
private uploadSyncStatus: any
|
||||
private lastAlertShownDate?: Date
|
||||
|
||||
/* @ngInject */
|
||||
constructor(
|
||||
$compile: ng.ICompileService,
|
||||
$location: ng.ILocationService,
|
||||
$rootScope: ng.IRootScopeService,
|
||||
$timeout: ng.ITimeoutService
|
||||
) {
|
||||
super($timeout);
|
||||
this.$location = $location;
|
||||
this.$rootScope = $rootScope;
|
||||
this.$compile = $compile;
|
||||
this.platformString = getPlatformString();
|
||||
this.state = { appClass: '' };
|
||||
this.onDragDrop = this.onDragDrop.bind(this);
|
||||
this.onDragOver = this.onDragOver.bind(this);
|
||||
this.openModalComponent = this.openModalComponent.bind(this);
|
||||
this.presentPermissionsDialog = this.presentPermissionsDialog.bind(this);
|
||||
this.addDragDropHandlers();
|
||||
}
|
||||
|
||||
deinit() {
|
||||
this.$location = undefined;
|
||||
this.$rootScope = undefined;
|
||||
this.$compile = undefined;
|
||||
this.application = undefined;
|
||||
window.removeEventListener('dragover', this.onDragOver, true);
|
||||
window.removeEventListener('drop', this.onDragDrop, true);
|
||||
(this.onDragDrop as any) = undefined;
|
||||
(this.onDragOver as any) = undefined;
|
||||
(this.openModalComponent as any) = undefined;
|
||||
(this.presentPermissionsDialog as any) = undefined;
|
||||
super.deinit();
|
||||
}
|
||||
|
||||
$onInit() {
|
||||
super.$onInit();
|
||||
this.loadApplication();
|
||||
}
|
||||
|
||||
async loadApplication() {
|
||||
await this.application!.prepareForLaunch({
|
||||
receiveChallenge: async (challenge, orchestrator) => {
|
||||
this.application!.promptForChallenge(challenge, orchestrator);
|
||||
}
|
||||
});
|
||||
await this.application!.launch();
|
||||
|
||||
}
|
||||
|
||||
async onAppStart() {
|
||||
super.onAppStart();
|
||||
this.overrideComponentManagerFunctions();
|
||||
this.application!.componentManager!.setDesktopManager(
|
||||
this.application!.getDesktopService()
|
||||
);
|
||||
this.setState({
|
||||
ready: true,
|
||||
needsUnlock: this.application!.hasPasscode()
|
||||
});
|
||||
}
|
||||
|
||||
async onAppLaunch() {
|
||||
super.onAppLaunch();
|
||||
this.setState({ needsUnlock: false });
|
||||
this.handleAutoSignInFromParams();
|
||||
}
|
||||
|
||||
onUpdateAvailable() {
|
||||
this.$rootScope!.$broadcast('new-update-available');
|
||||
};
|
||||
|
||||
/** @override */
|
||||
async onAppEvent(eventName: ApplicationEvent) {
|
||||
super.onAppEvent(eventName);
|
||||
if (eventName === ApplicationEvent.LocalDataIncrementalLoad) {
|
||||
this.updateLocalDataStatus();
|
||||
} else if (
|
||||
eventName === ApplicationEvent.SyncStatusChanged ||
|
||||
eventName === ApplicationEvent.FailedSync
|
||||
) {
|
||||
this.updateSyncStatus();
|
||||
} else if (eventName === ApplicationEvent.LocalDataLoaded) {
|
||||
this.updateLocalDataStatus();
|
||||
} else if (eventName === ApplicationEvent.WillSync) {
|
||||
if (!this.completedInitialSync) {
|
||||
this.syncStatus = this.application!.getStatusService().replaceStatusWithString(
|
||||
this.syncStatus,
|
||||
"Syncing..."
|
||||
);
|
||||
}
|
||||
} else if (eventName === ApplicationEvent.CompletedSync) {
|
||||
if (!this.completedInitialSync) {
|
||||
this.syncStatus = this.application!.getStatusService().removeStatus(this.syncStatus);
|
||||
this.completedInitialSync = true;
|
||||
}
|
||||
} else if (eventName === ApplicationEvent.InvalidSyncSession) {
|
||||
this.showInvalidSessionAlert();
|
||||
} else if (eventName === ApplicationEvent.LocalDatabaseReadError) {
|
||||
this.application!.alertService!.alert(
|
||||
'Unable to load local database. Please restart the app and try again.'
|
||||
);
|
||||
} else if (eventName === ApplicationEvent.LocalDatabaseWriteError) {
|
||||
this.application!.alertService!.alert(
|
||||
'Unable to write to local database. Please restart the app and try again.'
|
||||
);
|
||||
}
|
||||
}
|
||||
|
||||
/** @override */
|
||||
async onAppStateEvent(eventName: AppStateEvent, data?: any) {
|
||||
if (eventName === AppStateEvent.PanelResized) {
|
||||
if (data.panel === PANEL_NAME_NOTES) {
|
||||
this.notesCollapsed = data.collapsed;
|
||||
}
|
||||
if (data.panel === PANEL_NAME_TAGS) {
|
||||
this.tagsCollapsed = data.collapsed;
|
||||
}
|
||||
let appClass = "";
|
||||
if (this.notesCollapsed) { appClass += "collapsed-notes"; }
|
||||
if (this.tagsCollapsed) { appClass += " collapsed-tags"; }
|
||||
this.setState({ appClass });
|
||||
} else if (eventName === AppStateEvent.WindowDidFocus) {
|
||||
if (!(await this.application!.isLocked())) {
|
||||
this.application!.sync();
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
updateLocalDataStatus() {
|
||||
const syncStatus = this.application!.getSyncStatus();
|
||||
const stats = syncStatus.getStats();
|
||||
const encryption = this.application!.isEncryptionAvailable();
|
||||
if (stats.localDataDone) {
|
||||
this.syncStatus = this.application!.getStatusService().removeStatus(this.syncStatus);
|
||||
return;
|
||||
}
|
||||
const notesString = `${stats.localDataCurrent}/${stats.localDataTotal} items...`;
|
||||
const loadingStatus = encryption
|
||||
? `Decrypting ${notesString}`
|
||||
: `Loading ${notesString}`;
|
||||
this.syncStatus = this.application!.getStatusService().replaceStatusWithString(
|
||||
this.syncStatus,
|
||||
loadingStatus
|
||||
);
|
||||
}
|
||||
|
||||
updateSyncStatus() {
|
||||
const syncStatus = this.application!.getSyncStatus();
|
||||
const stats = syncStatus.getStats();
|
||||
if (syncStatus.hasError()) {
|
||||
this.syncStatus = this.application!.getStatusService().replaceStatusWithString(
|
||||
this.syncStatus,
|
||||
'Unable to Sync'
|
||||
);
|
||||
} else if (stats.downloadCount > 20) {
|
||||
const text = `Downloading ${stats.downloadCount} items. Keep app open.`;
|
||||
this.syncStatus = this.application!.getStatusService().replaceStatusWithString(
|
||||
this.syncStatus,
|
||||
text
|
||||
);
|
||||
this.showingDownloadStatus = true;
|
||||
} else if (this.showingDownloadStatus) {
|
||||
this.showingDownloadStatus = false;
|
||||
const text = "Download Complete.";
|
||||
this.syncStatus = this.application!.getStatusService().replaceStatusWithString(
|
||||
this.syncStatus,
|
||||
text
|
||||
);
|
||||
setTimeout(() => {
|
||||
this.syncStatus = this.application!.getStatusService().removeStatus(this.syncStatus);
|
||||
}, 2000);
|
||||
} else if (stats.uploadTotalCount > 20) {
|
||||
this.uploadSyncStatus = this.application!.getStatusService().replaceStatusWithString(
|
||||
this.uploadSyncStatus,
|
||||
`Syncing ${stats.uploadCompletionCount}/${stats.uploadTotalCount} items...`
|
||||
);
|
||||
} else if (this.uploadSyncStatus) {
|
||||
this.uploadSyncStatus = this.application!.getStatusService().removeStatus(
|
||||
this.uploadSyncStatus
|
||||
);
|
||||
}
|
||||
}
|
||||
|
||||
openModalComponent(component: SNComponent) {
|
||||
const scope = this.$rootScope!.$new(true) as ModalComponentScope;
|
||||
scope.component = component;
|
||||
const el = this.$compile!(
|
||||
"<component-modal component='component' class='sk-modal'></component-modal>"
|
||||
)(scope as any);
|
||||
angular.element(document.body).append(el);
|
||||
}
|
||||
|
||||
presentPermissionsDialog(dialog: PermissionDialog) {
|
||||
const scope = this.$rootScope!.$new(true) as PermissionsModalScope;
|
||||
scope.permissionsString = dialog.permissionsString;
|
||||
scope.component = dialog.component;
|
||||
scope.callback = dialog.callback;
|
||||
const el = this.$compile!(
|
||||
"<permissions-modal component='component' permissions-string='permissionsString'"
|
||||
+ " callback='callback' class='sk-modal'></permissions-modal>"
|
||||
)(scope as any);
|
||||
angular.element(document.body).append(el);
|
||||
}
|
||||
|
||||
overrideComponentManagerFunctions() {
|
||||
this.application!.componentManager!.openModalComponent = this.openModalComponent;
|
||||
this.application!.componentManager!.presentPermissionsDialog = this.presentPermissionsDialog;
|
||||
}
|
||||
|
||||
showInvalidSessionAlert() {
|
||||
/** Don't show repeatedly; at most 30 seconds in between */
|
||||
const SHOW_INTERVAL = 30;
|
||||
if (
|
||||
!this.lastAlertShownDate ||
|
||||
(new Date().getTime() - this.lastAlertShownDate!.getTime()) / 1000 > SHOW_INTERVAL
|
||||
) {
|
||||
this.lastAlertShownDate = new Date();
|
||||
setTimeout(() => {
|
||||
this.application!.alertService!.alert(
|
||||
STRING_SESSION_EXPIRED
|
||||
);
|
||||
}, 500);
|
||||
}
|
||||
}
|
||||
|
||||
addDragDropHandlers() {
|
||||
/**
|
||||
* Disable dragging and dropping of files (but allow text) into main SN interface.
|
||||
* both 'dragover' and 'drop' are required to prevent dropping of files.
|
||||
* This will not prevent extensions from receiving drop events.
|
||||
*/
|
||||
window.addEventListener('dragover', this.onDragOver, true);
|
||||
window.addEventListener('drop', this.onDragDrop, true);
|
||||
}
|
||||
|
||||
onDragOver(event: DragEvent) {
|
||||
if (event.dataTransfer!.files.length > 0) {
|
||||
event.preventDefault();
|
||||
}
|
||||
}
|
||||
|
||||
onDragDrop(event: DragEvent) {
|
||||
if (event.dataTransfer!.files.length > 0) {
|
||||
event.preventDefault();
|
||||
this.application!.alertService!.alert(
|
||||
STRING_DEFAULT_FILE_ERROR
|
||||
);
|
||||
}
|
||||
}
|
||||
|
||||
async handleAutoSignInFromParams() {
|
||||
const params = this.$location!.search();
|
||||
const server = params.server;
|
||||
const email = params.email;
|
||||
const password = params.pw;
|
||||
if (!server || !email || !password) return;
|
||||
|
||||
const user = this.application!.getUser();
|
||||
if (user) {
|
||||
if (user.email === email && await this.application!.getHost() === server) {
|
||||
/** Already signed in, return */
|
||||
return;
|
||||
} else {
|
||||
/** Sign out */
|
||||
await this.application!.signOut();
|
||||
}
|
||||
}
|
||||
await this.application!.setHost(server);
|
||||
this.application!.signIn(
|
||||
email,
|
||||
password,
|
||||
);
|
||||
}
|
||||
}
|
||||
|
||||
export class ApplicationView extends WebDirective {
|
||||
constructor() {
|
||||
super();
|
||||
this.template = template;
|
||||
this.controller = ApplicationViewCtrl;
|
||||
this.replace = true;
|
||||
this.controllerAs = 'self';
|
||||
this.bindToController = true;
|
||||
this.scope = {
|
||||
application: '='
|
||||
};
|
||||
}
|
||||
}
|
||||
Reference in New Issue
Block a user