@flexem/fc-gui 3.0.0-alpha.9 → 3.0.0-alpha.91

package/gui/gui-host.js

@@ -1,173 +0,0 @@
-import { LOGGER_SERVICE_TOKEN } from '../logger';
-import { ConfigIsEmptyError } from '../shared';
-import { ViewService } from '../view/view.service';
-import { GuiView } from './gui-view';
-import { map } from 'rxjs/operators';
-export class GuiHost {
-    constructor(injector, bsModalService, context, guiOptions, el) {
-        this.injector = injector;
-        this.bsModalService = bsModalService;
-        this.context = context;
-        this.guiOptions = guiOptions;
-        this.el = el;
-        this.logger = injector.get(LOGGER_SERVICE_TOKEN);
-        const toggleViewFunc = (viewIndex, parentContainerId, baseEl) => {
-            this.currentViewIndex = viewIndex;
-            return this.context.configStore.viewStore.getViewConfig(viewIndex).pipe(map(config => {
-                if (this.currentViewIndex !== viewIndex) {
-                    return;
-                }
-                if (!config || !config.config || !config.config.length) {
-                    throw new ConfigIsEmptyError();
-                }
-                if (this.currentView) {
-                    this.currentView.dispose();
-                }
-                this.currentView = new GuiView(this.injector, this.bsModalService, this.context);
-                const hostGuiOptions = {
-                    svgRootClass: this.guiOptions.svgRootClass,
-                    hostContainerId: parentContainerId,
-                    el: baseEl
-                };
-                this.currentView.load(config, hostGuiOptions);
-                this.currentView.resize(this.currentViewSize, this.currentViewReiszeMode, this.guiOptions.svgRootClass);
-                this.containerEl = $(baseEl.nativeElement).find(`div#${parentContainerId}`).first();
-                this.containerEl.empty();
-                this.containerEl.append(this.currentView.element);
-                this.logger.debug(`[GUI] Toggle View(${viewIndex}) successed.`);
-            }));
-        };
-        injector.get(ViewService).toggleViews.set(el, toggleViewFunc);
-    }
-    get element() {
-        if (this.containerEl) {
-            return this.containerEl[0];
-        }
-        else {
-            throw new Error('Gui Host not loaded yet.');
-        }
-    }
-    /**
-     * Load gui host and main view.
-     */
-    load(configureViewId) {
-        if (this.isLoaded) {
-            throw new Error('The GuiHost already loaded.');
-        }
-        this.isLoaded = true;
-        this.containerEl = $(`<div class="svg-content" id= "${this.guiOptions.hostContainerId}" style="display:flex;position:relative;"></div>`);
-        const result = new Promise((resolve, reject) => {
-            if (configureViewId && configureViewId !== 0) {
-                this.loadViewConfigByConfigureViewId(resolve, reject, configureViewId);
-            }
-            else {
-                this.loadMainViewConfig(resolve, reject);
-            }
-        });
-        return result;
-    }
-    loadByConfigureViewCode(configureViewCode) {
-        if (this.isLoaded) {
-            throw new Error('The GuiHost already loaded.');
-        }
-        this.isLoaded = true;
-        this.containerEl = $(`<div class="svg-content" id= "${this.guiOptions.hostContainerId}" style="display: inline-block;position: relative;"></div>`);
-        const result = new Promise((resolve, reject) => {
-            if (configureViewCode) {
-                this.loadViewConfigByConfigureViewCode(resolve, reject, configureViewCode);
-            }
-            else {
-                this.loadMainViewConfig(resolve, reject);
-            }
-        });
-        return result;
-    }
-    loadMainViewConfig(resolve, reject) {
-        this.context.configStore.viewStore.getMainViewConfig().subscribe(config => {
-            if (config.config && config.config.length) {
-                this.currentView = new GuiView(this.injector, this.bsModalService, this.context);
-                this.currentView.load(config, this.guiOptions);
-                this.containerEl.empty();
-                this.containerEl.append(this.currentView.element);
-                resolve(this);
-                this.logger.debug('[GUI] Host loaded.');
-            }
-            else {
-                reject(new ConfigIsEmptyError());
-            }
-        }, error => {
-            this.logger.error('[GUI] Load failed: ' + error.stack);
-            reject(error);
-        });
-    }
-    loadViewConfigByConfigureViewId(resolve, reject, configureViewId) {
-        this.context.configStore.viewStore.getViewConfigByConfigureViewId(configureViewId).subscribe(config => {
-            this.handleViewConfigCallback(resolve, reject, config);
-        }, error => {
-            this.logger.error('[GUI] Load failed: ' + error.stack);
-            reject(error);
-        });
-    }
-    loadViewConfigByConfigureViewCode(resolve, reject, configureViewCode) {
-        this.context.configStore.viewStore.getViewConfigByConfigureViewCode(configureViewCode).subscribe(config => {
-            this.handleViewConfigCallback(resolve, reject, config);
-        }, error => {
-            this.logger.error('[GUI] Load failed: ' + error.stack);
-            reject(error);
-        });
-    }
-    handleViewConfigCallback(resolve, reject, config) {
-        if (!config.config || !config.config.length) {
-            reject(new ConfigIsEmptyError());
-        }
-        this.currentView = new GuiView(this.injector, this.bsModalService, this.context);
-        this.currentView.load(config, this.guiOptions);
-        this.containerEl.empty();
-        this.containerEl.append(this.currentView.element);
-        resolve(this);
-        this.logger.debug('[GUI] Host loaded.');
-    }
-    /**
-     * Resize current view
-     * @param size : target view size
-     * @param resizeMode : target resize mode
-     */
-    resizeView(size, resizeMode) {
-        if (this.currentView) {
-            this.currentView.resize(size, resizeMode, this.guiOptions.svgRootClass);
-            this.currentViewSize = size;
-            this.currentViewReiszeMode = resizeMode;
-        }
-    }
-    /**
-     * Update current view size;
-     * @param size : target view size
-     */
-    updateViewSize(size) {
-        if (!this.currentView) {
-            return;
-        }
-        this.currentView.resize(size, this.currentViewReiszeMode, this.guiOptions.svgRootClass);
-        this.currentViewSize = size;
-    }
-    /**
-     * Resize current view
-     * @param size : target view size
-     * @param resizeMode : target resize mode
-     */
-    updateViewResizeMode(resizeMode) {
-        if (this.currentView) {
-            this.currentView.resize(this.currentViewSize, resizeMode, this.guiOptions.svgRootClass);
-            this.currentViewReiszeMode = resizeMode;
-        }
-    }
-    dispose() {
-        if (this.currentView) {
-            this.currentView.dispose();
-        }
-        if (this.context) {
-            this.context.dispose();
-        }
-        this.logger.debug('[GUI] GuiHost disposed.');
-    }
-}

