@senx/discovery-widgets/dist/components/discovery-image2.js

Discovery Widgets Elements

import { proxyCustomElement, HTMLElement, createEvent, h, Host } from '@stencil/core/internal/client';
import { b as DataModel } from './types.js';
import { P as Param, G as GTSLib, L as Logger, U as Utils } from './utils.js';
import { d as defineCustomElement$1 } from './discovery-spinner2.js';

const discoveryImageCss = "/*!\n *   Copyright 2022-2023  SenX S.A.S.\n *\n *   Licensed under the Apache License, Version 2.0 (the \"License\");\n *   you may not use this file except in compliance with the License.\n *   You may obtain a copy of the License at\n *\n *     http://www.apache.org/licenses/LICENSE-2.0\n *\n *   Unless required by applicable law or agreed to in writing, software\n *   distributed under the License is distributed on an \"AS IS\" BASIS,\n *   WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.\n *   See the License for the specific language governing permissions and\n *   limitations under the License.\n */:host{display:block;width:100%;height:100%}:host .images-wrapper{display:-ms-flexbox;display:flex;-ms-flex-direction:row;flex-direction:row;-ms-flex-align:center;align-items:center;-ms-flex-wrap:wrap;flex-wrap:wrap;-ms-flex-pack:center;justify-content:center;-ms-flex-line-pack:center;align-content:center}:host .images-wrapper .responsive{max-width:100%;max-height:100%;width:auto;height:auto;margin-bottom:20px;margin-top:20px}";
const DiscoveryImageStyle0 = discoveryImageCss;

const DiscoveryImageComponent = /*@__PURE__*/ proxyCustomElement(class DiscoveryImageComponent extends HTMLElement {
    constructor() {
        super();
        this.__registerHost();
        this.__attachShadow();
        this.draw = createEvent(this, "draw", 7);
        this.options = new Param();
        this.debug = false;
        this.unit = '';
        this.parsing = false;
        this.toDisplay = [];
        this.defOptions = new Param();
        this.initial = false;
    }
    updateRes(newValue, oldValue) {
        if (JSON.stringify(newValue) !== JSON.stringify(oldValue)) {
            this.result = GTSLib.getData(this.result);
            this.toDisplay = this.convert(this.result || new DataModel());
            this.draw.emit();
        }
    }
    componentWillLoad() {
        setTimeout(() => {
            var _a;
            this.parsing = true;
            this.initial = true;
            this.LOG = new Logger(DiscoveryImageComponent, this.debug);
            if (typeof this.options === 'string') {
                this.options = JSON.parse(this.options);
            }
            this.result = GTSLib.getData(this.result);
            this.toDisplay = this.convert(this.result || new DataModel());
            (_a = this.LOG) === null || _a === void 0 ? void 0 : _a.debug(['componentWillLoad'], {
                type: this.type,
                options: this.options,
                toDisplay: this.toDisplay,
                result: this.result,
            });
            this.parsing = false;
            if (this.initial) {
                this.draw.emit();
                this.initial = false;
            }
        });
    }
    convert(data) {
        const toDisplay = [];
        let options = Utils.mergeDeep(this.defOptions, this.options || {});
        options = Utils.mergeDeep(options || {}, data.globalParams);
        this.options = Object.assign({}, options);
        if (GTSLib.isArray(data.data)) {
            (data.data || []).forEach(img => {
                if (GTSLib.isEmbeddedImage(img)) {
                    toDisplay.push(img);
                }
            });
        }
        else if (data.data && GTSLib.isEmbeddedImage(data.data)) {
            toDisplay.push(data.data);
        }
        return toDisplay;
    }
    // noinspection JSUnusedLocalSymbols
    async export(_type = 'png') {
        return Promise.resolve(this.toDisplay);
    }
    render() {
        return (h(Host, { key: 'a231a10c3985277591f817ac7542de558509a78d' }, h("div", { key: '18c22519a05791543b0853ef3983008d7d57deae', class: "images-wrapper", style: { width: '100%', height: '100%' } }, this.parsing
            ? h("discovery-spinner", null, "Parsing data...")
            : this.toDisplay.length > 0
                ? this.toDisplay.map((img) => h("img", { src: img, class: "responsive", alt: "Result" }))
                : '')));
    }
    get el() { return this; }
    static get watchers() { return {
        "result": ["updateRes"]
    }; }
    static get style() { return DiscoveryImageStyle0; }
}, [1, "discovery-image", {
        "result": [1],
        "type": [1],
        "options": [1],
        "width": [2],
        "height": [2],
        "debug": [4],
        "unit": [1],
        "parsing": [32],
        "toDisplay": [32],
        "export": [64]
    }, undefined, {
        "result": ["updateRes"]
    }]);
function defineCustomElement() {
    if (typeof customElements === "undefined") {
        return;
    }
    const components = ["discovery-image", "discovery-spinner"];
    components.forEach(tagName => { switch (tagName) {
        case "discovery-image":
            if (!customElements.get(tagName)) {
                customElements.define(tagName, DiscoveryImageComponent);
            }
            break;
        case "discovery-spinner":
            if (!customElements.get(tagName)) {
                defineCustomElement$1();
            }
            break;
    } });
}

export { DiscoveryImageComponent as D, defineCustomElement as d };

//# sourceMappingURL=discovery-image2.js.map