@amcharts/amcharts5 5.2.49 → 5.3.0

package/.internal/charts/stock/SettingsModal.js

@@ -1,4 +1,3 @@
-import { __extends } from "tslib";
 import { CandlestickSeries } from "../xy/series/CandlestickSeries";
 import { LineSeries } from "../xy/series/LineSeries";
 import { Modal } from "../../core/util/Modal";
@@ -10,449 +9,378 @@ import * as $type from "../../core/util/Type";
 /**
  * Used to display a modal dialog with HTML content.
  */
-var SettingsModal = /** @class */ (function (_super) {
-    __extends(SettingsModal, _super);
-    function SettingsModal() {
-        var _this = _super !== null && _super.apply(this, arguments) || this;
-        Object.defineProperty(_this, "_updatedSettings", {
+export class SettingsModal extends Modal {
+    constructor() {
+        super(...arguments);
+        Object.defineProperty(this, "_updatedSettings", {
             enumerable: true,
             configurable: true,
             writable: true,
             value: {}
         });
-        Object.defineProperty(_this, "_settingsTarget", {
+        Object.defineProperty(this, "_settingsTarget", {
             enumerable: true,
             configurable: true,
             writable: true,
             value: void 0
         });
-        Object.defineProperty(_this, "_colorControl", {
+        Object.defineProperty(this, "_colorControl", {
             enumerable: true,
             configurable: true,
             writable: true,
             value: void 0
         });
-        return _this;
     }
-    Object.defineProperty(SettingsModal.prototype, "_afterNew", {
-        enumerable: false,
-        configurable: true,
-        writable: true,
-        value: function () {
-            _super.prototype._afterNew.call(this);
-        }
-    });
-    Object.defineProperty(SettingsModal.prototype, "_beforeChanged", {
-        enumerable: false,
-        configurable: true,
-        writable: true,
-        value: function () {
-            _super.prototype._beforeChanged.call(this);
-            // if (this.isDirty("content")) {
-            // 	this.getPrivate("content").innerHTML = this.get("content", "");
-            // }
-        }
-    });
+    _afterNew() {
+        super._afterNew();
+    }
+    _beforeChanged() {
+        super._beforeChanged();
+        // if (this.isDirty("content")) {
+        // 	this.getPrivate("content").innerHTML = this.get("content", "");
+        // }
+    }
     /**
      * Opens settings modal for an [[Indicator]].
      *
      * @param  target  Target indicator
      */
-    Object.defineProperty(SettingsModal.prototype, "openIndicator", {
-        enumerable: false,
-        configurable: true,
-        writable: true,
-        value: function (target) {
-            this._settingsTarget = target;
-            this.initContent(target._editableSettings, target);
-        }
-    });
+    openIndicator(target) {
+        this._settingsTarget = target;
+        this.initContent(target._editableSettings, target);
+    }
     /**
      * Opens settings editing for the any [[XYSeries]].
      *
      * @param  series  target series
      */
-    Object.defineProperty(SettingsModal.prototype, "openSeries", {
-        enumerable: false,
-        configurable: true,
-        writable: true,
-        value: function (series) {
-            this._settingsTarget = series;
-            var l = this._root.language;
-            var stockChart = this.get("stockChart");
-            var isline = series instanceof LineSeries;
-            var settings = [];
-            if (series == stockChart.get("stockSeries") && !isline) {
-                settings.push({
-                    id: "stockPositiveColor",
-                    key: "stockPositiveColor",
-                    name: l.translateAny("Increase"),
-                    type: "color",
-                    currentValue: stockChart.get("stockPositiveColor", this._root.interfaceColors.get("positive")),
-                    target: stockChart
-                });
-                settings.push({
-                    id: "stockNegativeColor",
-                    key: "stockNegativeColor",
-                    name: l.translateAny("Decrease"),
-                    type: "color",
-                    currentValue: stockChart.get("stockNegativeColor", this._root.interfaceColors.get("negative")),
-                    target: stockChart
-                });
-            }
-            else if (series == stockChart.get("volumeSeries") && !isline) {
-                settings.push({
-                    id: "volumePositiveColor",
-                    key: "volumePositiveColor",
-                    name: l.translateAny("Increase"),
-                    type: "color",
-                    currentValue: stockChart.get("volumePositiveColor", this._root.interfaceColors.get("positive")),
-                    target: stockChart
-                });
-                settings.push({
-                    id: "volumeNegativeColor",
-                    key: "volumeNegativeColor",
-                    name: l.translateAny("Decrease"),
-                    type: "color",
-                    currentValue: stockChart.get("volumeNegativeColor", this._root.interfaceColors.get("negative")),
-                    target: stockChart
-                });
-            }
-            else if (series instanceof CandlestickSeries && series.columns.length) {
-                var column = series.columns.getIndex(0);
-                settings.push({
-                    id: "riseFromOpen.fill",
-                    key: "fill",
-                    additionalKeys: ["stroke"],
-                    name: l.translateAny("Increase"),
-                    type: "color",
-                    currentValue: column.states.lookup("riseFromOpen").get("fill"),
-                    target: series.columns.template.states.create("riseFromOpen", {}),
+    openSeries(series) {
+        this._settingsTarget = series;
+        const l = this._root.language;
+        const stockChart = this.get("stockChart");
+        const isline = series instanceof LineSeries;
+        let settings = [];
+        if (series == stockChart.get("stockSeries") && !isline) {
+            settings.push({
+                id: "stockPositiveColor",
+                key: "stockPositiveColor",
+                name: l.translateAny("Increase"),
+                type: "color",
+                currentValue: stockChart.get("stockPositiveColor", this._root.interfaceColors.get("positive")),
+                target: stockChart
+            });
+            settings.push({
+                id: "stockNegativeColor",
+                key: "stockNegativeColor",
+                name: l.translateAny("Decrease"),
+                type: "color",
+                currentValue: stockChart.get("stockNegativeColor", this._root.interfaceColors.get("negative")),
+                target: stockChart
+            });
+        }
+        else if (series == stockChart.get("volumeSeries") && !isline) {
+            settings.push({
+                id: "volumePositiveColor",
+                key: "volumePositiveColor",
+                name: l.translateAny("Increase"),
+                type: "color",
+                currentValue: stockChart.get("volumePositiveColor", this._root.interfaceColors.get("positive")),
+                target: stockChart
+            });
+            settings.push({
+                id: "volumeNegativeColor",
+                key: "volumeNegativeColor",
+                name: l.translateAny("Decrease"),
+                type: "color",
+                currentValue: stockChart.get("volumeNegativeColor", this._root.interfaceColors.get("negative")),
+                target: stockChart
+            });
+        }
+        else if (series instanceof CandlestickSeries && series.columns.length) {
+            const column = series.columns.getIndex(0);
+            settings.push({
+                id: "riseFromOpen.fill",
+                key: "fill",
+                additionalKeys: ["stroke"],
+                name: l.translateAny("Increase"),
+                type: "color",
+                currentValue: column.states.lookup("riseFromOpen").get("fill"),
+                target: series.columns.template.states.create("riseFromOpen", {}),
+                invalidateTarget: series
+            });
+            settings.push({
+                id: "dropFromOpen.fill",
+                key: "fill",
+                additionalKeys: ["stroke"],
+                name: l.translateAny("Decrease"),
+                type: "color",
+                currentValue: column.states.lookup("dropFromOpen").get("fill"),
+                target: series.columns.template.states.create("dropFromOpen", {}),
+                invalidateTarget: series
+            });
+        }
+        else if (isline) {
+            settings = [{
+                    key: "stroke",
+                    name: l.translateAny("Line"),
+                    type: "color"
+                }, {
+                    key: "strokeWidth",
+                    name: l.translateAny("Line"),
+                    type: "dropdown",
+                    options: [
+                        { value: 1, text: "1px" },
+                        { value: 2, text: "2px" },
+                        { value: 4, text: "4px" },
+                        { value: 10, text: "10px" }
+                    ],
+                    currentValue: series.strokes.template.get("strokeWidth", 1),
+                    target: series.strokes.template,
                     invalidateTarget: series
-                });
+                }];
+            if (series.fills.template.get("visible")) {
                 settings.push({
-                    id: "dropFromOpen.fill",
                     key: "fill",
-                    additionalKeys: ["stroke"],
-                    name: l.translateAny("Decrease"),
-                    type: "color",
-                    currentValue: column.states.lookup("dropFromOpen").get("fill"),
-                    target: series.columns.template.states.create("dropFromOpen", {}),
-                    invalidateTarget: series
+                    name: l.translateAny("Fill"),
+                    type: "color"
                 });
             }
-            else if (isline) {
-                settings = [{
-                        key: "stroke",
-                        name: l.translateAny("Line"),
-                        type: "color"
-                    }, {
-                        key: "strokeWidth",
-                        name: l.translateAny("Line"),
-                        type: "dropdown",
-                        options: [
-                            { value: 1, text: "1px" },
-                            { value: 2, text: "2px" },
-                            { value: 4, text: "4px" },
-                            { value: 10, text: "10px" }
-                        ],
-                        currentValue: series.strokes.template.get("strokeWidth", 1),
-                        target: series.strokes.template,
-                        invalidateTarget: series
-                    }];
-                if (series.fills.template.get("visible")) {
-                    settings.push({
-                        key: "fill",
-                        name: l.translateAny("Fill"),
-                        type: "color"
-                    });
-                }
+        }
+        else {
+            settings = [{
+                    key: "stroke",
+                    name: l.translateAny("Line"),
+                    type: "color"
+                }, {
+                    key: "fill",
+                    name: l.translateAny("Fill"),
+                    type: "color"
+                }];
+        }
+        this.initContent(settings, series);
+    }
+    initContent(settings, target) {
+        this._updatedSettings = {};
+        const content = this.getPrivate("content");
+        // Clear
+        this.clear();
+        // Title
+        const title = document.createElement("h1");
+        title.innerHTML = target.get("name");
+        content.appendChild(title);
+        // Add fields
+        const table = document.createElement("div");
+        table.className = "am5-modal-table";
+        content.appendChild(table);
+        const settingInputs = {};
+        const settingsWithTarget = {};
+        let prevName = "";
+        let prevLine;
+        $array.each(settings, (setting) => {
+            const key = this._getSettingKey(setting);
+            const keyTarget = setting.target || target;
+            const currentValue = setting.currentValue || keyTarget.get(setting.key);
+            if (setting.target) {
+                settingsWithTarget[key] = setting;
             }
-            else {
-                settings = [{
-                        key: "stroke",
-                        name: l.translateAny("Line"),
-                        type: "color"
-                    }, {
-                        key: "fill",
-                        name: l.translateAny("Fill"),
-                        type: "color"
-                    }];
+            let element;
+            switch (setting.type) {
+                case "dropdown":
+                    element = this.getDropdown(setting, currentValue);
+                    settingInputs[key] = element;
+                    break;
+                case "number":
+                    element = this.getNumber(setting, currentValue);
+                    settingInputs[key] = element;
+                    break;
+                case "color":
+                    element = this.getColor(setting, currentValue);
+                    break;
+                case "checkbox":
+                    element = this.getCheckbox(setting, currentValue);
+                    settingInputs[key] = element;
+                    break;
+                // case "text":
+                // 	element = this.getText(setting, currentValue);
+                // 	break;
             }
-            this.initContent(settings, series);
-        }
-    });
-    Object.defineProperty(SettingsModal.prototype, "initContent", {
-        enumerable: false,
-        configurable: true,
-        writable: true,
-        value: function (settings, target) {
-            var _this = this;
-            this._updatedSettings = {};
-            var content = this.getPrivate("content");
-            // Clear
-            this.clear();
-            // Title
-            var title = document.createElement("h1");
-            title.innerHTML = target.get("name");
-            content.appendChild(title);
-            // Add fields
-            var table = document.createElement("div");
-            table.className = "am5-modal-table";
-            content.appendChild(table);
-            var settingInputs = {};
-            var settingsWithTarget = {};
-            var prevName = "";
-            var prevLine;
-            $array.each(settings, function (setting) {
-                var key = _this._getSettingKey(setting);
-                var keyTarget = setting.target || target;
-                var currentValue = setting.currentValue || keyTarget.get(setting.key);
-                if (setting.target) {
-                    settingsWithTarget[key] = setting;
+            if (element) {
+                let line;
+                if (setting.name == prevName && prevLine) {
+                    line = prevLine;
                 }
-                var element;
-                switch (setting.type) {
-                    case "dropdown":
-                        element = _this.getDropdown(setting, currentValue);
-                        settingInputs[key] = element;
-                        break;
-                    case "number":
-                        element = _this.getNumber(setting, currentValue);
-                        settingInputs[key] = element;
-                        break;
-                    case "color":
-                        element = _this.getColor(setting, currentValue);
-                        break;
-                    case "checkbox":
-                        element = _this.getCheckbox(setting, currentValue);
-                        settingInputs[key] = element;
-                        break;
-                    // case "text":
-                    // 	element = this.getText(setting, currentValue);
-                    // 	break;
+                else {
+                    line = document.createElement("div");
+                    line.className = "am5-modal-table-row";
+                    table.appendChild(line);
+                    const heading = document.createElement("div");
+                    heading.className = "am5-modal-table-heading";
+                    heading.innerHTML = setting.name;
+                    line.appendChild(heading);
                 }
-                if (element) {
-                    var line = void 0;
-                    if (setting.name == prevName && prevLine) {
-                        line = prevLine;
-                    }
-                    else {
-                        line = document.createElement("div");
-                        line.className = "am5-modal-table-row";
-                        table.appendChild(line);
-                        var heading = document.createElement("div");
-                        heading.className = "am5-modal-table-heading";
-                        heading.innerHTML = setting.name;
-                        line.appendChild(heading);
-                    }
-                    var cell = document.createElement("div");
-                    cell.className = "am5-modal-table-cell";
-                    line.appendChild(cell);
-                    cell.appendChild(element);
-                    prevName = setting.name;
-                    prevLine = line;
+                const cell = document.createElement("div");
+                cell.className = "am5-modal-table-cell";
+                line.appendChild(cell);
+                cell.appendChild(element);
+                prevName = setting.name;
+                prevLine = line;
+            }
+        });
+        // Buttons
+        const saveButton = document.createElement("input");
+        saveButton.type = "button";
+        saveButton.value = this._root.language.translateAny("Save");
+        saveButton.className = "am5-modal-button am5-modal-primary";
+        content.appendChild(saveButton);
+        $utils.addEventListener(saveButton, "click", () => {
+            $object.each(settingInputs, (key, element) => {
+                if (element.type == "checkbox") {
+                    this._updatedSettings[key] = element.checked;
+                }
+                else if (element.type == "number") {
+                    this._updatedSettings[key] = $type.toNumber(element.value);
+                }
+                else {
+                    this._updatedSettings[key] = element.value;
                 }
             });
-            // Buttons
-            var saveButton = document.createElement("input");
-            saveButton.type = "button";
-            saveButton.value = this._root.language.translateAny("Save");
-            saveButton.className = "am5-modal-button am5-modal-primary";
-            content.appendChild(saveButton);
-            $utils.addEventListener(saveButton, "click", function () {
-                $object.each(settingInputs, function (key, element) {
-                    if (element.type == "checkbox") {
-                        _this._updatedSettings[key] = element.checked;
-                    }
-                    else if (element.type == "number") {
-                        _this._updatedSettings[key] = $type.toNumber(element.value);
-                    }
-                    else {
-                        _this._updatedSettings[key] = element.value;
-                    }
-                });
-                $object.each(_this._updatedSettings, function (key, value) {
-                    var targetKey = key.split(".").pop();
-                    if ($type.isObject(value) && value.value) {
-                        if (value.setting && value.setting.target) {
-                            value.setting.target.set(targetKey, value.value);
-                            if (value.setting.additionalKeys) {
-                                $array.each(value.setting.additionalKeys, function (additonalKey) {
-                                    value.setting.target.set(additonalKey, value.value);
-                                });
-                            }
+            $object.each(this._updatedSettings, (key, value) => {
+                const targetKey = key.split(".").pop();
+                if ($type.isObject(value) && value.value) {
+                    if (value.setting && value.setting.target) {
+                        value.setting.target.set(targetKey, value.value);
+                        if (value.setting.additionalKeys) {
+                            $array.each(value.setting.additionalKeys, (additonalKey) => {
+                                value.setting.target.set(additonalKey, value.value);
+                            });
                         }
-                        else {
-                            target.set(targetKey, value.value);
-                        }
-                    }
-                    else if (settingsWithTarget[targetKey]) {
-                        settingsWithTarget[targetKey].target.set(targetKey, value);
-                    }
-                    else {
-                        target.set(targetKey, value);
-                    }
-                    if (value.setting && value.setting.invalidateTarget) {
-                        value.setting.invalidateTarget.markDirtyValues();
-                    }
-                });
-                _this.close();
-            });
-            var cancelButton = document.createElement("input");
-            cancelButton.type = "button";
-            cancelButton.value = this._root.language.translateAny("Cancel");
-            cancelButton.className = "am5-modal-button am5-modal-scondary";
-            content.appendChild(cancelButton);
-            $utils.addEventListener(cancelButton, "click", function () {
-                _this.cancel();
-            });
-            // Open modal
-            this.open();
-        }
-    });
-    Object.defineProperty(SettingsModal.prototype, "getDropdown", {
-        enumerable: false,
-        configurable: true,
-        writable: true,
-        value: function (setting, currentValue) {
-            var element = document.createElement("select");
-            $array.each(setting.options, function (option) {
-                if (option) {
-                    var optionElement = document.createElement("option");
-                    var value = void 0;
-                    if ($type.isObject(option)) {
-                        optionElement.value = (option.value);
-                        optionElement.text = (option.text);
-                        value = (option.value);
                     }
                     else {
-                        optionElement.value = option;
-                        optionElement.text = option;
-                        value = option;
-                    }
-                    if (value == currentValue) {
-                        optionElement.selected = true;
+                        target.set(targetKey, value.value);
                     }
-                    element.appendChild(optionElement);
+                }
+                else if (settingsWithTarget[targetKey]) {
+                    settingsWithTarget[targetKey].target.set(targetKey, value);
+                }
+                else {
+                    target.set(targetKey, value);
+                }
+                if (value.setting && value.setting.invalidateTarget) {
+                    value.setting.invalidateTarget.markDirtyValues();
                 }
             });
-            return element;
-        }
-    });
-    Object.defineProperty(SettingsModal.prototype, "getNumber", {
-        enumerable: false,
-        configurable: true,
-        writable: true,
-        value: function (_setting, currentValue) {
-            var element = document.createElement("input");
-            element.type = "number";
-            element.value = currentValue;
-            element.className = "am5-modal-input-narrow";
-            return element;
-        }
-    });
-    Object.defineProperty(SettingsModal.prototype, "getCheckbox", {
-        enumerable: false,
-        configurable: true,
-        writable: true,
-        value: function (_setting, currentValue) {
-            var element = document.createElement("input");
-            element.type = "checkbox";
-            element.checked = currentValue === true;
-            return element;
-        }
-    });
-    Object.defineProperty(SettingsModal.prototype, "getColor", {
-        enumerable: false,
-        configurable: true,
-        writable: true,
-        value: function (setting, currentValue) {
-            var _this = this;
-            var control = ColorControl.new(this.root, {
-                stockChart: this.get("stockChart"),
-                useOpacity: false
-            });
-            control.setPrivate("color", currentValue);
-            control.events.on("selected", function (ev) {
-                _this._updatedSettings[_this._getSettingKey(setting)] = {
-                    value: ev.color,
-                    setting: setting
-                };
-            });
-            this._disposers.push(control);
-            return control.getPrivate("button");
-        }
-    });
+            this.close();
+        });
+        const cancelButton = document.createElement("input");
+        cancelButton.type = "button";
+        cancelButton.value = this._root.language.translateAny("Cancel");
+        cancelButton.className = "am5-modal-button am5-modal-scondary";
+        content.appendChild(cancelButton);
+        $utils.addEventListener(cancelButton, "click", () => {
+            this.cancel();
+        });
+        // Open modal
+        this.open();
+    }
+    getDropdown(setting, currentValue) {
+        const element = document.createElement("select");
+        $array.each(setting.options, (option) => {
+            if (option) {
+                const optionElement = document.createElement("option");
+                let value;
+                if ($type.isObject(option)) {
+                    optionElement.value = (option.value);
+                    optionElement.text = (option.text);
+                    value = (option.value);
+                }
+                else {
+                    optionElement.value = option;
+                    optionElement.text = option;
+                    value = option;
+                }
+                if (value == currentValue) {
+                    optionElement.selected = true;
+                }
+                element.appendChild(optionElement);
+            }
+        });
+        return element;
+    }
+    getNumber(_setting, currentValue) {
+        const element = document.createElement("input");
+        element.type = "number";
+        element.value = currentValue;
+        element.className = "am5-modal-input-narrow";
+        return element;
+    }
+    getCheckbox(_setting, currentValue) {
+        const element = document.createElement("input");
+        element.type = "checkbox";
+        element.checked = currentValue === true;
+        return element;
+    }
+    getColor(setting, currentValue) {
+        const control = ColorControl.new(this.root, {
+            stockChart: this.get("stockChart"),
+            useOpacity: false
+        });
+        control.setPrivate("color", currentValue);
+        control.events.on("selected", (ev) => {
+            this._updatedSettings[this._getSettingKey(setting)] = {
+                value: ev.color,
+                setting: setting
+            };
+        });
+        this._disposers.push(control);
+        return control.getPrivate("button");
+    }
     /**
      * Closes the modal, saving settings.
      */
-    Object.defineProperty(SettingsModal.prototype, "close", {
-        enumerable: false,
-        configurable: true,
-        writable: true,
-        value: function () {
-            _super.prototype.close.call(this);
-            this.events.dispatch("done", {
-                type: "done",
-                settings: this._updatedSettings,
-                settingsTarget: this._settingsTarget,
-                target: this
-            });
-        }
-    });
+    close() {
+        super.close();
+        this.events.dispatch("done", {
+            type: "done",
+            settings: this._updatedSettings,
+            settingsTarget: this._settingsTarget,
+            target: this
+        });
+    }
     /**
      * Closes the modal without applying any changes.
      */
-    Object.defineProperty(SettingsModal.prototype, "cancel", {
-        enumerable: false,
-        configurable: true,
-        writable: true,
-        value: function () {
-            _super.prototype.cancel.call(this);
-            this.events.dispatch("done", {
-                type: "done",
-                settings: null,
-                target: this
-            });
-        }
-    });
+    cancel() {
+        super.cancel();
+        this.events.dispatch("done", {
+            type: "done",
+            settings: null,
+            target: this
+        });
+    }
     /**
      * Clears contents of the modal.
      */
-    Object.defineProperty(SettingsModal.prototype, "clear", {
-        enumerable: false,
-        configurable: true,
-        writable: true,
-        value: function () {
-            var content = this.getPrivate("content");
-            content.innerHTML = "";
-            if (this._colorControl) {
-                this._colorControl.dispose();
-            }
-        }
-    });
-    Object.defineProperty(SettingsModal.prototype, "_getSettingKey", {
-        enumerable: false,
-        configurable: true,
-        writable: true,
-        value: function (setting) {
-            return setting.id || setting.key;
+    clear() {
+        const content = this.getPrivate("content");
+        content.innerHTML = "";
+        if (this._colorControl) {
+            this._colorControl.dispose();
         }
-    });
-    Object.defineProperty(SettingsModal, "className", {
-        enumerable: true,
-        configurable: true,
-        writable: true,
-        value: "SettingsModal"
-    });
-    Object.defineProperty(SettingsModal, "classNames", {
-        enumerable: true,
-        configurable: true,
-        writable: true,
-        value: Modal.classNames.concat([Modal.className])
-    });
-    return SettingsModal;
-}(Modal));
-export { SettingsModal };
+    }
+    _getSettingKey(setting) {
+        return setting.id || setting.key;
+    }
+}
+Object.defineProperty(SettingsModal, "className", {
+    enumerable: true,
+    configurable: true,
+    writable: true,
+    value: "SettingsModal"
+});
+Object.defineProperty(SettingsModal, "classNames", {
+    enumerable: true,
+    configurable: true,
+    writable: true,
+    value: Modal.classNames.concat([Modal.className])
+});
 //# sourceMappingURL=SettingsModal.js.map