package/gui/gui-host.metadata.json

@@ -1 +0,0 @@
-[{"__symbolic":"module","version":4,"metadata":{"GuiHost":{"__symbolic":"class","members":{"__ctor__":[{"__symbolic":"constructor","parameters":[{"__symbolic":"reference","module":"@angular/core","name":"Injector","line":23,"character":43},{"__symbolic":"reference","module":"ngx-bootstrap/modal","name":"BsModalService","line":23,"character":86},{"__symbolic":"reference","module":"./gui-context","name":"GuiContext","line":23,"character":120},{"__symbolic":"reference","module":"./interfaces/gui-options","name":"GuiOptions","line":24,"character":37},{"__symbolic":"reference","module":"@angular/core","name":"ElementRef","line":24,"character":62}]}],"load":[{"__symbolic":"method"}],"loadByConfigureViewCode":[{"__symbolic":"method"}],"loadMainViewConfig":[{"__symbolic":"method"}],"loadViewConfigByConfigureViewId":[{"__symbolic":"method"}],"loadViewConfigByConfigureViewCode":[{"__symbolic":"method"}],"handleViewConfigCallback":[{"__symbolic":"method"}],"resizeView":[{"__symbolic":"method"}],"updateViewSize":[{"__symbolic":"method"}],"updateViewResizeMode":[{"__symbolic":"method"}],"dispose":[{"__symbolic":"method"}]}}}}]

package/gui/gui-view.d.ts

