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.ViewPort
        Gadget.SettingGroup = $.extend(Gadget.SettingGroup, {
            ViewPort: "feb7d6ab-52f3-467d-9515-e8422d02d94e"
        });
        Gadget.Uri = { id: Settings.Gadget.SettingGroup.ViewPort, name: "Uri" };
        Gadget.OffsetX = { id: Settings.Gadget.SettingGroup.ViewPort, name: "CropLeftValue" };
        Gadget.OffsetY = { id: Settings.Gadget.SettingGroup.ViewPort, name: "CropTopValue" };
        Gadget.ViewPortWidth = { id: Settings.Gadget.SettingGroup.ViewPort, name: "CropWidthValue" };
        Gadget.ViewPortHeight = { id: Settings.Gadget.SettingGroup.ViewPort, name: "CropHeightValue" };
        Gadget.FrameHeight = { id: Settings.Gadget.SettingGroup.ViewPort, name: "ImageHeightValue" };
        Gadget.FrameWidth = { id: Settings.Gadget.SettingGroup.ViewPort, name: "ImageWidthValue" };
        Gadget.RefreshIntervalSeconds = { id: Settings.Gadget.SettingGroup.ViewPort, name: "RefreshIntervalValue" };
        Gadget.TimeoutSeconds = { id: Settings.Gadget.SettingGroup.ViewPort, name: "TimeoutValue" };
        Gadget.WaitToLoadSeconds = { id: Settings.Gadget.SettingGroup.ViewPort, name: "WaitTimeValue" };
        Gadget.ViewPortDisplayMode = { id: Settings.Gadget.SettingGroup.ViewPort, name: "DisplayMode" };
    })(Gadget = Settings.Gadget || (Settings.Gadget = {}));
})(Settings || (Settings = {}));
var Dashboards;
(function (Dashboards) {
    var SetupControl;
    (function (SetupControl) {
        var ViewPort = (function (_super) {
            __extends(ViewPort, _super);
            function ViewPort() {
                _super.call(this, Settings.Gadget.SettingGroup.ViewPort);
                this.title = i18n.loc.s('Gadgets', 'WebGadgetControl_Title'); //TODO: changeto new name
            }
            ViewPort.CreateInstance = function () {
                var instance = new ViewPort();
                return instance;
            };
            ViewPort.prototype.draw = function () {
                var _this = this;
                this.$container.empty();
                TemplateUtil.LocAndLoad(ViewPort.SetupControlTemplateUri, new Core.CallBack(function (template) {
                    _this.$container.html(template);
                    _this.render();
                }, this));
            };
            ViewPort.prototype.isConfigured = function () {
                var uri = this.setting(Settings.Gadget.Uri.name);
                return (uri && uri.length > 5);
            };
            // If the control performs validation expose the state here.
            ViewPort.prototype.isValid = function () {
                var isValid = this.$container.find('.' + Dashboards.Models.SetupControl.ValidationErrorClass).length == 0;
                if (isValid) {
                    var $uriInput = this.$container.find('#setup-control-uri-input');
                    isValid = this.validateUri($uriInput);
                }
                if (isValid) {
                    var displayMode = this.setting(Settings.Gadget.ViewPortDisplayMode.name);
                    if (displayMode == Dashboards.Models.WebGadget.ViewPortDisplayMode.Crop.toString()) {
                        if (this.isIntegerValid(this.$container.find('#setup-control-offsetX-input'), Settings.Gadget.OffsetX.name, 0) &&
                            this.isIntegerValid(this.$container.find('#setup-control-offsetY-input'), Settings.Gadget.OffsetY.name, 0) &&
                            this.isIntegerValid(this.$container.find('#setup-control-viewPortWidth-input'), Settings.Gadget.ViewPortWidth.name, 0) &&
                            this.isIntegerValid(this.$container.find('#setup-control-viewPortHeight-input'), Settings.Gadget.ViewPortHeight.name, 0) &&
                            this.isIntegerValid(this.$container.find('#setup-control-frameWidth-input'), Settings.Gadget.FrameWidth.name, 0) &&
                            this.isIntegerValid(this.$container.find('#setup-control-refreshInterval-input'), Settings.Gadget.RefreshIntervalSeconds.name, 0)) {
                            var offsetX = parseInt(this.setting(Settings.Gadget.OffsetX.name));
                            var vpWidth = parseInt(this.setting(Settings.Gadget.ViewPortWidth.name));
                            var frameWidth = parseInt(this.setting(Settings.Gadget.FrameWidth.name));
                            if ((offsetX + vpWidth) > frameWidth) {
                                isValid = false;
                                this.addValidationMessageMulti([this.$container.find('#setup-control-offsetX-input'), this.$container.find('#setup-control-viewPortWidth-input'), this.$container.find('#setup-control-frameWidth-input')], i18n.loc.s('Gadgets', 'WebGadgetControl_FrameWidthTooSmall'));
                            }
                        }
                        else {
                            isValid = false;
                        }
                    }
                }
                return isValid;
            };
            ViewPort.prototype.isManagedSetting = function (name) {
                var managed = false;
                switch (name) {
                    case Settings.Gadget.Uri.name:
                    case Settings.Gadget.OffsetX.name:
                    case Settings.Gadget.OffsetY.name:
                    case Settings.Gadget.ViewPortWidth.name:
                    case Settings.Gadget.ViewPortHeight.name:
                    case Settings.Gadget.FrameHeight.name:
                    case Settings.Gadget.FrameWidth.name:
                    case Settings.Gadget.RefreshIntervalSeconds.name:
                    case Settings.Gadget.ViewPortDisplayMode.name:
                        managed = true;
                        break;
                }
                ;
                return managed;
            };
            ViewPort.prototype.destroy = function () {
                this.webGadgetHelper.destroy();
                this.webGadgetHelper = null;
                _super.prototype.destroy.call(this);
            };
            ViewPort.prototype.render = function () {
                var _this = this;
                if (this.isSmallRenderWindow()) {
                    this.$container.find('.webGadget_SetupControl').addClass('smallRender');
                    this.$container.find('.removeIfSmall').remove();
                    this.$container.find('.iframePreview').addClass('iframePreviewSmall');
                }
                var $uriInput = this.$container.find('#setup-control-uri-input');
                var uriValue = this.setting(Settings.Gadget.Uri.name);
                $uriInput.val(uriValue);
                $uriInput.change(this, this._UriChanged);
                var $frameWidthInput = this.$container.find('#setup-control-frameWidth-input');
                var frameWidth = this.setting(Settings.Gadget.FrameWidth.name);
                frameWidth = i18n.formatNumber(frameWidth, 0);
                $frameWidthInput.val(frameWidth);
                // Set the default value since we don't expose the field.
                var $frameHeightInput = this.$container.find('#setup-control-frameHeight-input');
                $frameHeightInput.val('3000');
                var $offsetYInput = this.$container.find('#setup-control-offsetY-input');
                var offsetYValue = this.setting(Settings.Gadget.OffsetY.name);
                offsetYValue = i18n.formatNumber(offsetYValue, 0);
                $offsetYInput.val(offsetYValue);
                var $offsetXInput = this.$container.find('#setup-control-offsetX-input');
                var offsetXValue = this.setting(Settings.Gadget.OffsetX.name);
                offsetXValue = i18n.formatNumber(offsetXValue, 0);
                $offsetXInput.val(offsetXValue);
                var $viewPortHeightInput = this.$container.find('#setup-control-viewPortHeight-input');
                var viewPortHeightValue = this.setting(Settings.Gadget.ViewPortHeight.name);
                viewPortHeightValue = i18n.formatNumber(viewPortHeightValue, 0);
                $viewPortHeightInput.val(viewPortHeightValue);
                var $viewPortWidthInput = this.$container.find('#setup-control-viewPortWidth-input');
                var viewPortWidthValue = this.setting(Settings.Gadget.ViewPortWidth.name);
                viewPortWidthValue = i18n.formatNumber(viewPortWidthValue, 0);
                $viewPortWidthInput.val(viewPortWidthValue);
                var $refreshIntervalInput = this.$container.find('#setup-control-refreshInterval-input');
                var refreshIntervalValue = this.setting(Settings.Gadget.RefreshIntervalSeconds.name);
                refreshIntervalValue = i18n.formatNumber(refreshIntervalValue, 0);
                $refreshIntervalInput.change(function (event) {
                    _this.setting(Settings.Gadget.RefreshIntervalSeconds.name, $(event.delegateTarget).val());
                });
                $refreshIntervalInput.val(refreshIntervalValue);
                var $displayModeInput = this.$container.find('.displayModeOption input');
                var displayModeValue = this.setting(Settings.Gadget.ViewPortDisplayMode.name);
                displayModeValue = i18n.formatNumber(displayModeValue || Dashboards.Models.WebGadget.ViewPortDisplayMode.Crop, 0);
                this.$container.find('#displayMode-' + displayModeValue).prop('checked', true);
                $displayModeInput.change(function (event) {
                    _this.isIntegerValid($(event.delegateTarget), Settings.Gadget.ViewPortDisplayMode.name);
                    _this.displayTypeChanged(event);
                });
                this.$container.find('#displayMode-' + displayModeValue).change();
                this.$gadgetIframe = this.$container.find('iframe');
                this.webGadgetHelper = new Dashboards.Models.WebGadgetHelper(this.$gadgetIframe, this.$container.find('.webGadgetProper'), this.$container.find('.viewPort'));
                var $buttonPreviewUrl = this.$container.find('.buttonPreviewUrl');
                $buttonPreviewUrl.click(function (event) {
                    _this.clearValidation();
                    if (!_this.isValid())
                        return;
                    _this.$gadgetIframe.hide();
                    $buttonPreviewUrl.prop('disabled', 'disabled');
                    // When the iframe says it's loaded, resize based on the 
                    // entered settings.
                    var propertyGroup = {
                        SetupControlId: Settings.Gadget.SettingGroup.ViewPort,
                        Settings: _this.settings
                    };
                    var handler = new Settings.SettingHandler([propertyGroup]);
                    _this.webGadgetHelper.refresh(handler);
                    _this.$gadgetIframe.load(_this, function () {
                        _this.$gadgetIframe.show();
                        var $buttonPreviewUrl = _this.$container.find('.buttonPreviewUrl');
                        $buttonPreviewUrl.prop('disabled', '');
                    });
                    // Load the URL every time - we don't keep track of changes
                    // to it.
                    _this.$gadgetIframe.attr('src', '');
                    _this.$gadgetIframe.attr('src', _this.getUriValue(handler));
                });
            };
            ViewPort.prototype.displayTypeChanged = function (event) {
                var $control = $(event.delegateTarget);
                var value = NumberUtil.parseUserInput($control.val()).toString();
                var disabled = (value == Dashboards.Models.WebGadget.ViewPortDisplayMode.Portal ? 'disabled' : '');
                this.$container.find('.cropControls input').prop('disabled', disabled);
                this.$container.find('#setup-control-frameWidth-input').prop('disabled', disabled);
            };
            ViewPort.prototype._UriChanged = function (event) {
                event.data.setting(Settings.Gadget.Uri.name, $(this).val());
            };
            ViewPort.prototype.getUriValue = function (handler) {
                var uriValue = handler.byName(Settings.Gadget.Uri);
                uriValue = ViewPort.CleanUriValue(uriValue);
                return uriValue;
            };
            ViewPort.prototype.validateUri = function ($uriElement) {
                var uri = $uriElement.val();
                uri = SetupControl.ViewPort.CleanUriValue(uri);
                var isValid = ViewPort.IsValidUri(uri);
                if (!isValid) {
                    var setting = fwk.settings["UserEnteredUrlSchemes"] || "";
                    var format = (setting.trim().length === 0) ?
                        i18n.loc.s("Gadgets", "WebGadgetControl_NoSchemesConfigured") :
                        i18n.loc.s("Gadgets", "WebGadgetControl_UriValidation_1");
                    var message = StringUtil.format(format, setting);
                    this.addValidationMessage($uriElement, message);
                }
                return isValid;
            };
            /**
             * Will replace [@SERVER] with the local url root
             * @param uri
             */
            ViewPort.CleanUriValue = function (uri) {
                return uri.replace('[@SERVER]', fwk.url['Root']);
            };
            /**
             * Indicates if the given URI is valid/safe to use.
             * @param uri
             * @returns {}
             */
            ViewPort.IsValidUri = function (uri) {
                if (StringUtil.isNullOrEmpty(uri))
                    return true;
                var schemes = this.getUriSchemeWhiteList();
                var isValid = _.any(schemes, function (s) { return uri.startsWith(s); });
                return isValid;
            };
            ViewPort.getUriSchemeWhiteList = function () {
                var setting = fwk.settings["UserEnteredUrlSchemes"] || "";
                // replace all multi-whitespace with a single space
                setting = setting.trim().replace(/\s+/, " ");
                // If no settings return empty array which signals no entries.
                if (setting.length === 0)
                    return [];
                var schemes = setting.split(" ");
                return schemes;
            };
            ViewPort.SetupControlTemplateUri = 'Content/Gadgets/WebGadget/WebGadgetSetupControlTemplate.html';
            return ViewPort;
        }(Dashboards.Models.SetupControl));
        SetupControl.ViewPort = ViewPort;
    })(SetupControl = Dashboards.SetupControl || (Dashboards.SetupControl = {}));
})(Dashboards || (Dashboards = {}));
// Register the Setup Control
Dashboards.Controllers.SetupControl.Register({
    create: Dashboards.SetupControl.ViewPort.CreateInstance,
    id: Settings.Gadget.SettingGroup.ViewPort
});
//# sourceMappingURL=WebGadgetSetupControl.js.map