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

package/elements/alarm/alarm-element.js

@@ -1,382 +0,0 @@
-import * as d3 from 'd3';
-import { ConditionalDisplayElement } from '../base/conditional-display-element';
-import { GetAlarmsArgs } from '../../config';
-import * as moment from 'moment';
-import { LOGGER_SERVICE_TOKEN } from '../../logger';
-import { LOCALIZATION } from '../../localization';
-var AlaertElementStatus;
-(function (AlaertElementStatus) {
-    AlaertElementStatus[AlaertElementStatus["Normal"] = 0] = "Normal";
-    AlaertElementStatus[AlaertElementStatus["Loading"] = 1] = "Loading"; // 加载中
-})(AlaertElementStatus || (AlaertElementStatus = {}));
-export class AlarmElement extends ConditionalDisplayElement {
-    constructor(element, injector, permissionChecker, variableCommunicator, variableStore, alarmsStore, signalRAppId) {
-        var _a;
-        super(element, permissionChecker, variableCommunicator, variableStore, signalRAppId);
-        this.alarmsStore = alarmsStore;
-        this.elementStatus = AlaertElementStatus.Loading;
-        this.displayOption = {
-            dataLimit: 500,
-            dataZoomHeight: 32,
-            marginLeft: 1,
-            marginRight: 20,
-            mobileMinWidth: 450,
-            operationAreaHeight: 32,
-            operationAreaMarginTop: 10,
-            operationSelectFontSize: '16px',
-            operationButtonWidth: 24,
-            operationButtonHeight: 24,
-            operationButtonMargin: 4
-        };
-        this.alarmNames = [];
-        this.alarmList = [];
-        this.currentAlarmList = [];
-        this.page = 0;
-        this.totalCount = 0;
-        this.pageSize = 5;
-        this.rootElement.selectAll('*').remove();
-        this.setStatusAsLoading();
-        this.logger = injector.get(LOGGER_SERVICE_TOKEN);
-        this.localization = injector.get(LOCALIZATION);
-        this.variableCommunicator = variableCommunicator;
-        this.timePeriods = this.getValidTimePeriods();
-        this.pageSize = this.model.generalSetting.pageSize;
-        localStorage.setItem('simulate-time', moment().valueOf() + '');
-        if (this.model.filterSetting) {
-            this.alarmNames = this.model.filterSetting.detailsData.map(item => item.name);
-            this.currentTimePeriod = (_a = this.model.filterSetting) === null || _a === void 0 ? void 0 : _a.displayPeriod;
-            this.updateQueryTimeRange();
-            if (this.model.filterSetting.alarmType) {
-                this.refreshIntervalId = setInterval(() => {
-                    this.loadFirstPage();
-                    this.logger.debug(`[GUI]Refresh Alarm Table:${d3.time.format('%x %X')(new Date())}`);
-                }, this.model.filterSetting.refreshCycle * 60 * 1000);
-            }
-            else {
-                variableCommunicator.subscribeUserDeviceAlarms(signalRAppId).subscribe(alarms => {
-                    alarms.forEach(alarm => {
-                        if (this.alarmNames.indexOf(alarm.name) !== -1) {
-                            this.getAlarmData();
-                            return;
-                        }
-                    });
-                });
-            }
-            this.getAlarmData();
-        }
-        else {
-            this.totalCount = 0;
-            this.alarmList = [];
-            this.renderElement();
-        }
-    }
-    dispose() {
-        clearInterval(this.refreshIntervalId);
-        if (this.element) {
-            this.element.tooltip.hidden(true);
-        }
-        this.logger.debug(`[GUI]Dispose Alarm Table Refresh Interval:${d3.time.format('%x %X')(new Date())}`);
-    }
-    getValidTimePeriods() {
-        const timePeriods = new Array();
-        timePeriods.push({ key: 6, name: this.localization.lastThirtyMinutes });
-        timePeriods.push({ key: 1, name: this.localization.lastOneHour });
-        timePeriods.push({ key: 7, name: this.localization.lastEightHour });
-        timePeriods.push({ key: 2, name: this.localization.lastTwentyFourHours });
-        timePeriods.push({ key: 3, name: this.localization.lastSevenDays });
-        timePeriods.push({ key: 4, name: this.localization.lastThirtyDays });
-        timePeriods.push({ key: 5, name: this.localization.lastOneYear });
-        return timePeriods;
-    }
-    getAlarmData() {
-        this.rootElement.selectAll('*').remove();
-        this.setStatusAsLoading();
-        clearTimeout(this.getAlarmDataId);
-        this.getAlarmDataId = setTimeout(() => {
-            if (this.model.filterSetting.alarmType) {
-                this.updateQueryTimeRange();
-                const input = new GetAlarmsArgs(this.alarmNames, this.startTime, this.endTime, this.pageSize, this.page * this.pageSize);
-                this.alarmsStore.getHistoryAlarms(input).subscribe(result => {
-                    if (!result.error) {
-                        this.totalCount = result.totalCount;
-                        this.alarmList = result.items.map(item => [
-                            item.name,
-                            item.message,
-                            item.alarmLevel,
-                            item.triggeredTime.format('YYYY-MM-DD HH:mm:ss')
-                        ]);
-                        this.renderElement();
-                    }
-                });
-            }
-            else {
-                const input = new GetAlarmsArgs(this.alarmNames, undefined, undefined, this.pageSize, this.page * this.pageSize);
-                this.alarmsStore.getCurrentAlarms(input).subscribe(result => {
-                    if (!result.error) {
-                        this.totalCount = result.totalCount;
-                        this.currentAlarmList = result.items;
-                        if (!result.items.length && result.totalCount) {
-                            this.page = 0;
-                            this.getAlarmData();
-                            return;
-                        }
-                        this.alarmList = this.currentAlarmList.map(item => [
-                            item.name,
-                            item.message,
-                            item.alarmLevel,
-                            item.triggeredTime.format('YYYY-MM-DD HH:mm:ss')
-                        ]);
-                        this.renderElement();
-                    }
-                });
-            }
-        }, 500);
-    }
-    renderElement() {
-        const elementHeight = this.model.size.height;
-        this.element = document.createElementNS('http://www.w3.org/2000/svg', 'foreignObject');
-        this.element.setAttribute('width', this.model.size.width.toString());
-        this.element.setAttribute('height', elementHeight.toString());
-        this.$element.append(this.element);
-        const table = document.createElement('table');
-        table.style.cssText = `border: 2px solid ${this.model.generalSetting.stroke};
-            height: ${elementHeight - 39}`;
-        let tr = document.createElement('tr');
-        let fontString = '';
-        if (this.model.generalSetting.headerFont.isItalic) {
-            fontString += 'italic ';
-        }
-        if (this.model.generalSetting.headerFont.isBold) {
-            fontString += 'bold ';
-        }
-        fontString += this.model.generalSetting.headerFont.fontSize + ' ' + this.model.generalSetting.headerFont.fontFamily;
-        tr.style.cssText = `height: ${this.model.heights[0]}px;
-            background: ${this.model.generalSetting.headerFillColor};
-            color: ${this.model.generalSetting.headerFont.color};
-            font: ${fontString};
-            text-align: ${this.model.generalSetting.headerFont.textAlign};
-            ${this.model.generalSetting.headerFont.isUnderline ? 'text-decoration: underline' : ''};
-            vertical-align: middle;`;
-        for (let row = 0; row < 4; row++) {
-            const th = document.createElement('th');
-            th.innerHTML = this.model.columLabels[row];
-            th.style.cssText = `width: ${this.model.widths[row] / this.model.size.width * 100}%;
-                border-style: solid;
-                border-color: ${this.model.generalSetting.splitLine};
-                border-left-width: ${!row || this.model.generalSetting.isHiddenColumnSplitLine ? 0 : 1}px;`;
-            tr.appendChild(th);
-        }
-        table.appendChild(tr);
-        const levelColors = ['#3695FF', '#FFE900', '#FFA800', '#E84F4F'];
-        for (let row = 0; row < this.pageSize; row++) {
-            tr = document.createElement('tr');
-            tr.style.cssText = `height: ${this.model.heights[row + 1]}px;
-                    background: ${this.model.generalSetting.tableFillColor};
-                    font: ${this.model.generalSetting.fontStyle};
-                    color: ${this.model.generalSetting.fontColor};
-                    text-align: ${this.model.generalSetting.textAlign};
-                    vertical-align: middle;`;
-            for (let col = 0; col < 4; col++) {
-                const td = document.createElement('td');
-                td.style.cssText = `border-style: solid;
-                border-color: ${this.model.generalSetting.splitLine};
-                border-top-width: ${this.model.generalSetting.isHiddenColumnSplitLine ? 0 : 1}px;
-                border-left-width: ${!col || this.model.generalSetting.isHiddenColumnSplitLine ? 0 : 1}px;`;
-                if (this.alarmList[row]) {
-                    if (col !== 2) {
-                        td.innerHTML = this.alarmList[row][col];
-                        td.style.cssText += `${this.model.generalSetting.isUnderline ? 'text-decoration: underline' : ''};`;
-                    }
-                    else {
-                        const alarmLevel = document.createElement('div');
-                        let alarmHeight = parseInt(this.model.generalSetting.fontSize) + 15;
-                        if (alarmHeight > this.model.heights[row + 1])
-                            alarmHeight = this.model.heights[row + 1];
-                        let margin = '0 15px';
-                        if (this.model.generalSetting.textAlign === 'left') {
-                            margin = '0 30px 0 0';
-                        }
-                        else if (this.model.generalSetting.textAlign === 'right') {
-                            margin = '0 0 0 30px';
-                        }
-                        alarmLevel.style.cssText = `margin: ${margin};
-                            border-radius: 5px;
-                            background: ${levelColors[this.alarmList[row][col]]};
-                            color: #ffffff;
-                            width: ${this.model.widths[col] - 30}px;
-                            height: ${alarmHeight}px;
-                            max-height: ${this.model.heights[row + 1]}px;
-                            display: flex;
-                            justify-content: center;
-                            align-items: center;
-                            ${this.model.generalSetting.isUnderline ? 'text-decoration: underline' : ''};`;
-                        alarmLevel.innerHTML = this.model.levelText[this.alarmList[row][col]];
-                        td.appendChild(alarmLevel);
-                    }
-                }
-                else if (col === 2) {
-                    const alarmLevel = document.createElement('div');
-                    let margin = '0 15px';
-                    if (this.model.generalSetting.textAlign === 'left') {
-                        margin = '0 30px 0 0';
-                    }
-                    else if (this.model.generalSetting.textAlign === 'right') {
-                        margin = '0 0 0 30px';
-                    }
-                    alarmLevel.style.cssText = `margin: ${margin};
-                            width: ${this.model.widths[col] - 30}px;`;
-                    td.appendChild(alarmLevel);
-                }
-                tr.appendChild(td);
-            }
-            table.appendChild(tr);
-        }
-        this.element.appendChild(table);
-        this.renderOperationArea(this.model.size.width, elementHeight - 39);
-    }
-    renderOperationArea(chartWidth, chartHeight) {
-        var _a;
-        const operationArea = this.rootElement.append('g').attr('transform', `translate(0,${chartHeight + this.displayOption.operationAreaMarginTop})`)
-            .append('foreignObject').attr('width', chartWidth).attr('height', this.displayOption.operationAreaHeight).attr('fill', 'none')
-            .append('xhtml:div').style('height', (this.displayOption.operationAreaHeight - 4) + 'px').style('overflow', 'hidden').style('margin-top', '4px');
-        if ((_a = this.model.filterSetting) === null || _a === void 0 ? void 0 : _a.alarmType) {
-            const selectElement = operationArea.append('select').style('margin-left', this.displayOption.marginLeft + 'px')
-                .style('font-size', this.displayOption.operationSelectFontSize).on('change', () => {
-                const displayTimePeriod = this.rootElement.select('select').property('value');
-                this.updateTimeRange(displayTimePeriod);
-                this.getAlarmData();
-            });
-            const options = selectElement.selectAll('option').data(this.timePeriods).enter().append('option');
-            options.text(d => d.name).attr('value', d => d.key).property('selected', d => d.key === Number(this.currentTimePeriod));
-        }
-        const buttonWidth = this.displayOption.operationButtonWidth + 'px', buttonHeight = this.displayOption.operationButtonHeight + 'px';
-        operationArea.append('button').style('width', buttonWidth).style('height', buttonHeight).style('border', 'none')
-            .style('float', 'right').style('background', 'white').style('background-image', 'url(assets/img/last_page.svg)')
-            .on('click', () => { this.loadLastPage(); });
-        operationArea.append('button').style('width', buttonWidth).style('height', buttonHeight).style('border', 'none')
-            .style('float', 'right').style('background', 'white').style('background-image', 'url(assets/img/next_page.svg)')
-            .style('margin', `0 ${this.displayOption.operationButtonMargin}px 0 0`)
-            .on('click', () => { this.loadNextPage(); });
-        operationArea.append('button').style('width', buttonWidth).style('height', buttonHeight).style('border', 'none')
-            .style('float', 'right').style('background', 'white').style('background-image', 'url(assets/img/previous_page.svg)')
-            .style('margin', `0 ${this.displayOption.operationButtonMargin}px 0 0`)
-            .on('click', () => { this.loadPreviousPage(); });
-        operationArea.append('button').style('width', buttonWidth).style('height', buttonHeight).style('border', 'none')
-            .style('float', 'right').style('background', 'white').style('background-image', 'url(assets/img/first_page.svg)')
-            .style('margin', `0 ${this.displayOption.operationButtonMargin}px 0 0`)
-            .on('click', () => { this.loadFirstPage(); });
-        this.setStatusAsNormal();
-    }
-    updateTimeRange(timePeriodType) {
-        this.currentTimePeriod = +timePeriodType;
-        this.updateQueryTimeRange();
-    }
-    updateQueryTimeRange() {
-        this.endTime = moment();
-        switch (this.currentTimePeriod) {
-            case 1:
-                this.startTime = moment().subtract(1, 'hours');
-                break;
-            case 3:
-                this.startTime = moment().subtract(7, 'days');
-                break;
-            case 4:
-                this.startTime = moment().subtract(30, 'days');
-                break;
-            case 5:
-                this.startTime = moment().subtract(1, 'years');
-                break;
-            case 6:
-                this.startTime = moment().subtract(30, 'minutes');
-                break;
-            case 7:
-                this.startTime = moment().subtract(8, 'hours');
-                break;
-            default:
-                this.startTime = moment().subtract(1, 'days');
-        }
-    }
-    loadFirstPage() {
-        if (this.page > 0) {
-            this.page = 0;
-            this.getAlarmData();
-        }
-    }
-    loadNextPage() {
-        let last_page = Math.ceil(this.totalCount / this.pageSize);
-        if (last_page)
-            last_page--;
-        if (this.page < last_page) {
-            this.page++;
-            this.getAlarmData();
-        }
-    }
-    loadPreviousPage() {
-        if (this.page > 0) {
-            this.page--;
-            this.getAlarmData();
-        }
-    }
-    loadLastPage() {
-        let last_page = Math.ceil(this.totalCount / this.pageSize);
-        if (last_page)
-            last_page--;
-        if (this.page !== last_page) {
-            this.page = last_page;
-            this.getAlarmData();
-        }
-    }
-    setStatusAsNormal() {
-        this.elementStatus = AlaertElementStatus.Normal;
-        this.clearStatus();
-    }
-    setStatusAsLoading() {
-        this.elementStatus = AlaertElementStatus.Loading;
-        this.renderStatus('assets/img/loading.svg', '#226abc');
-    }
-    renderStatus(icon, stroke) {
-        if (this.elementStatus === AlaertElementStatus.Normal) {
-            this.clearStatus();
-            return;
-        }
-        this.rootElement.append('rect').attr('id', 'StateFrame').attr('fill', 'transparent')
-            .attr('width', this.model.size.width)
-            .attr('height', this.model.size.height);
-        const document = this.$element[0].ownerDocument;
-        const currentRect = this.$element.find('rect#StateFrame').first();
-        if (!currentRect.length) {
-            return;
-        }
-        this.$element.find('image#StateImage').remove();
-        const imgObj = document.createElementNS('http://www.w3.org/2000/svg', 'image');
-        if (imgObj) {
-            let x = Number(currentRect[0].getAttribute('width')) - 20;
-            const currentRectX = currentRect[0].getAttribute('x');
-            if (currentRectX !== null) {
-                x += Number(currentRectX);
-            }
-            currentRect[0].setAttribute('stroke', stroke);
-            currentRect[0].setAttribute('stroke-opacity', '0.5');
-            imgObj.href.baseVal = icon;
-            imgObj.setAttributeNS(null, 'id', 'StateImage');
-            imgObj.setAttributeNS(null, 'x', x.toString());
-            imgObj.setAttributeNS(null, 'y', '0');
-            imgObj.setAttributeNS(null, 'height', '20px');
-            imgObj.setAttributeNS(null, 'width', '20px');
-            const titleElement = document.createElementNS('http://www.w3.org/2000/svg', 'title');
-            imgObj.appendChild(titleElement);
-            this.$element.append(imgObj);
-        }
-    }
-    clearStatus() {
-        const currentRect = this.$element.find('rect#StateFrame').first();
-        if (!currentRect.length) {
-            return;
-        }
-        const stroke = currentRect[0].getAttribute('stroke');
-        if (stroke) {
-            currentRect[0].removeAttribute('stroke');
-        }
-        this.$element.find('image#StateImage').remove();
-    }
-}