@@ -1,42 +0,0 @@
-import { Injector, ElementRef } from '@angular/core';
-import { Observable } from 'rxjs';
-import { BsModalService } from 'ngx-bootstrap/modal';
-import { ViewModel } from '../config';
-import { Size } from '../model';
-import { ViewResizeMode } from '../settings';
-import { PopupViewService } from '../view/popup-view.service';
-import { GuiContext } from './gui-context';
-import { GuiOptions } from './interfaces/gui-options';
-export declare class GuiView implements PopupViewService {
-    private readonly injector;
-    private readonly bsModalService;
-    private readonly context;
-    private readonly parentView?;
-    get element(): HTMLElement;
-    get rawWidth(): number;
-    get rawHeight(): number;
-    private readonly logger;
-    private readonly childViews;
-    private readonly viewId;
-    private mainElement;
-    private muskElement;
-    private openVariableStatesSubscription;
-    private openVariablesSubscription;
-    private openedVariableNames;
-    private perViewVariableCommunicator;
-    private svgRootClass;
-    private isMobileMode;
-    private signalRAppId;
-    constructor(injector: Injector, bsModalService: BsModalService, context: GuiContext, parentView?: GuiView);
-    resize(size: Size, resizeMode: ViewResizeMode, svgRootClass: string): void;
-    load(config: ViewModel, guiOptions: GuiOptions): void;
-    loadElementState(): void;
-    popView(viewIndex: number, hostContainerId: string, el: ElementRef): Observable<void>;
-    closeView(): void;
-    moveView(movementX: number, movementY: number): void;
-    showMusk(): void;
-    showShadow(): void;
-    hideMusk(): void;
-    dispose(): void;
-    private normalOpenedVariableNames;
-}

package/gui/gui-view.js

