"use strict";
Object.defineProperty(exports, "__esModule", { value: true });
var tslib_1 = require("../polyfills/tslib.js");
var webmapgl_core_js_1 = require("../webmapgl.core.js");
var chunk_853b4351_js_1 = require("./chunk-853b4351.js");
var LegendItem = function () { function e() { this.toggle = !1, this.widget = "item"; } return e.prototype.componentWillLoad = function () { return tslib_1.__awaiter(this, void 0, void 0, function () { return tslib_1.__generator(this, function (e) { return this.handleStyleId(), [2]; }); }); }, e.prototype.handleStyleId = function () { return tslib_1.__awaiter(this, void 0, void 0, function () { var e; return tslib_1.__generator(this, function (t) { switch (t.label) {
    case 0: return [4, this.getStyle()];
    case 1: return (e = t.sent()) && this.update(e.json), [2];
} }); }); }, e.prototype.handleStyleAdded = function (e) { e.detail.id === this.styleId && this.update(e.detail.json); }, e.prototype.handleStyleUpdated = function (e) { e.detail.id === this.styleId && this.update(e.detail.json); }, e.prototype.getStyle = function () { return tslib_1.__awaiter(this, void 0, void 0, function () { var e; return tslib_1.__generator(this, function (t) { switch (t.label) {
    case 0: return (e = document.querySelector("gl-style#" + this.styleId)) ? [4, e.componentOnReady()] : [3, 2];
    case 1: t.sent(), t.label = 2;
    case 2: return [2, e];
} }); }); }, e.prototype.getVisible = function (e) { var t = chunk_853b4351_js_1.b(this.layers); if (!t || !t.length)
    return !0; if (!e.layers || !e.layers.length)
    return !1; for (var i = 0, n = e.layers; i < n.length; i++) {
    var r = n[i];
    if (-1 !== t.indexOf(r.id))
        return !r.layout || "none" !== r.layout.visibility;
} }, e.prototype.setVisible = function (e) { return tslib_1.__awaiter(this, void 0, void 0, function () { var t, i, n; return tslib_1.__generator(this, function (r) { switch (r.label) {
    case 0: return this.visible === e ? [2] : (t = chunk_853b4351_js_1.b(this.layers), [4, this.getStyle()]);
    case 1: return (i = r.sent()) ? ((n = Object.assign({}, i.json)).layers = (n.layers || []).map(function (i) { return -1 !== t.indexOf(i.id) && (i.layout = i.layout || {}, i.layout.visibility = e ? "visible" : "none"), i; }), i.json = n, [2]) : [2];
} }); }); }, e.prototype.update = function (e) { e && (this.visible = this.getVisible(e)); }, e.prototype.render = function () { var e = this, t = []; return this.image && t.push(webmapgl_core_js_1.h("ion-thumbnail", { slot: "start" }, webmapgl_core_js_1.h("img", { src: this.image, alt: this.el.textContent }))), t.push(webmapgl_core_js_1.h("ion-label", null, webmapgl_core_js_1.h("slot", null))), this.toggle && t.push(webmapgl_core_js_1.h("ion-toggle", { slot: "end", checked: this.visible, onIonChange: function (t) { return e.setVisible(t.detail.checked); } })), webmapgl_core_js_1.h("divider" === this.widget ? "ion-item-divider" : "ion-item", null, t); }, Object.defineProperty(e, "is", { get: function () { return "gl-legend-item"; }, enumerable: !0, configurable: !0 }), Object.defineProperty(e, "properties", { get: function () { return { el: { elementRef: !0 }, image: { type: String, attr: "image" }, layers: { type: String, attr: "layers" }, styleId: { type: String, attr: "style-id", watchCallbacks: ["handleStyleId"] }, toggle: { type: Boolean, attr: "toggle" }, visible: { state: !0 }, widget: { type: String, attr: "widget" } }; }, enumerable: !0, configurable: !0 }), Object.defineProperty(e, "listeners", { get: function () { return [{ name: "body:glStyleElementAdded", method: "handleStyleAdded" }, { name: "body:glStyleElementModified", method: "handleStyleUpdated" }]; }, enumerable: !0, configurable: !0 }), Object.defineProperty(e, "style", { get: function () { return "gl-legend-item .item ion-thumbnail{height:40px;width:40px}"; }, enumerable: !0, configurable: !0 }), e; }();
exports.GlLegendItem = LegendItem;