package/elements/alarm/alarm-element.metadata.json

@@ -1 +0,0 @@
-[{"__symbolic":"module","version":4,"metadata":{"AlarmElement":{"__symbolic":"class","extends":{"__symbolic":"reference","module":"../base/conditional-display-element","name":"ConditionalDisplayElement","line":20,"character":34},"members":{"__ctor__":[{"__symbolic":"constructor","parameters":[{"__symbolic":"error","message":"Could not resolve type","line":54,"character":25,"context":{"typeName":"HTMLElement"}},{"__symbolic":"reference","module":"@angular/core","name":"Injector","line":55,"character":18},{"__symbolic":"reference","module":"../../service","name":"PermissionChecker","line":56,"character":27},{"__symbolic":"reference","module":"../../communication","name":"VariableCommunicator","line":57,"character":30},{"__symbolic":"reference","module":"../../config","name":"VariableStore","line":58,"character":23},{"__symbolic":"reference","module":"../../config","name":"AlarmsStore","line":59,"character":38},{"__symbolic":"reference","name":"string"}]}],"dispose":[{"__symbolic":"method"}],"getValidTimePeriods":[{"__symbolic":"method"}],"getAlarmData":[{"__symbolic":"method"}],"renderElement":[{"__symbolic":"method"}],"renderOperationArea":[{"__symbolic":"method"}],"updateTimeRange":[{"__symbolic":"method"}],"updateQueryTimeRange":[{"__symbolic":"method"}],"loadFirstPage":[{"__symbolic":"method"}],"loadNextPage":[{"__symbolic":"method"}],"loadPreviousPage":[{"__symbolic":"method"}],"loadLastPage":[{"__symbolic":"method"}],"setStatusAsNormal":[{"__symbolic":"method"}],"setStatusAsLoading":[{"__symbolic":"method"}],"renderStatus":[{"__symbolic":"method"}],"clearStatus":[{"__symbolic":"method"}]}}}}]

