var __extends = (this && this.__extends) || function (d, b) {
    for (var p in b) if (b.hasOwnProperty(p)) d[p] = b[p];
    function __() { this.constructor = d; }
    d.prototype = b === null ? Object.create(b) : (__.prototype = b.prototype, new __());
};
var Settings;
(function (Settings) {
    var Gadget;
    (function (Gadget) {
        // Settings.Gadget.SettingGroup.GridConfiguration
        Gadget.SettingGroup = $.extend(Gadget.SettingGroup, {
            GridConfiguration: "97a11912-978b-44f1-a106-8a8e3cd8b4ca"
        });
        Gadget.FirstColumnContents = { id: Settings.Gadget.SettingGroup.GridConfiguration, name: 'FirstColumn' };
        Gadget.MinimumColumnWidth = { id: Settings.Gadget.SettingGroup.GridConfiguration, name: 'MinimumColumnWidth' };
        Gadget.SimpleRenderEnabled = { id: Settings.Gadget.SettingGroup.GridConfiguration, name: 'SimpleRender' };
        Gadget.GridDataRefreshIntervalSeconds = { id: Settings.Gadget.SettingGroup.GridConfiguration, name: "RefreshIntervalSeconds" };
    })(Gadget = Settings.Gadget || (Settings.Gadget = {}));
})(Settings || (Settings = {}));
var Dashboards;
(function (Dashboards) {
    var SetupControl;
    (function (SetupControl) {
        var GridConfiguration = (function (_super) {
            __extends(GridConfiguration, _super);
            function GridConfiguration() {
                _super.call(this, Settings.Gadget.SettingGroup.GridConfiguration);
                this.title = i18n.loc.s('Gadgets', 'GridConfigurationSettingsControl_Title');
            }
            GridConfiguration.CreateInstance = function () {
                var instance = new GridConfiguration();
                return instance;
            };
            GridConfiguration.prototype.draw = function () {
                var _this = this;
                this.$container.empty();
                TemplateUtil.LocAndLoad(GridConfiguration.SetupControlTemplateUri, new Core.CallBack(function (template) {
                    _this.$container.html(template);
                    _this.render();
                }, this));
            };
            GridConfiguration.prototype.isConfigured = function () {
                return true;
            };
            GridConfiguration.prototype.isManagedSetting = function (name) {
                var managed = false;
                switch (name) {
                    case Settings.Gadget.GridDataRefreshIntervalSeconds.name:
                    case Settings.Gadget.MinimumColumnWidth.name:
                    case Settings.Gadget.FirstColumnContents.name:
                    case Settings.Gadget.SimpleRenderEnabled.name:
                        managed = true;
                        break;
                }
                return managed;
            };
            // Perform any final adjustments to the settings
            // prior to commit.
            GridConfiguration.prototype.beforeCommit = function () {
                this.setting(Settings.Gadget.SimpleRenderEnabled.name, this.$container.find('#isSimpleRenderingEnabled').prop('checked') ? 'true' : 'false');
            };
            GridConfiguration.prototype.isValid = function () {
                var isValid = true;
                var $minColValueControl = this.$container.find('.MinColWidthValue');
                var validationResult = Validation.Text.validateUserText($minColValueControl, {
                    allowEmpty: false,
                    updateValue: false,
                    customMessage: StringUtil.format(i18n.loc.s('General', 'ValidationWarning_NumberExceedsRange'), 50, 300),
                    custom: function (textValue) {
                        var minColValue = NumberUtil.parseUserInput(textValue);
                        if (minColValue === '' || minColValue < 50 || minColValue > 300) {
                            return false;
                        }
                        return true;
                    }
                });
                if (validationResult.code != Validation.Text.ResultCode.Valid) {
                    isValid = false;
                    this.addValidationMessage($minColValueControl.parent(), validationResult.message);
                }
                else {
                    this.setting(Settings.Gadget.MinimumColumnWidth.name, '' + validationResult.value);
                }
                return isValid;
            };
            GridConfiguration.prototype.render = function () {
                var _this = this;
                // set initial ColumnContent value and change handler
                var firstColumnValue = this.setting(Settings.Gadget.FirstColumnContents.name) || GridConfiguration.sourceColumns;
                this.firstColumnSelector = new Controls.ButtonMatrix.ButtonMatrixControl({
                    $container: this.$container.find('.firstColumnTypeOptions'),
                    id: 'firstColumnTypeOptions',
                    buttonList: {
                        rows: 1,
                        buttons: [
                            {
                                content: i18n.loc.s('General', 'Sources'),
                                value: GridConfiguration.sourceColumns,
                                selected: firstColumnValue == GridConfiguration.sourceColumns
                            },
                            {
                                content: i18n.loc.s('General', 'Measurements'),
                                value: GridConfiguration.measurementColumns,
                                selected: firstColumnValue == GridConfiguration.measurementColumns
                            }
                        ]
                    },
                    onSelectedChangeCallback: function (newValue) {
                        _this.setting(Settings.Gadget.FirstColumnContents.name, newValue[0]);
                        _this.updateSampleTable();
                    }
                });
                // Set Update Interval value and change handler
                var interval = this.setting(Settings.Gadget.GridDataRefreshIntervalSeconds.name) || '10';
                var $updateIntervalSelect = this.$container.find('.update-interval');
                $updateIntervalSelect.val(interval);
                $updateIntervalSelect.change(function (event) {
                    _this.updateIntervalChanged(event);
                });
                // Setup the min col width slider
                var minColValue = this.setting(Settings.Gadget.MinimumColumnWidth.name) || '120';
                // Setup the minColValue spinner control.
                var $minColValueSpinner = this.$container.find('.MinColWidthValue');
                $minColValueSpinner.val(minColValue);
                $minColValueSpinner.spinner({
                    min: 50,
                    max: 300,
                    // This function is fired after the mouse up on the up/down buttons
                    stop: function () {
                        _this.setMinColumnValue();
                    }
                });
                // Manually entered values, pasted values.
                $minColValueSpinner.on('keyup', function () {
                    _this.setMinColumnValue();
                });
                // Setup the minColValue slider control.
                var $minColValueSlider = this.$container.find('.MinColWidthSlider').slider({
                    min: 50,
                    max: 300,
                    value: $minColValueSpinner.val(),
                    slide: function (event, ui) {
                        $minColValueSpinner.val(ui.value);
                        _this.setMinColumnValue();
                    }
                });
                this.setMinColumnValue();
                // Setup simple render control
                if (this.isSmallRenderWindow()) {
                    this.$container.find('.removeIfSmall').remove();
                }
                var isSimpleRenderEnabled = this.setting(Settings.Gadget.SimpleRenderEnabled.name) || 'false';
                var toggleButton = Controls.SlideToggle.CreateToggle('isSimpleRenderingEnabled', isSimpleRenderEnabled === 'true');
                this.$container.find('.EnableSimpleRender').html(toggleButton);
            };
            GridConfiguration.prototype.updateIntervalChanged = function (event) {
                // Grab the viewing period entry that is selected
                var interval = $(event.delegateTarget).val();
                this.setting(Settings.Gadget.GridDataRefreshIntervalSeconds.name, interval);
            };
            GridConfiguration.prototype.setMinColumnValue = function () {
                var $minColValue = this.$container.find('.MinColWidthValue');
                // Remove validation if present
                $minColValue.parent().removeClass('validationError');
                var minColValue = NumberUtil.parseUserInput($minColValue.val());
                if (minColValue == '') {
                    minColValue = 120;
                }
                var minValAsNumber = parseInt(minColValue);
                if (minValAsNumber < 50) {
                    minValAsNumber = 50;
                }
                else if (minValAsNumber > 300) {
                    minValAsNumber = 300;
                }
                this.setting(Settings.Gadget.MinimumColumnWidth.name, '' + minValAsNumber);
                this.$container.find('.MinColWidthSlider').slider('value', minValAsNumber);
                this.updateSampleTable();
            };
            GridConfiguration.prototype.updateSampleTable = function () {
                var minColValue = this.setting(Settings.Gadget.MinimumColumnWidth.name);
                minColValue = NumberUtil.parseUserInput(minColValue);
                if (minColValue == '') {
                    minColValue = '120';
                }
                var $sizableCells = this.$container.find('.sampleRenderTable .ColumnHeader1, .sampleRenderTable .ColumnHeader2');
                $sizableCells.css('width', minColValue + 'px');
                var firstColumnValue = this.setting(Settings.Gadget.FirstColumnContents.name) || GridConfiguration.sourceColumns;
                if (firstColumnValue == GridConfiguration.sourceColumns) {
                    this.$container.find('.sampleRenderTable .ColumnHeader0').text(i18n.loc.s('General', 'Sources'));
                    this.$container.find('.sampleRenderTable .ColumnHeader1').text(i18n.loc.s('Gadgets', 'GridConfigurationSettingsControl_SampleMeasurement1'));
                    this.$container.find('.sampleRenderTable .ColumnHeader2').text(i18n.loc.s('Gadgets', 'GridConfigurationSettingsControl_SampleMeasurement2'));
                    this.$container.find('.sampleRenderTable .RowHeader1').text(i18n.loc.s('Gadgets', 'GridConfigurationSettingsControl_SampleSource1'));
                    this.$container.find('.sampleRenderTable .RowHeader2').text(i18n.loc.s('Gadgets', 'GridConfigurationSettingsControl_SampleSource2'));
                }
                else {
                    this.$container.find('.sampleRenderTable .ColumnHeader0').text(i18n.loc.s('General', 'Measurements'));
                    this.$container.find('.sampleRenderTable .ColumnHeader1').text(i18n.loc.s('Gadgets', 'GridConfigurationSettingsControl_SampleSource1'));
                    this.$container.find('.sampleRenderTable .ColumnHeader2').text(i18n.loc.s('Gadgets', 'GridConfigurationSettingsControl_SampleSource2'));
                    this.$container.find('.sampleRenderTable .RowHeader1').text(i18n.loc.s('Gadgets', 'GridConfigurationSettingsControl_SampleMeasurement1'));
                    this.$container.find('.sampleRenderTable .RowHeader2').text(i18n.loc.s('Gadgets', 'GridConfigurationSettingsControl_SampleMeasurement2'));
                }
            };
            GridConfiguration.SetupControlTemplateUri = 'Content/Gadgets/GridGadget/GridConfigurationSetupControlTemplate.html';
            GridConfiguration.sourceColumns = 'Source';
            GridConfiguration.measurementColumns = 'Measurement';
            return GridConfiguration;
        }(Dashboards.Models.SetupControl));
        SetupControl.GridConfiguration = GridConfiguration;
    })(SetupControl = Dashboards.SetupControl || (Dashboards.SetupControl = {}));
})(Dashboards || (Dashboards = {}));
// Register the Setup Control
Dashboards.Controllers.SetupControl.Register({
    create: Dashboards.SetupControl.GridConfiguration.CreateInstance,
    id: Settings.Gadget.SettingGroup.GridConfiguration
});
//# sourceMappingURL=GridConfigurationSetupControl.js.map