@@ -1,204 +0,0 @@
-import { LOGGER_SERVICE_TOKEN } from '../logger';
-import * as d3 from 'd3-selection';
-import { each, forEach } from 'lodash';
-import { map } from 'rxjs/operators';
-import { VariableStateEnum } from '../communication';
-import { MainElement } from '../elements/main-element';
-import { PerViewVariableCommunicator } from '../elements/per-view-variable-communicator';
-import { ViewPopupBackdropType, ViewPopupLocationType } from '../model';
-import { ViewResizeMode, DisplayMode, GlobalSettings } from '../settings';
-import { ConfigIsEmptyError } from '../shared';
-import { Guid } from '../utils/guid';
-export class GuiView {
-    constructor(injector, bsModalService, context, parentView) {
-        this.injector = injector;
-        this.bsModalService = bsModalService;
-        this.context = context;
-        this.parentView = parentView;
-        this.viewId = Guid.newGuid().toString('n');
-        this.logger = injector.get(LOGGER_SERVICE_TOKEN);
-        this.childViews = new Array();
-        if (parentView) {
-            parentView.childViews.push(this);
-        }
-        this.isMobileMode = DisplayMode.Mobile === injector.get(GlobalSettings).displayMode;
-        this.signalRAppId = Guid.newGuid().toString('n');
-    }
-    get element() {
-        return this.mainElement.rootElement;
-    }
-    get rawWidth() {
-        return this.mainElement.rawWidth;
-    }
-    get rawHeight() {
-        return this.mainElement.rawHeight;
-    }
-    resize(size, resizeMode, svgRootClass) {
-        if (!size) {
-            return;
-        }
-        if (!size.isReal()) {
-            throw new Error('invalid size.');
-        }
-        switch (resizeMode) {
-            case ViewResizeMode.HorizontalUniform:
-                this.mainElement.horizontalStretch(size);
-                break;
-            default:
-                this.mainElement.uniformStretch(size, svgRootClass);
-                break;
-        }
-    }
-    load(config, guiOptions) {
-        const { context } = this;
-        this.svgRootClass = guiOptions.svgRootClass;
-        this.perViewVariableCommunicator = new PerViewVariableCommunicator(context.variableCommunicator);
-        this.mainElement = new MainElement(this.injector, this.bsModalService, context, this.perViewVariableCommunicator, this, this.signalRAppId);
-        this.mainElement.load(config.config, !!this.parentView, guiOptions);
-        setTimeout(() => {
-            this.loadElementState();
-        }, 0);
-        this.logger.debug('[GUI] View loaded.');
-    }
-    loadElementState() {
-        if (!this.mainElement) {
-            return;
-        }
-        this.mainElement.initElementState();
-        if (this.openVariableStatesSubscription) {
-            this.openVariableStatesSubscription.unsubscribe();
-        }
-        if (this.openVariableStatesSubscription) {
-            this.openVariableStatesSubscription.unsubscribe();
-        }
-        this.openedVariableNames = this.mainElement.getVariableNames();
-        if (this.openedVariableNames.length === 0) {
-            return;
-        }
-        this.openVariableStatesSubscription =
-            this.perViewVariableCommunicator.subscribeVariableStates(this.openedVariableNames).subscribe((states) => {
-                this.mainElement.reportVariableStates(states);
-                const normalVariableNames = [];
-                each(states, v => {
-                    if (v.state === VariableStateEnum.Normal && normalVariableNames.indexOf(v.variableName) === -1) {
-                        normalVariableNames.push(v.variableName);
-                    }
-                });
-                if (normalVariableNames.length > 0) {
-                    this.normalOpenedVariableNames(normalVariableNames);
-                }
-            });
-    }
-    popView(viewIndex, hostContainerId, el) {
-        return this.context.configStore.viewStore.getViewConfig(viewIndex).pipe(map(view => {
-            if (!view.config || !view.config.length) {
-                throw new ConfigIsEmptyError();
-            }
-            const popView = new GuiView(this.injector, this.bsModalService, this.context, this);
-            const guiOptions = {
-                svgRootClass: this.svgRootClass,
-                hostContainerId: hostContainerId,
-                el: el
-            };
-            popView.load(view, guiOptions);
-            const settings = $(popView.element).data('model');
-            if (!settings.popup) {
-                return;
-            }
-            let x, y;
-            if (settings.popup.locationType === ViewPopupLocationType.Custom && settings.popup.location) {
-                x = settings.popup.location.x;
-                y = settings.popup.location.y;
-            }
-            else {
-                x = (this.rawWidth - popView.rawWidth) / 2;
-                y = (this.rawHeight - popView.rawHeight) / 2;
-            }
-            switch (settings.popup.backdropType) {
-                case ViewPopupBackdropType.Shadow:
-                    if (!this.isMobileMode) {
-                        popView.showShadow();
-                    }
-                    break;
-                case ViewPopupBackdropType.Musk:
-                    this.showMusk();
-                    break;
-            }
-            popView.element.setAttribute('x', String(x));
-            popView.element.setAttribute('y', String(y));
-            this.element.appendChild(popView.element);
-        }));
-    }
-    closeView() {
-        if (!this.parentView) {
-            return;
-        }
-        this.parentView.hideMusk();
-        this.dispose();
-        this.element.parentElement.removeChild(this.element);
-    }
-    moveView(movementX, movementY) {
-        const newX = Number(this.element.getAttribute('x')) + movementX;
-        const newY = Number(this.element.getAttribute('y')) + movementY;
-        this.element.setAttributeNS(null, 'x', String(newX));
-        this.element.setAttributeNS(null, 'y', String(newY));
-    }
-    showMusk() {
-        if (!this.muskElement) {
-            this.muskElement = document.createElementNS('http://www.w3.org/2000/svg', 'rect');
-            this.muskElement.setAttribute('width', String(this.rawWidth));
-            this.muskElement.setAttribute('height', String(this.rawHeight));
-            this.muskElement.setAttribute('fill', '#081625');
-            this.muskElement.setAttribute('fill-opacity', '0.4');
-        }
-        this.element.appendChild(this.muskElement);
-    }
-    showShadow() {
-        const filterId = `dropshadow-${this.viewId}`;
-        const filter = d3.select(this.element).append('defs').append('filter').attr('id', filterId)
-            .attr('x', 0).attr('y', 0).attr('color-interpolation-filters', 'sRGB')
-            .attr('filterUnits', 'userSpaceOnUse');
-        const feComponentTransfer = filter.append('feDropShadow');
-        feComponentTransfer.attr('stdDeviation', '6').attr('flood-color', 'rgba(69,65,78,.3)');
-        filter.append('feOffset').attr('dx', 0).attr('dy', 0).attr('result', 'shadow');
-        filter.append('feComposite').attr('in', 'SourceGraphic').attr('in2', 'shadow').attr('operator', 'over');
-        const container = this.element.children[0];
-        if (!container) {
-            return;
-        }
-        container.setAttribute('filter', `url(#${filterId})`);
-        container.setAttribute('x', '6');
-        container.setAttribute('y', '6');
-        $(this.element).children('g').attr('transform', 'matrix(1, 0, 0, 1, 6, 6)');
-    }
-    hideMusk() {
-        if (this.muskElement) {
-            this.element.removeChild(this.muskElement);
-            this.muskElement = null;
-        }
-    }
-    dispose() {
-        if (this.openVariableStatesSubscription) {
-            this.openVariableStatesSubscription.unsubscribe();
-        }
-        if (this.openVariablesSubscription) {
-            this.openVariablesSubscription.unsubscribe();
-        }
-        if (this.perViewVariableCommunicator) {
-            this.perViewVariableCommunicator.dispose();
-        }
-        if (this.childViews && this.childViews.length) {
-            forEach(this.childViews, v => v.dispose());
-        }
-        if (this.mainElement) {
-            this.mainElement.dispose();
-        }
-        this.logger.debug('[GUI] View disposed.');
-    }
-    normalOpenedVariableNames(normalVariableNames) {
-        if (normalVariableNames.length > 0) {
-            this.openVariablesSubscription = this.perViewVariableCommunicator.openVariables(normalVariableNames, this.signalRAppId)
-                .subscribe(variableValues => this.mainElement.reportVariableValues(variableValues));
-        }
-    }
-}