package/elements/bar-graph-element.d.ts

@@ -1,27 +0,0 @@
-import { BarGraph } from '../model';
-import { Localization } from '../localization';
-import { VariableCommunicator } from '../communication';
-import { ReadableElement } from './base/readable-element';
-import { VariableStore } from '../config';
-import { PermissionChecker } from '../service';
-export declare class BarGraphElement extends ReadableElement {
-    private static DEFAULT_MIN_VALUE;
-    private static DEFAULT_MAX_VALUE;
-    readonly model: BarGraph;
-    private readonly $barRect;
-    private readonly barElement;
-    private readonly $barText;
-    private readonly defaultTransform;
-    private defaultBarColor;
-    private defaultUpperLimitColor;
-    private defaultLowerLimitColor;
-    private barText;
-    private valueObj;
-    private isNeedUpdateScale;
-    get readVariableName(): string;
-    constructor(element: HTMLElement, permissionChecker: PermissionChecker, variableCommunicator: VariableCommunicator, variableStore: VariableStore, localization: Localization, signalRAppId: string);
-    private initFrameNode;
-    private updateValueObj;
-    private updateScale;
-    updateVariableValue(value: number, variableName: any): void;
-}

package/elements/bar-graph-element.js

@@ -1,180 +0,0 @@
-import { BarGraphDirection } from '../model';
-import { ReadableElement } from './base/readable-element';
-import { calculatePercent } from './shared/math-utils';
-import { VariableUtil } from '../utils/variable-util';
-import { VariableValueType } from '../model/shared/condition/variable-value-type';
-export class BarGraphElement extends ReadableElement {
-    constructor(element, permissionChecker, variableCommunicator, variableStore, localization, signalRAppId) {
-        super(element, permissionChecker, variableCommunicator, variableStore, localization, signalRAppId);
-        this.defaultBarColor = '#6fd149';
-        this.defaultUpperLimitColor = '#ff4448';
-        this.defaultLowerLimitColor = '#0f60e8';
-        this.barText = '';
-        this.valueObj = {};
-        this.isNeedUpdateScale = false;
-        if ((this.model.minValueType === VariableValueType.Constant && this.model.maxValueType === VariableValueType.Variable)
-            || this.model.maxValueType === VariableValueType.Constant && this.model.minValueType === VariableValueType.Variable) {
-            this.isNeedUpdateScale = true;
-            this.updateScale();
-            this.isNeedUpdateScale = false;
-        }
-        this.$barRect = this.$element.find('rect');
-        this.$barText = this.$element.find('text[id="text"]').last();
-        if (this.model.version && this.model.version >= 1) {
-            const backgroundColor = this.model.backgroundColor ? this.model.backgroundColor : 'transparent';
-            this.barElement = this.$element.children(`path[fill='${backgroundColor}']`);
-            this.defaultTransform = this.barElement.attr('transform');
-            this.$barRect.attr('transform', this.defaultTransform);
-        }
-        setTimeout(() => {
-            this.initFrameNode();
-        }, 0);
-    }
-    get readVariableName() {
-        if (!this.model) {
-            throw new Error('Model cannot be null');
-        }
-        if (null == this.model.version || this.model.version < 2) {
-            return this.model.variableName;
-        }
-        else {
-            const variable = this.model.readVariable;
-            if (!variable) {
-                return undefined;
-            }
-            return VariableUtil.getConvertedVariableName(this.variableStore, variable);
-        }
-    }
-    initFrameNode() {
-        const arcPath = Snap(this.$element[0]);
-        const b = arcPath.getBBox(true);
-        this.rootElement.append('rect').attr('id', 'StateFrame').attr('width', b.width).attr('height', b.height).attr('fill', 'transparent');
-    }
-    updateValueObj(value, variableName) {
-        var _a, _b, _c;
-        if (((_a = this.model.readVariable) === null || _a === void 0 ? void 0 : _a.name) === variableName) {
-            this.isNeedUpdateScale = false;
-            this.valueObj.value = value;
-        }
-        if (((_b = this.model.minVariable) === null || _b === void 0 ? void 0 : _b.name) === variableName) {
-            this.isNeedUpdateScale = true;
-            this.valueObj.min = value;
-        }
-        if (((_c = this.model.maxVariable) === null || _c === void 0 ? void 0 : _c.name) === variableName) {
-            this.isNeedUpdateScale = true;
-            this.valueObj.max = value;
-        }
-    }
-    updateScale() {
-        if (!this.isNeedUpdateScale) {
-            return;
-        }
-        const textElements = this.$element.find('g:first > text');
-        let min = this.model.minValueType ? this.valueObj.min : this.model.min;
-        let max = this.model.maxValueType ? this.valueObj.max : this.model.max;
-        min = Number(min);
-        max = Number(max);
-        if (isNaN(min) || isNaN(max)) {
-            min = BarGraphElement.DEFAULT_MIN_VALUE;
-            max = BarGraphElement.DEFAULT_MAX_VALUE;
-        }
-        const avgSacle = ((max - min) / this.model.masterDivisionNumber).toFixed(5);
-        for (let i = 0; i < textElements.length; i++) {
-            const text = textElements[i];
-            if (!text.innerHTML) {
-                continue;
-            }
-            let sacleValue = ((Number(avgSacle) * i) + min).toFixed(0);
-            // 整数位和小数位格式化；
-            if (this.model.fractionDigits > 0) {
-                sacleValue = (sacleValue / Math.pow(10, this.model.fractionDigits)).toFixed(this.model.fractionDigits);
-            }
-            if (!isNaN(sacleValue)) {
-                text.innerHTML = sacleValue;
-            }
-        }
-    }
-    updateVariableValue(value, variableName) {
-        this.updateValueObj(value, variableName);
-        this.updateScale();
-        const variableValue = Number(this.valueObj.value);
-        let maxValue = this.model.maxValueType ? this.valueObj.max : this.model.max;
-        let minValue = this.model.minValueType ? this.valueObj.min : this.model.min;
-        minValue = Number(minValue);
-        maxValue = Number(maxValue);
-        if (isNaN(minValue) || isNaN(maxValue)) {
-            minValue = BarGraphElement.DEFAULT_MIN_VALUE;
-            maxValue = BarGraphElement.DEFAULT_MAX_VALUE;
-        }
-        if (isNaN(variableValue)) {
-            return;
-        }
-        const useAlarmLimit = this.model.useAlarmLimit;
-        const useAlarmUpperLimit = null != this.model.upperLimit;
-        const useAlarmLowerLimit = null != this.model.lowerLimit;
-        let barColor = this.model.barColor;
-        const upperLimitColor = this.model.upperLimitColor;
-        const lowerLimitColor = this.model.lowerLimitColor;
-        const percentageFont = this.model.percentageFont;
-        let box;
-        if (this.model.version && this.model.version >= 1) {
-            box = this.barElement[0].getBBox();
-        }
-        else {
-            box = this.$barRect.parent()[0].getBBox();
-        }
-        const percent = calculatePercent(minValue, maxValue, variableValue);
-        let translateY = 0;
-        if (this.model.direction === BarGraphDirection.DownToUp || this.model.direction === BarGraphDirection.LeftToRight) {
-            translateY = box.height * (1 - percent);
-        }
-        if (!barColor) {
-            barColor = this.defaultBarColor;
-        }
-        if (useAlarmLimit) {
-            if (useAlarmUpperLimit && variableValue > +this.model.upperLimit) {
-                if (upperLimitColor) {
-                    barColor = upperLimitColor;
-                }
-                else {
-                    barColor = this.defaultUpperLimitColor;
-                }
-            }
-            else if (useAlarmLowerLimit && variableValue < +this.model.lowerLimit) {
-                if (lowerLimitColor) {
-                    barColor = lowerLimitColor;
-                }
-                else {
-                    barColor = this.defaultLowerLimitColor;
-                }
-            }
-        }
-        this.$barRect.attr('height', box.height * percent);
-        this.$barRect.attr('width', box.width);
-        this.$barRect.attr('fill', barColor);
-        if (this.model.version && this.model.version >= 1) {
-            this.$barRect.attr('transform', this.defaultTransform + ` translate(0,${translateY})`);
-        }
-        else {
-            this.$barRect.attr('transform', `translate(0,${translateY})`);
-        }
-        this.barText = (percent * 100).toFixed(0) + '%';
-        this.$barText.text(this.barText);
-        if (percentageFont) {
-            this.$barText.attr('font-family', 'Microsoft YaHei');
-            this.$barText.attr('font-size', percentageFont.fontSize + '');
-            this.$barText.attr('fill', percentageFont.color);
-            if (percentageFont.isBold) {
-                this.$barText.attr('font-weight', 'bold');
-            }
-            if (percentageFont.isItalic) {
-                this.$barText.attr('font-style', 'italic');
-            }
-            if (percentageFont.isUnderline) {
-                this.$barText.attr('text-decoration', 'underline');
-            }
-        }
-    }
-}
-BarGraphElement.DEFAULT_MIN_VALUE = 0;
-BarGraphElement.DEFAULT_MAX_VALUE = 100;

