Fixes and improvements related to components
This commit is contained in:
@@ -8,7 +8,7 @@ export function infiniteScroll() {
|
|||||||
const element = elem[0];
|
const element = elem[0];
|
||||||
scopeAny.paginate = debounce(() => {
|
scopeAny.paginate = debounce(() => {
|
||||||
scope.$apply(attrs.infiniteScroll);
|
scope.$apply(attrs.infiniteScroll);
|
||||||
}, 100);
|
}, 10);
|
||||||
scopeAny.onScroll = () => {
|
scopeAny.onScroll = () => {
|
||||||
if (
|
if (
|
||||||
scope.$eval(attrs.canLoad) &&
|
scope.$eval(attrs.canLoad) &&
|
||||||
|
|||||||
@@ -1,10 +1,10 @@
|
|||||||
import { WebApplication } from '@/ui_models/application';
|
import { WebApplication } from '@/ui_models/application';
|
||||||
import { SNComponent } from 'snjs';
|
import { SNComponent, LiveItem } from 'snjs';
|
||||||
import { WebDirective } from './../../types';
|
import { WebDirective } from './../../types';
|
||||||
import template from '%/directives/component-modal.pug';
|
import template from '%/directives/component-modal.pug';
|
||||||
|
|
||||||
type ComponentModalScope = {
|
export type ComponentModalScope = {
|
||||||
component: SNComponent
|
componentUuid: string
|
||||||
callback: () => void
|
callback: () => void
|
||||||
onDismiss: (component: SNComponent) => void
|
onDismiss: (component: SNComponent) => void
|
||||||
application: WebApplication
|
application: WebApplication
|
||||||
@@ -12,16 +12,34 @@ type ComponentModalScope = {
|
|||||||
|
|
||||||
export class ComponentModalCtrl implements ComponentModalScope {
|
export class ComponentModalCtrl implements ComponentModalScope {
|
||||||
$element: JQLite
|
$element: JQLite
|
||||||
component!: SNComponent
|
componentUuid!: string
|
||||||
callback!: () => void
|
callback!: () => void
|
||||||
onDismiss!: (component: SNComponent) => void
|
onDismiss!: (component: SNComponent) => void
|
||||||
application!: WebApplication
|
application!: WebApplication
|
||||||
|
liveComponent!: LiveItem<SNComponent>
|
||||||
|
component!: SNComponent
|
||||||
|
|
||||||
/* @ngInject */
|
/* @ngInject */
|
||||||
constructor($element: JQLite) {
|
constructor($element: JQLite) {
|
||||||
this.$element = $element;
|
this.$element = $element;
|
||||||
}
|
}
|
||||||
|
|
||||||
|
$onInit() {
|
||||||
|
this.liveComponent = new LiveItem(
|
||||||
|
this.componentUuid,
|
||||||
|
this.application,
|
||||||
|
(component) => {
|
||||||
|
this.component = component;
|
||||||
|
}
|
||||||
|
);
|
||||||
|
this.application.componentGroup.activateComponent(this.component);
|
||||||
|
}
|
||||||
|
|
||||||
|
$onDestroy() {
|
||||||
|
this.application.componentGroup.deactivateComponent(this.component);
|
||||||
|
this.liveComponent.deinit();
|
||||||
|
}
|
||||||
|
|
||||||
dismiss() {
|
dismiss() {
|
||||||
this.onDismiss && this.onDismiss(this.component);
|
this.onDismiss && this.onDismiss(this.component);
|
||||||
this.callback && this.callback();
|
this.callback && this.callback();
|
||||||
@@ -41,7 +59,7 @@ export class ComponentModal extends WebDirective {
|
|||||||
this.controllerAs = 'ctrl';
|
this.controllerAs = 'ctrl';
|
||||||
this.bindToController = true;
|
this.bindToController = true;
|
||||||
this.scope = {
|
this.scope = {
|
||||||
component: '=',
|
componentUuid: '=',
|
||||||
callback: '=',
|
callback: '=',
|
||||||
onDismiss: '&',
|
onDismiss: '&',
|
||||||
application: '='
|
application: '='
|
||||||
|
|||||||
@@ -30,7 +30,6 @@ class ComponentViewCtrl implements ComponentViewScope {
|
|||||||
private cleanUpOn: () => void
|
private cleanUpOn: () => void
|
||||||
private unregisterComponentHandler!: () => void
|
private unregisterComponentHandler!: () => void
|
||||||
private unregisterDesktopObserver!: () => void
|
private unregisterDesktopObserver!: () => void
|
||||||
private didRegisterObservers = false
|
|
||||||
private issueLoading = false
|
private issueLoading = false
|
||||||
public reloading = false
|
public reloading = false
|
||||||
private expired = false
|
private expired = false
|
||||||
@@ -74,7 +73,6 @@ class ComponentViewCtrl implements ComponentViewScope {
|
|||||||
|
|
||||||
$onInit() {
|
$onInit() {
|
||||||
this.liveComponent = new LiveItem(this.componentUuid, this.application);
|
this.liveComponent = new LiveItem(this.componentUuid, this.application);
|
||||||
this.loadComponent();
|
|
||||||
this.registerComponentHandlers();
|
this.registerComponentHandlers();
|
||||||
this.registerPackageUpdateObserver();
|
this.registerPackageUpdateObserver();
|
||||||
}
|
}
|
||||||
@@ -83,6 +81,13 @@ class ComponentViewCtrl implements ComponentViewScope {
|
|||||||
return this.liveComponent?.item;
|
return this.liveComponent?.item;
|
||||||
}
|
}
|
||||||
|
|
||||||
|
public onIframeInit() {
|
||||||
|
/** Perform in timeout required so that dynamic iframe id is set (based on ctrl values) */
|
||||||
|
this.$timeout(() => {
|
||||||
|
this.loadComponent();
|
||||||
|
});
|
||||||
|
}
|
||||||
|
|
||||||
private loadComponent() {
|
private loadComponent() {
|
||||||
if (!this.component) {
|
if (!this.component) {
|
||||||
throw 'Component view is missing component';
|
throw 'Component view is missing component';
|
||||||
@@ -91,7 +96,7 @@ class ComponentViewCtrl implements ComponentViewScope {
|
|||||||
throw 'Component view component must be active';
|
throw 'Component view component must be active';
|
||||||
}
|
}
|
||||||
const iframe = this.application.componentManager!.iframeForComponent(
|
const iframe = this.application.componentManager!.iframeForComponent(
|
||||||
this.component
|
this.componentUuid
|
||||||
);
|
);
|
||||||
if (!iframe) {
|
if (!iframe) {
|
||||||
return;
|
return;
|
||||||
@@ -103,7 +108,8 @@ class ComponentViewCtrl implements ComponentViewScope {
|
|||||||
this.loadTimeout = this.$timeout(() => {
|
this.loadTimeout = this.$timeout(() => {
|
||||||
this.handleIframeLoadTimeout();
|
this.handleIframeLoadTimeout();
|
||||||
}, MaxLoadThreshold);
|
}, MaxLoadThreshold);
|
||||||
iframe.onload = (event) => {
|
iframe.onload = () => {
|
||||||
|
this.reloadStatus();
|
||||||
this.handleIframeLoad(iframe);
|
this.handleIframeLoad(iframe);
|
||||||
};
|
};
|
||||||
}
|
}
|
||||||
@@ -111,8 +117,8 @@ class ComponentViewCtrl implements ComponentViewScope {
|
|||||||
private registerPackageUpdateObserver() {
|
private registerPackageUpdateObserver() {
|
||||||
this.unregisterDesktopObserver = this.application.getDesktopService()
|
this.unregisterDesktopObserver = this.application.getDesktopService()
|
||||||
.registerUpdateObserver((component: SNComponent) => {
|
.registerUpdateObserver((component: SNComponent) => {
|
||||||
if (component === this.component && component.active) {
|
if (component.uuid === this.component.uuid && component.active) {
|
||||||
this.reloadComponent();
|
this.reloadIframe();
|
||||||
}
|
}
|
||||||
});
|
});
|
||||||
}
|
}
|
||||||
@@ -129,25 +135,26 @@ class ComponentViewCtrl implements ComponentViewScope {
|
|||||||
});
|
});
|
||||||
}
|
}
|
||||||
|
|
||||||
|
private reloadIframe() {
|
||||||
|
this.$timeout(() => {
|
||||||
|
this.reloading = true;
|
||||||
|
this.$timeout(() => {
|
||||||
|
this.reloading = false;
|
||||||
|
});
|
||||||
|
})
|
||||||
|
}
|
||||||
|
|
||||||
private onVisibilityChange() {
|
private onVisibilityChange() {
|
||||||
if (document.visibilityState === 'hidden') {
|
if (document.visibilityState === 'hidden') {
|
||||||
return;
|
return;
|
||||||
}
|
}
|
||||||
if (this.issueLoading) {
|
if (this.issueLoading) {
|
||||||
this.reloadComponent();
|
this.reloadIframe();
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
public async reloadComponent() {
|
|
||||||
this.componentValid = false;
|
|
||||||
await this.application.componentManager!.reloadComponent(this.component);
|
|
||||||
this.reloadStatus();
|
|
||||||
}
|
|
||||||
|
|
||||||
public reloadStatus(doManualReload = true) {
|
public reloadStatus(doManualReload = true) {
|
||||||
this.reloading = true;
|
|
||||||
const component = this.component;
|
const component = this.component;
|
||||||
const previouslyValid = this.componentValid;
|
|
||||||
const offlineRestricted = component.offlineOnly && !isDesktopApplication();
|
const offlineRestricted = component.offlineOnly && !isDesktopApplication();
|
||||||
const hasUrlError = function () {
|
const hasUrlError = function () {
|
||||||
if (isDesktopApplication()) {
|
if (isDesktopApplication()) {
|
||||||
@@ -157,9 +164,11 @@ class ComponentViewCtrl implements ComponentViewScope {
|
|||||||
}
|
}
|
||||||
}();
|
}();
|
||||||
this.expired = component.valid_until && component.valid_until <= new Date();
|
this.expired = component.valid_until && component.valid_until <= new Date();
|
||||||
const readonlyState = this.application.componentManager!.getReadonlyStateForComponent(component);
|
const readonlyState = this.application.componentManager!
|
||||||
|
.getReadonlyStateForComponent(component);
|
||||||
if (!readonlyState.lockReadonly) {
|
if (!readonlyState.lockReadonly) {
|
||||||
this.application.componentManager!.setReadonlyStateForComponent(component, true);
|
this.application.componentManager!
|
||||||
|
.setReadonlyStateForComponent(component, this.expired);
|
||||||
}
|
}
|
||||||
this.componentValid = !offlineRestricted && !hasUrlError;
|
this.componentValid = !offlineRestricted && !hasUrlError;
|
||||||
if (!this.componentValid) {
|
if (!this.componentValid) {
|
||||||
@@ -172,17 +181,9 @@ class ComponentViewCtrl implements ComponentViewScope {
|
|||||||
} else {
|
} else {
|
||||||
this.error = undefined;
|
this.error = undefined;
|
||||||
}
|
}
|
||||||
if (this.componentValid !== previouslyValid) {
|
|
||||||
if (this.componentValid) {
|
|
||||||
this.application.componentManager!.reloadComponent(component);
|
|
||||||
}
|
|
||||||
}
|
|
||||||
if (this.expired && doManualReload) {
|
if (this.expired && doManualReload) {
|
||||||
this.$rootScope.$broadcast('reload-ext-dat');
|
this.$rootScope.$broadcast('reload-ext-dat');
|
||||||
}
|
}
|
||||||
this.$timeout(() => {
|
|
||||||
this.reloading = false;
|
|
||||||
}, 500);
|
|
||||||
}
|
}
|
||||||
|
|
||||||
private async handleIframeLoadTimeout() {
|
private async handleIframeLoadTimeout() {
|
||||||
@@ -191,7 +192,7 @@ class ComponentViewCtrl implements ComponentViewScope {
|
|||||||
this.issueLoading = true;
|
this.issueLoading = true;
|
||||||
if (!this.didAttemptReload) {
|
if (!this.didAttemptReload) {
|
||||||
this.didAttemptReload = true;
|
this.didAttemptReload = true;
|
||||||
this.reloadComponent();
|
this.reloadIframe();
|
||||||
} else {
|
} else {
|
||||||
document.addEventListener(
|
document.addEventListener(
|
||||||
VisibilityChangeKey,
|
VisibilityChangeKey,
|
||||||
|
|||||||
@@ -1,4 +1,4 @@
|
|||||||
import { isDesktopApplication, dictToArray } from '@/utils';
|
import { isDesktopApplication } from '@/utils';
|
||||||
import {
|
import {
|
||||||
SNPredicate,
|
SNPredicate,
|
||||||
ContentType,
|
ContentType,
|
||||||
@@ -7,7 +7,8 @@ import {
|
|||||||
ComponentAction,
|
ComponentAction,
|
||||||
FillItemContent,
|
FillItemContent,
|
||||||
ComponentMutator,
|
ComponentMutator,
|
||||||
Copy
|
Copy,
|
||||||
|
dictToArray
|
||||||
} from 'snjs';
|
} from 'snjs';
|
||||||
import { PayloadContent } from '@/../../../../snjs/dist/@types/protocol/payloads/generator';
|
import { PayloadContent } from '@/../../../../snjs/dist/@types/protocol/payloads/generator';
|
||||||
import { ComponentPermission } from '@/../../../../snjs/dist/@types/models/app/component';
|
import { ComponentPermission } from '@/../../../../snjs/dist/@types/models/app/component';
|
||||||
|
|||||||
@@ -92,7 +92,7 @@ export class ThemeManager extends ApplicationService {
|
|||||||
const activeThemes = this.application!.componentManager!.getActiveThemes();
|
const activeThemes = this.application!.componentManager!.getActiveThemes();
|
||||||
for (const theme of activeThemes) {
|
for (const theme of activeThemes) {
|
||||||
if (theme) {
|
if (theme) {
|
||||||
this.application!.componentManager!.deregisterComponent(theme);
|
this.application!.componentManager!.deregisterComponent(theme.uuid);
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
this.activeThemes = [];
|
this.activeThemes = [];
|
||||||
|
|||||||
@@ -27,10 +27,6 @@ export interface PermissionsModalScope extends Partial<ng.IScope> {
|
|||||||
callback: (approved: boolean) => void
|
callback: (approved: boolean) => void
|
||||||
}
|
}
|
||||||
|
|
||||||
export interface ModalComponentScope extends Partial<ng.IScope> {
|
|
||||||
component: SNComponent
|
|
||||||
}
|
|
||||||
|
|
||||||
export type PanelPuppet = {
|
export type PanelPuppet = {
|
||||||
onReady?: () => void
|
onReady?: () => void
|
||||||
ready?: boolean
|
ready?: boolean
|
||||||
|
|||||||
@@ -1,6 +1,6 @@
|
|||||||
import { dictToArray } from '../utils';
|
import { SNComponent, ComponentArea, removeFromArray, addIfUnique } from 'snjs';
|
||||||
import { SNComponent, ComponentArea, removeFromArray } from 'snjs';
|
|
||||||
import { WebApplication } from './application';
|
import { WebApplication } from './application';
|
||||||
|
import { UuidString } from '@/../../../../snjs/dist/@types/types';
|
||||||
|
|
||||||
/** Areas that only allow a single component to be active */
|
/** Areas that only allow a single component to be active */
|
||||||
const SingleComponentAreas = [
|
const SingleComponentAreas = [
|
||||||
@@ -13,7 +13,7 @@ export class ComponentGroup {
|
|||||||
|
|
||||||
private application: WebApplication
|
private application: WebApplication
|
||||||
changeObservers: any[] = []
|
changeObservers: any[] = []
|
||||||
activeComponents: Partial<Record<string, SNComponent>> = {}
|
activeComponents: UuidString[] = []
|
||||||
|
|
||||||
|
|
||||||
constructor(application: WebApplication) {
|
constructor(application: WebApplication) {
|
||||||
@@ -27,12 +27,12 @@ export class ComponentGroup {
|
|||||||
public deinit() {
|
public deinit() {
|
||||||
(this.application as any) = undefined;
|
(this.application as any) = undefined;
|
||||||
for (const component of this.allActiveComponents()) {
|
for (const component of this.allActiveComponents()) {
|
||||||
this.componentManager.deregisterComponent(component);
|
this.componentManager.deregisterComponent(component.uuid);
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
async activateComponent(component: SNComponent) {
|
async activateComponent(component: SNComponent) {
|
||||||
if (this.activeComponents[component.uuid]) {
|
if (this.activeComponents.includes(component.uuid)) {
|
||||||
return;
|
return;
|
||||||
}
|
}
|
||||||
if (SingleComponentAreas.includes(component.area)) {
|
if (SingleComponentAreas.includes(component.area)) {
|
||||||
@@ -41,17 +41,17 @@ export class ComponentGroup {
|
|||||||
await this.deactivateComponent(currentActive, false);
|
await this.deactivateComponent(currentActive, false);
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
this.activeComponents[component.uuid] = component;
|
addIfUnique(this.activeComponents, component.uuid);
|
||||||
await this.componentManager.activateComponent(component);
|
await this.componentManager.activateComponent(component.uuid);
|
||||||
this.notifyObservers();
|
this.notifyObservers();
|
||||||
}
|
}
|
||||||
|
|
||||||
async deactivateComponent(component: SNComponent, notify = true) {
|
async deactivateComponent(component: SNComponent, notify = true) {
|
||||||
if (!this.activeComponents[component.uuid]) {
|
if (!this.activeComponents.includes(component.uuid)) {
|
||||||
return;
|
return;
|
||||||
}
|
}
|
||||||
delete this.activeComponents[component.uuid];
|
removeFromArray(this.activeComponents, component.uuid);
|
||||||
await this.componentManager.deactivateComponent(component);
|
await this.componentManager.deactivateComponent(component.uuid);
|
||||||
if(notify) {
|
if(notify) {
|
||||||
this.notifyObservers();
|
this.notifyObservers();
|
||||||
}
|
}
|
||||||
@@ -69,8 +69,7 @@ export class ComponentGroup {
|
|||||||
}
|
}
|
||||||
|
|
||||||
activeComponentsForArea(area: ComponentArea) {
|
activeComponentsForArea(area: ComponentArea) {
|
||||||
const all = dictToArray(this.activeComponents);
|
return this.allActiveComponents().filter((c) => c.area === area);
|
||||||
return all.filter((c) => c.area === area);
|
|
||||||
}
|
}
|
||||||
|
|
||||||
allComponentsForArea(area: ComponentArea) {
|
allComponentsForArea(area: ComponentArea) {
|
||||||
@@ -78,7 +77,7 @@ export class ComponentGroup {
|
|||||||
}
|
}
|
||||||
|
|
||||||
private allActiveComponents() {
|
private allActiveComponents() {
|
||||||
return dictToArray(this.activeComponents);
|
return this.application.getAll(this.activeComponents) as SNComponent[];
|
||||||
}
|
}
|
||||||
|
|
||||||
|
|
||||||
|
|||||||
@@ -11,10 +11,6 @@ export function isNullOrUndefined(value: any) {
|
|||||||
return value === null || value === undefined;
|
return value === null || value === undefined;
|
||||||
}
|
}
|
||||||
|
|
||||||
export function dictToArray<T>(dict: Record<any, T>) {
|
|
||||||
return Object.keys(dict).map((key) => dict[key]!);
|
|
||||||
}
|
|
||||||
|
|
||||||
export function getPlatformString() {
|
export function getPlatformString() {
|
||||||
try {
|
try {
|
||||||
const platform = navigator.platform.toLowerCase();
|
const platform = navigator.platform.toLowerCase();
|
||||||
|
|||||||
@@ -7,7 +7,7 @@ export type CtrlProps = Partial<Record<string, any>>
|
|||||||
export class PureViewCtrl {
|
export class PureViewCtrl {
|
||||||
$timeout: ng.ITimeoutService
|
$timeout: ng.ITimeoutService
|
||||||
/** Passed through templates */
|
/** Passed through templates */
|
||||||
application?: WebApplication
|
application!: WebApplication
|
||||||
props: CtrlProps = {}
|
props: CtrlProps = {}
|
||||||
state: CtrlState = {}
|
state: CtrlState = {}
|
||||||
private unsubApp: any
|
private unsubApp: any
|
||||||
@@ -33,7 +33,7 @@ export class PureViewCtrl {
|
|||||||
this.unsubState();
|
this.unsubState();
|
||||||
this.unsubApp = undefined;
|
this.unsubApp = undefined;
|
||||||
this.unsubState = undefined;
|
this.unsubState = undefined;
|
||||||
this.application = undefined;
|
(this.application as any) = undefined;
|
||||||
if (this.stateTimeout) {
|
if (this.stateTimeout) {
|
||||||
this.$timeout.cancel(this.stateTimeout);
|
this.$timeout.cancel(this.stateTimeout);
|
||||||
}
|
}
|
||||||
|
|||||||
@@ -1,4 +1,5 @@
|
|||||||
import { WebDirective, PermissionsModalScope, ModalComponentScope } from '@/types';
|
import { ComponentModalScope } from './../../directives/views/componentModal';
|
||||||
|
import { WebDirective, PermissionsModalScope } from '@/types';
|
||||||
import { getPlatformString } from '@/utils';
|
import { getPlatformString } from '@/utils';
|
||||||
import template from './application-view.pug';
|
import template from './application-view.pug';
|
||||||
import { AppStateEvent } from '@/services/state';
|
import { AppStateEvent } from '@/services/state';
|
||||||
@@ -52,7 +53,7 @@ class ApplicationViewCtrl extends PureViewCtrl {
|
|||||||
this.$location = undefined;
|
this.$location = undefined;
|
||||||
this.$rootScope = undefined;
|
this.$rootScope = undefined;
|
||||||
this.$compile = undefined;
|
this.$compile = undefined;
|
||||||
this.application = undefined;
|
(this.application as any) = undefined;
|
||||||
window.removeEventListener('dragover', this.onDragOver, true);
|
window.removeEventListener('dragover', this.onDragOver, true);
|
||||||
window.removeEventListener('drop', this.onDragDrop, true);
|
window.removeEventListener('drop', this.onDragDrop, true);
|
||||||
(this.onDragDrop as any) = undefined;
|
(this.onDragDrop as any) = undefined;
|
||||||
@@ -219,10 +220,12 @@ class ApplicationViewCtrl extends PureViewCtrl {
|
|||||||
}
|
}
|
||||||
|
|
||||||
openModalComponent(component: SNComponent) {
|
openModalComponent(component: SNComponent) {
|
||||||
const scope = this.$rootScope!.$new(true) as ModalComponentScope;
|
const scope = this.$rootScope!.$new(true) as Partial<ComponentModalScope>;
|
||||||
scope.component = component;
|
scope.componentUuid = component.uuid;
|
||||||
|
scope.application = this.application;
|
||||||
const el = this.$compile!(
|
const el = this.$compile!(
|
||||||
"<component-modal component='component' class='sk-modal'></component-modal>"
|
"<component-modal application='application' component-uuid='componentUuid' "
|
||||||
|
+ "class='sk-modal'></component-modal>"
|
||||||
)(scope as any);
|
)(scope as any);
|
||||||
angular.element(document.body).append(el);
|
angular.element(document.body).append(el);
|
||||||
}
|
}
|
||||||
|
|||||||
@@ -1111,7 +1111,7 @@ class EditorViewCtrl extends PureViewCtrl implements EditorViewScope {
|
|||||||
this.application.componentManager!.setComponentHidden(component, false);
|
this.application.componentManager!.setComponentHidden(component, false);
|
||||||
await this.associateComponentWithCurrentNote(component);
|
await this.associateComponentWithCurrentNote(component);
|
||||||
if (!component.active) {
|
if (!component.active) {
|
||||||
this.application.componentManager!.activateComponent(component);
|
this.application.componentManager!.activateComponent(component.uuid);
|
||||||
}
|
}
|
||||||
this.application.componentManager!.contextItemDidChangeInArea(ComponentArea.EditorStack);
|
this.application.componentManager!.contextItemDidChangeInArea(ComponentArea.EditorStack);
|
||||||
} else {
|
} else {
|
||||||
|
|||||||
@@ -30,9 +30,9 @@
|
|||||||
.sk-app-bar-item-column(ng-click='ctrl.selectRoom(room)')
|
.sk-app-bar-item-column(ng-click='ctrl.selectRoom(room)')
|
||||||
.sk-label {{room.name}}
|
.sk-label {{room.name}}
|
||||||
component-modal(
|
component-modal(
|
||||||
component='room',
|
component-uuid='room.uuid',
|
||||||
ng-if='ctrl.roomShowState[room.uuid]',
|
ng-if='ctrl.roomShowState[room.uuid]',
|
||||||
on-dismiss='ctrl.onRoomDismiss()',
|
on-dismiss='ctrl.onRoomDismiss(room)',
|
||||||
application='ctrl.application'
|
application='ctrl.application'
|
||||||
)
|
)
|
||||||
.center
|
.center
|
||||||
|
|||||||
@@ -11,6 +11,7 @@
|
|||||||
| {{ctrl.component.name}}
|
| {{ctrl.component.name}}
|
||||||
a.sk-a.info.close-button(ng-click="ctrl.dismiss()") Close
|
a.sk-a.info.close-button(ng-click="ctrl.dismiss()") Close
|
||||||
component-view.component-view(
|
component-view.component-view(
|
||||||
|
ng-if='ctrl.component.active'
|
||||||
component-uuid="ctrl.component.uuid",
|
component-uuid="ctrl.component.uuid",
|
||||||
application='ctrl.application'
|
application='ctrl.application'
|
||||||
)
|
)
|
||||||
|
|||||||
@@ -4,7 +4,7 @@
|
|||||||
.sk-app-bar-item
|
.sk-app-bar-item
|
||||||
.sk-label.warning There was an issue loading {{ctrl.component.name}}.
|
.sk-label.warning There was an issue loading {{ctrl.component.name}}.
|
||||||
.right
|
.right
|
||||||
.sk-app-bar-item(ng-click='ctrl.reloadComponent()')
|
.sk-app-bar-item(ng-click='ctrl.reloadIframe()')
|
||||||
.sk-button.info
|
.sk-button.info
|
||||||
.sk-label Reload
|
.sk-label Reload
|
||||||
.sn-component(ng-if='ctrl.expired')
|
.sn-component(ng-if='ctrl.expired')
|
||||||
@@ -74,10 +74,11 @@
|
|||||||
| version of the app.
|
| version of the app.
|
||||||
| Ensure you are running at least version 2.1 on all platforms.
|
| Ensure you are running at least version 2.1 on all platforms.
|
||||||
iframe(
|
iframe(
|
||||||
data-component-id='{{ctrl.component.uuid}}',
|
data-component-id='{{ctrl.componentUuid}}',
|
||||||
frameborder='0',
|
frameborder='0',
|
||||||
ng-attr-id='component-iframe-{{ctrl.component.uuid}}',
|
ng-init='ctrl.onIframeInit()'
|
||||||
ng-if='ctrl.component && ctrl.componentValid',
|
ng-attr-id='component-iframe-{{ctrl.componentUuid}}',
|
||||||
|
ng-if='ctrl.componentUuid && !ctrl.reloading && ctrl.componentValid',
|
||||||
ng-src='{{ctrl.getUrl() | trusted}}',
|
ng-src='{{ctrl.getUrl() | trusted}}',
|
||||||
sandbox='allow-scripts allow-top-navigation-by-user-activation allow-popups allow-popups-to-escape-sandbox allow-same-origin allow-modals allow-forms'
|
sandbox='allow-scripts allow-top-navigation-by-user-activation allow-popups allow-popups-to-escape-sandbox allow-same-origin allow-modals allow-forms'
|
||||||
)
|
)
|
||||||
|
|||||||
@@ -1,23 +1,26 @@
|
|||||||
/// <reference types="angular" />
|
/// <reference types="angular" />
|
||||||
import { WebApplication } from '@/ui_models/application';
|
import { WebApplication } from '@/ui_models/application';
|
||||||
import { SNComponent } from 'snjs';
|
import { SNComponent, LiveItem } from 'snjs';
|
||||||
import { WebDirective } from './../../types';
|
import { WebDirective } from './../../types';
|
||||||
declare type ComponentModalScope = {
|
export declare type ComponentModalScope = {
|
||||||
component: SNComponent;
|
componentUuid: string;
|
||||||
callback: () => void;
|
callback: () => void;
|
||||||
onDismiss: (component: SNComponent) => void;
|
onDismiss: (component: SNComponent) => void;
|
||||||
application: WebApplication;
|
application: WebApplication;
|
||||||
};
|
};
|
||||||
export declare class ComponentModalCtrl implements ComponentModalScope {
|
export declare class ComponentModalCtrl implements ComponentModalScope {
|
||||||
$element: JQLite;
|
$element: JQLite;
|
||||||
component: SNComponent;
|
componentUuid: string;
|
||||||
callback: () => void;
|
callback: () => void;
|
||||||
onDismiss: (component: SNComponent) => void;
|
onDismiss: (component: SNComponent) => void;
|
||||||
application: WebApplication;
|
application: WebApplication;
|
||||||
|
liveComponent: LiveItem<SNComponent>;
|
||||||
|
component: SNComponent;
|
||||||
constructor($element: JQLite);
|
constructor($element: JQLite);
|
||||||
|
$onInit(): void;
|
||||||
|
$onDestroy(): void;
|
||||||
dismiss(): void;
|
dismiss(): void;
|
||||||
}
|
}
|
||||||
export declare class ComponentModal extends WebDirective {
|
export declare class ComponentModal extends WebDirective {
|
||||||
constructor();
|
constructor();
|
||||||
}
|
}
|
||||||
export {};
|
|
||||||
|
|||||||
@@ -28,9 +28,6 @@ export interface PermissionsModalScope extends Partial<ng.IScope> {
|
|||||||
permissionsString: string;
|
permissionsString: string;
|
||||||
callback: (approved: boolean) => void;
|
callback: (approved: boolean) => void;
|
||||||
}
|
}
|
||||||
export interface ModalComponentScope extends Partial<ng.IScope> {
|
|
||||||
component: SNComponent;
|
|
||||||
}
|
|
||||||
export declare type PanelPuppet = {
|
export declare type PanelPuppet = {
|
||||||
onReady?: () => void;
|
onReady?: () => void;
|
||||||
ready?: boolean;
|
ready?: boolean;
|
||||||
|
|||||||
@@ -1,15 +1,15 @@
|
|||||||
import { SNComponent, ComponentArea } from 'snjs';
|
import { SNComponent, ComponentArea } from 'snjs';
|
||||||
import { WebApplication } from './application';
|
import { WebApplication } from './application';
|
||||||
|
import { UuidString } from '@/../../../../snjs/dist/@types/types';
|
||||||
export declare class ComponentGroup {
|
export declare class ComponentGroup {
|
||||||
private application;
|
private application;
|
||||||
changeObservers: any[];
|
changeObservers: any[];
|
||||||
activeComponents: Partial<Record<string, SNComponent>>;
|
activeComponents: UuidString[];
|
||||||
constructor(application: WebApplication);
|
constructor(application: WebApplication);
|
||||||
get componentManager(): import("../../../../../snjs/dist/@types").SNComponentManager;
|
get componentManager(): import("../../../../../snjs/dist/@types").SNComponentManager;
|
||||||
deinit(): void;
|
deinit(): void;
|
||||||
registerComponentHandler(): void;
|
|
||||||
activateComponent(component: SNComponent): Promise<void>;
|
activateComponent(component: SNComponent): Promise<void>;
|
||||||
deactivateComponent(component: SNComponent): Promise<void>;
|
deactivateComponent(component: SNComponent, notify?: boolean): Promise<void>;
|
||||||
deactivateComponentForArea(area: ComponentArea): Promise<void>;
|
deactivateComponentForArea(area: ComponentArea): Promise<void>;
|
||||||
activeComponentForArea(area: ComponentArea): SNComponent;
|
activeComponentForArea(area: ComponentArea): SNComponent;
|
||||||
activeComponentsForArea(area: ComponentArea): SNComponent[];
|
activeComponentsForArea(area: ComponentArea): SNComponent[];
|
||||||
@@ -18,6 +18,6 @@ export declare class ComponentGroup {
|
|||||||
/**
|
/**
|
||||||
* Notifies observer when the active editor has changed.
|
* Notifies observer when the active editor has changed.
|
||||||
*/
|
*/
|
||||||
addChangeObserver(callback: any): void;
|
addChangeObserver(callback: () => void): () => void;
|
||||||
private notifyObservers;
|
private notifyObservers;
|
||||||
}
|
}
|
||||||
|
|||||||
@@ -1,6 +1,5 @@
|
|||||||
export declare function getParameterByName(name: string, url: string): string | null;
|
export declare function getParameterByName(name: string, url: string): string | null;
|
||||||
export declare function isNullOrUndefined(value: any): boolean;
|
export declare function isNullOrUndefined(value: any): boolean;
|
||||||
export declare function dictToArray<T>(dict: Record<any, T>): NonNullable<T>[];
|
|
||||||
export declare function getPlatformString(): string;
|
export declare function getPlatformString(): string;
|
||||||
export declare function dateToLocalizedString(date: Date): string;
|
export declare function dateToLocalizedString(date: Date): string;
|
||||||
/** Via https://davidwalsh.name/javascript-debounce-function */
|
/** Via https://davidwalsh.name/javascript-debounce-function */
|
||||||
|
|||||||
@@ -6,7 +6,7 @@ export declare type CtrlProps = Partial<Record<string, any>>;
|
|||||||
export declare class PureViewCtrl {
|
export declare class PureViewCtrl {
|
||||||
$timeout: ng.ITimeoutService;
|
$timeout: ng.ITimeoutService;
|
||||||
/** Passed through templates */
|
/** Passed through templates */
|
||||||
application?: WebApplication;
|
application: WebApplication;
|
||||||
props: CtrlProps;
|
props: CtrlProps;
|
||||||
state: CtrlState;
|
state: CtrlState;
|
||||||
private unsubApp;
|
private unsubApp;
|
||||||
|
|||||||
355
dist/javascripts/app.js
vendored
355
dist/javascripts/app.js
vendored
File diff suppressed because one or more lines are too long
2
dist/javascripts/app.js.map
vendored
2
dist/javascripts/app.js.map
vendored
File diff suppressed because one or more lines are too long
Reference in New Issue
Block a user