import { Component, EventEmitter, Optional } from '@angular/core';
import { Output, Input, ChangeDetectionStrategy } from '@angular/core';
import { NgControl, } from '@angular/forms';
import { Http } from '@angular/http';
import { Verify } from '../../../services/validation/Verify';
import { ApiRoot } from 'dotcms-js/dotcms-js';
import * as _ from 'lodash';
var RestDropdown = (function () {
    function RestDropdown(_http, _apiRoot, control) {
        this._http = _http;
        this._apiRoot = _apiRoot;
        this.control = control;
        this.change = new EventEmitter();
        this.touch = new EventEmitter();
        this.onChange = function () { };
        this.onTouched = function () { };
        if (control) {
            control.valueAccessor = this;
        }
        this.placeholder = '';
        this.optionValueField = 'key';
        this.optionLabelField = 'value';
        this.allowAdditions = false;
        this.minSelections = 0;
        this.maxSelections = 1;
    }
    RestDropdown.prototype.ngAfterViewInit = function () {
    };
    RestDropdown.prototype.writeValue = function (value) {
        if (value && value.indexOf(',') > -1) {
            this._modelValue = value.split(',');
        }
        else {
            this._modelValue = _.isEmpty(value) ? '' : value;
        }
    };
    RestDropdown.prototype.registerOnChange = function (fn) {
        this.onChange = fn;
    };
    RestDropdown.prototype.registerOnTouched = function (fn) {
        this.onTouched = fn;
    };
    RestDropdown.prototype.fireChange = function ($event) {
        this.change.emit($event);
        this.onChange($event);
    };
    RestDropdown.prototype.fireTouch = function ($event) {
        this.touch.emit($event);
        this.onTouched($event);
    };
    RestDropdown.prototype.ngOnChanges = function (change) {
        var _this = this;
        if (change.optionUrl) {
            var requestOptionArgs = this._apiRoot.getDefaultRequestOptions();
            this._options = this._http.get(change.optionUrl.currentValue, requestOptionArgs)
                .map(function (res) { return _this.jsonEntriesToOptions(res); });
        }
        if (change.value && change.value.currentValue && change.value.currentValue.indexOf(',') > -1) {
            this._modelValue = change.value.currentValue.split(',');
        }
    };
    RestDropdown.prototype.jsonEntriesToOptions = function (res) {
        var _this = this;
        var valuesJson = res.json();
        var ary = [];
        if (Verify.isArray(valuesJson)) {
            ary = valuesJson.map(function (valueJson) { return _this.jsonEntryToOption(valueJson); });
        }
        else {
            ary = Object.keys(valuesJson).map(function (key) {
                return _this.jsonEntryToOption(valuesJson[key], key);
            });
        }
        return ary;
    };
    RestDropdown.prototype.jsonEntryToOption = function (json, key) {
        if (key === void 0) { key = null; }
        var opt = { value: null, label: null };
        if (!json[this.optionValueField] && this.optionValueField === 'key' && key != null) {
            opt.value = key;
        }
        else {
            opt.value = json[this.optionValueField];
        }
        opt.label = json[this.optionLabelField];
        return opt;
    };
    return RestDropdown;
}());
export { RestDropdown };
RestDropdown.decorators = [
    { type: Component, args: [{
                changeDetection: ChangeDetectionStrategy.OnPush,
                selector: 'cw-input-rest-dropdown',
                template: "\n  <cw-input-dropdown\n      [value]=\"_modelValue\"\n      placeholder=\"{{placeholder}}\"\n      [maxSelections]=\"maxSelections\"\n      [minSelections]=\"minSelections\"\n       [allowAdditions]=\"allowAdditions\"\n      (onDropDownChange)=\"fireChange($event)\"\n      (touch)=\"fireTouch($event)\"\n      >\n        <cw-input-option *ngFor=\"let opt of _options | async\" [value]=\"opt.value\" [label]=\"opt.label\" [icon]=\"opt.icon\"></cw-input-option>\n      </cw-input-dropdown>",
            },] },
];
/** @nocollapse */
RestDropdown.ctorParameters = function () { return [
    { type: Http, },
    { type: ApiRoot, },
    { type: NgControl, decorators: [{ type: Optional },] },
]; };
RestDropdown.propDecorators = {
    'placeholder': [{ type: Input },],
    'allowAdditions': [{ type: Input },],
    'minSelections': [{ type: Input },],
    'maxSelections': [{ type: Input },],
    'optionUrl': [{ type: Input },],
    'optionValueField': [{ type: Input },],
    'optionLabelField': [{ type: Input },],
    'value': [{ type: Input },],
    'change': [{ type: Output },],
    'touch': [{ type: Output },],
};
//# sourceMappingURL=RestDropdown.js.map