package/elements/bar-graph-element.metadata.json

@@ -1 +0,0 @@
-[{"__symbolic":"module","version":4,"metadata":{"BarGraphElement":{"__symbolic":"class","extends":{"__symbolic":"reference","module":"./base/readable-element","name":"ReadableElement","line":10,"character":37},"members":{"__ctor__":[{"__symbolic":"constructor","parameters":[{"__symbolic":"error","message":"Could not resolve type","line":38,"character":25,"context":{"typeName":"HTMLElement"}},{"__symbolic":"reference","module":"../service","name":"PermissionChecker","line":38,"character":57},{"__symbolic":"reference","module":"../communication","name":"VariableCommunicator","line":39,"character":30},{"__symbolic":"reference","module":"../config","name":"VariableStore","line":40,"character":23},{"__symbolic":"reference","module":"../localization","name":"Localization","line":41,"character":22},{"__symbolic":"reference","name":"string"}]}],"initFrameNode":[{"__symbolic":"method"}],"updateValueObj":[{"__symbolic":"method"}],"updateScale":[{"__symbolic":"method"}],"updateVariableValue":[{"__symbolic":"method"}]},"statics":{"DEFAULT_MIN_VALUE":0,"DEFAULT_MAX_VALUE":100}}}}]

package/elements/base/base-element.d.ts

