"use strict";
var __decorate = (this && this.__decorate) || function (decorators, target, key, desc) {
    var c = arguments.length, r = c < 3 ? target : desc === null ? desc = Object.getOwnPropertyDescriptor(target, key) : desc, d;
    if (typeof Reflect === "object" && typeof Reflect.decorate === "function") r = Reflect.decorate(decorators, target, key, desc);
    else for (var i = decorators.length - 1; i >= 0; i--) if (d = decorators[i]) r = (c < 3 ? d(r) : c > 3 ? d(target, key, r) : d(target, key)) || r;
    return c > 3 && r && Object.defineProperty(target, key, r), r;
};
var __metadata = (this && this.__metadata) || function (k, v) {
    if (typeof Reflect === "object" && typeof Reflect.metadata === "function") return Reflect.metadata(k, v);
};
var core_1 = require('@angular/core');
var query_step_1 = require('./query-step');
var query_service_1 = require('./query.service');
var normalization_service_1 = require('./normalization.service');
var ismi_relation_types_1 = require('./ismi-relation-types');
var QuerySelectComponent = (function () {
    function QuerySelectComponent(_queryService, _normService) {
        this._queryService = _queryService;
        this._normService = _normService;
        // output queryChanged
        this.queryChanged = new core_1.EventEmitter();
    }
    QuerySelectComponent.prototype.ngOnInit = function () {
        this.setup();
    };
    QuerySelectComponent.prototype.setup = function () {
        console.log("query-select setup step=", this.queryStep);
        var step = this._queryService.state.steps[this.index]; // i-1?
        if (step != null) {
            this.setQueryStep(step);
        }
    };
    QuerySelectComponent.prototype.getQueryModes = function () {
        this.queryModes = this._queryService.getQueryModes(this.index);
        return this.queryModes;
    };
    QuerySelectComponent.prototype.onSelectMode = function (event) {
        var selected = event.target.value;
        this.selectedMode = this.queryModes.find(function (mode) { return mode.id === selected; });
        this.queryOptions = this._queryService.getQueryOptions(this.selectedMode);
    };
    QuerySelectComponent.prototype.onSelectOption = function (event) {
        var selected = event.target.value;
        console.debug("selected option:", selected);
        this.selectedOption = selected;
        this.onSubmit();
    };
    QuerySelectComponent.prototype.onSubmit = function () {
        console.debug("Submit! selectedMode=", this.selectedMode, " selectedOption=", this.selectedOption, " queryInput=", this.queryInput);
        var step = this.getQueryStep();
        /*
         * set step and submit change event
         */
        if (step != null) {
            this._queryService.setQueryStep(this.index, step);
            this.queryChanged.emit(this._queryService.getState());
        }
        return false;
    };
    /**
     * Returns QueryStep from current form state.
     */
    QuerySelectComponent.prototype.getQueryStep = function () {
        var _this = this;
        var step = null;
        if (this.selectedMode.id === 'type_is') {
            /*
             * type_is
             */
            var opt = this.selectedOption;
            if (opt) {
                step = new query_step_1.QueryStep(this.selectedMode, { 'objectType': opt });
            }
        }
        else if (this.selectedMode.id === 'relation_is') {
            /*
             * relation_is
             */
            var opt = this.selectedOption;
            if (opt) {
                var rel = ismi_relation_types_1.getRelationByName(opt);
                step = new query_step_1.QueryStep(this.selectedMode, { 'relationType': rel });
            }
        }
        else if (this.selectedMode.id === 'id_is') {
            /*
             * id is
             */
            var val = this.queryInput;
            if (val) {
                step = new query_step_1.QueryStep(this.selectedMode, { 'value': val });
            }
        }
        else if (this.selectedMode.id === 'att_contains') {
            /*
             * att_contains
             */
            var att = this.selectedOption;
            var val = this.queryInput;
            if (att && val) {
                step = new query_step_1.QueryStep(this.selectedMode, { 'attribute': att, 'value': val });
            }
        }
        else if (this.selectedMode.id === 'att_num_range') {
            /*
             * att_num_range
             */
            var att = this.selectedOption;
            var nlo = this.queryInput;
            var nhi = this.queryInput2;
            if (att && nlo && nhi) {
                step = new query_step_1.QueryStep(this.selectedMode, { 'attribute': att, 'numLo': nlo, 'numHi': nhi });
            }
        }
        else if (this.selectedMode.id === 'att_contains_norm') {
            /*
             * att_contains_norm
             *
             * calls normalization service and submits event in callback
             */
            var att_1 = this.selectedOption;
            var val_1 = this.queryInput;
            if (att_1 && val_1) {
                // run search term through normalizer 
                this._normService.fetchArabicTranslitNormalizedString(val_1)
                    .subscribe(function (data) {
                    console.debug("openmind norm data=", data);
                    step = new query_step_1.QueryStep(_this.selectedMode, { 'attribute': att_1, 'value': val_1, 'normValue': data.normalized_text });
                    _this._queryService.setQueryStep(_this.index, step);
                    // query has changed now
                    _this.queryChanged.emit(_this._queryService.getState());
                }, function (err) { return console.error("openmind norm error=", err); }, function () { return console.debug("openmind norm query Complete"); });
                // query has not been set yet (gets set in callback)
                return null;
            }
        }
        return step;
    };
    /**
     * Sets form state from given QueryStep.
     */
    QuerySelectComponent.prototype.setQueryStep = function (step) {
        var mode = step.mode;
        this.selectedMode = mode;
        if (mode.id === 'id_is') {
            /*
         * id_is
         */
            this.queryInput = step.params.value;
        }
        else if (mode.id === 'type_is') {
            /*
             * type_is
             */
            var name_1 = step.params.objectType;
            this.queryOptions = [name_1];
            this.selectedOption = name_1;
        }
        else if (this.selectedMode.id === 'relation_is') {
            /*
             * relation_is
             */
            var name_2 = step.params.relationType.name;
            var rel = ismi_relation_types_1.getRelationByName(name_2);
            this.queryOptions = [rel];
            this.selectedOption = name_2;
        }
        else if (this.selectedMode.id === 'att_contains') {
            /*
             * att_contains
             */
            var name_3 = step.params.attribute;
            this.queryOptions = [name_3];
            this.selectedOption = name_3;
            this.queryInput = step.params.value;
        }
        else if (this.selectedMode.id === 'att_num_range') {
            /*
             * att_num_range
             */
            var name_4 = step.params.attribute;
            this.queryOptions = [name_4];
            this.selectedOption = name_4;
            this.queryInput = step.params.numLo;
            this.queryInput2 = step.params.numHi;
        }
        else if (this.selectedMode.id === 'att_contains_norm') {
            /*
             * att_contains_norm
             */
            var name_5 = step.params.attribute;
            this.queryOptions = [name_5];
            this.selectedOption = name_5;
            this.queryInput = step.params.value;
        }
        // TODO: implement other modes
        this.resultInfo = step.resultInfo;
    };
    QuerySelectComponent = __decorate([
        core_1.Component({
            selector: 'query-select',
            template: "\n<p *ngIf=\"resultInfo\">&nbsp;&nbsp;&nbsp;result: {{resultInfo}}</p>\n<div>\n    <form (ngSubmit)=\"onSubmit()\">\n        <select name=\"mode\" (change)=\"onSelectMode($event)\">\n            <option></option>\n            <option *ngFor=\"let mode of getQueryModes()\" \n                [selected]=\"mode.id==selectedMode?.id\" [value]=\"mode.id\">\n                {{mode.label}}\n            </option>\n        </select>\n\n        <span *ngIf=\"selectedMode?.id=='type_is'\">\n            <select name=\"option\" *ngIf=\"queryOptions\" [ngModel]=\"selectedOption\" (change)=\"onSelectOption($event)\">\n                <option></option>\n                <option *ngFor=\"let option of queryOptions\" [value]=\"option\">\n                    {{option}}\n                </option>\n            </select>\n        </span>\n\n        <span *ngIf=\"selectedMode?.id=='relation_is'\">\n            <select name=\"option\" *ngIf=\"queryOptions\" [ngModel]=\"selectedOption\" (change)=\"onSelectOption($event)\">\n                <option></option>\n                <option *ngFor=\"let option of queryOptions\" [value]=\"option.getName()\">\n                    {{option.getLabel()}}\n                </option>\n            </select>\n        </span>\n\n        <span *ngIf=\"selectedMode?.id=='att_contains' || selectedMode?.id=='att_contains_norm'\">\n            <select name=\"option\" [ngModel]=\"selectedOption\" (change)=\"selectedOption=$event.target.value\">\n                <option></option>\n                <option *ngFor=\"let option of queryOptions\" [value]=\"option\">\n                    {{option}}\n                </option>\n            </select>\n            <span>contains</span>\n            <input type=\"text\" name=\"value\" [(ngModel)]=\"queryInput\"/>\n        </span>\n\n        <span *ngIf=\"selectedMode?.id=='att_num_range'\">\n            <select name=\"option\" [ngModel]=\"selectedOption\" (change)=\"selectedOption=$event.target.value\">\n                <option></option>\n                <option *ngFor=\"let option of queryOptions\" [value]=\"option\">\n                    {{option}}\n                </option>\n            </select>\n            <span>is between</span>\n            <input type=\"text\" name=\"value1\" [(ngModel)]=\"queryInput\"/>\n            <span>and</span>\n            <input type=\"text\" name=\"value2\" [(ngModel)]=\"queryInput2\"/>\n        </span>\n\n        <span *ngIf=\"selectedMode?.id=='id_is'\">\n            <input type=\"text\" name=\"value\" [(ngModel)]=\"queryInput\"/>\n        </span>\n\n        <button type=\"submit\">Submit</button>\n    </form>\n</div>\n        ",
            inputs: ['queryStep', 'index'],
            outputs: ['queryChanged']
        }), 
        __metadata('design:paramtypes', [query_service_1.QueryService, normalization_service_1.NormalizationService])
    ], QuerySelectComponent);
    return QuerySelectComponent;
}());
exports.QuerySelectComponent = QuerySelectComponent;
//# sourceMappingURL=query-select.component.js.map