package/gui/gui-view.metadata.json

@@ -1 +0,0 @@
-[{"__symbolic":"module","version":4,"metadata":{"GuiView":{"__symbolic":"class","members":{"__ctor__":[{"__symbolic":"constructor","parameters":[{"__symbolic":"reference","module":"@angular/core","name":"Injector","line":47,"character":43},{"__symbolic":"reference","module":"ngx-bootstrap/modal","name":"BsModalService","line":48,"character":41},{"__symbolic":"reference","module":"./gui-context","name":"GuiContext","line":49,"character":34},{"__symbolic":"reference","name":"GuiView"}]}],"resize":[{"__symbolic":"method"}],"load":[{"__symbolic":"method"}],"loadElementState":[{"__symbolic":"method"}],"popView":[{"__symbolic":"method"}],"closeView":[{"__symbolic":"method"}],"moveView":[{"__symbolic":"method"}],"showMusk":[{"__symbolic":"method"}],"showShadow":[{"__symbolic":"method"}],"hideMusk":[{"__symbolic":"method"}],"dispose":[{"__symbolic":"method"}],"normalOpenedVariableNames":[{"__symbolic":"method"}]}}}}]

package/gui/gui.component.d.ts

@@ -1,42 +0,0 @@
-import { ElementRef, EventEmitter, Injector, OnChanges, OnDestroy, SimpleChange } from '@angular/core';
-import { BsModalService } from 'ngx-bootstrap/modal';
-import { Localization } from '../localization';
-import { Size } from '../model';
-import { GuiContext } from './gui-context';
-export declare class GuiComponent implements OnChanges, OnDestroy {
-    private readonly el;
-    private readonly localization;
-    private readonly injector;
-    private readonly bsModalService;
-    context: GuiContext;
-    size: Size;
-    resizeMode: string;
-    displayMode: string;
-    loadFailed: EventEmitter<Error>;
-    loaded: EventEmitter<any>;
-    startTouch: any;
-    isTouch: boolean;
-    pageX: number;
-    pageY: number;
-    initX: number;
-    initY: number;
-    initWidth: number;
-    initHeight: number;
-    lastScale: number;
-    isMobileMode: boolean;
-    private $svg;
-    private host;
-    private get viewResizeMode();
-    private readonly globalSettings;
-    constructor(el: ElementRef, localization: Localization, injector: Injector, bsModalService: BsModalService);
-    ngOnChanges(changes: {
-        [propKey: string]: SimpleChange;
-    }): void;
-    doubleFingerZooming(): void;
-    getDistance(p1: any, p2: any): number;
-    ngOnDestroy(): void;
-    private onProviderChanged;
-    private onSizeChanged;
-    private onResizeModeChanged;
-    private onDisplayModeChanged;
-}