@@ -1,11 +0,0 @@
-/// <reference types="jquery" />
-/// <reference types="jqueryui" />
-import * as d3 from 'd3-selection';
-import { BaseElementModel } from '../../model';
-export declare abstract class BaseElement {
-    protected readonly signalRAppId: string;
-    protected readonly $element: JQuery;
-    protected readonly rootElement: d3.Selection<any, {}, null, undefined>;
-    protected model: BaseElementModel;
-    constructor(element: HTMLElement, signalRAppId?: string);
-}

package/elements/base/base-element.js

@@ -1,9 +0,0 @@
-import * as d3 from 'd3-selection';
-export class BaseElement {
-    constructor(element, signalRAppId = '') {
-        this.signalRAppId = signalRAppId;
-        this.$element = $(element);
-        this.rootElement = d3.select(element);
-        this.model = JSON.parse(this.rootElement.attr('data-model'));
-    }
-}

package/elements/base/base-element.metadata.json

@@ -1 +0,0 @@
-[{"__symbolic":"module","version":4,"metadata":{"BaseElement":{"__symbolic":"class","members":{"__ctor__":[{"__symbolic":"constructor","parameters":[{"__symbolic":"error","message":"Could not resolve type","line":9,"character":25,"context":{"typeName":"HTMLElement"}},{"__symbolic":"reference","name":"string"}]}]}}}}]

package/elements/base/conditional-control-element.d.ts

@@ -1,16 +0,0 @@
-import { ConditionControlResultValue } from '../../model';
-import { ConditionalControlModel } from '../../model/base/conditional-control-model';
-import { PermissionChecker } from '../../service';
-import { VariableCommunicator } from '../../communication';
-import { StateControlElement } from './state-control-element';
-import { Localization } from '../../localization';
-import { VariableStore } from '../../config';
-export declare abstract class ConditionalControlElement extends StateControlElement {
-    protected readonly variableCommunicator: VariableCommunicator;
-    protected readonly variableStore: VariableStore;
-    protected abstract readonly model: ConditionalControlModel;
-    constructor(element: HTMLElement, permissionChecker: PermissionChecker, variableCommunicator: VariableCommunicator, variableStore: VariableStore, localization: Localization, signalRAppId: string);
-    protected abstract updateElement(value: ConditionControlResultValue): void;
-    private initConditionalControl;
-    private recoverData;
-}