/**
 * This file is part of the MedSafe application which is commercial software created by MedVision360 B.V.
 * The source code is proprietary and confidential.
 * Unauthorized copying of this file, via any medium is strictly prohibited.
 *
 * Copyright (c) by MedVision360 B.V. All rights reserved.
 *
 * For the application name: io.medrecord.medsafe
 */
import { __decorate, __param } from "tslib";
import { Component, HostBinding, Input, Optional, Output, Self, ViewChild } from '@angular/core';
import * as Core from '@angular/core';
import { showError } from '../../../../../core/utils/form-controls.util';
import { FormControlName } from '@angular/forms';
import moment from 'moment-timezone';
import { dateTimePickerType, dateTimePickerView, IconType, MomentDateFormat } from '../../../../models';
let DateTimeInputComponent = class DateTimeInputComponent {
    constructor(ngControl) {
        this.ngControl = ngControl;
        this.inputWidth = null;
        this.dateTimeStorageFormat = MomentDateFormat.storageDateTime;
        this.dateTimeDisplayFormat = MomentDateFormat.display;
        this.dateTimePickerView = dateTimePickerView.full;
        this.dateTimePickerType = dateTimePickerType.both;
        // Label props
        // Todo move label from input
        this.hint = '';
        this.formControlStyles = true;
        this.isDisabled = false;
        this.fieldId = this.inputId;
        this.doneEvent = new Core.EventEmitter();
        this.isOpen = false;
        this.clearIcon = IconType.cross;
        this.calendarIcon = IconType.calendar;
        this.warningIcon = IconType.warning;
        this.onChange = () => { };
        this.onTouched = () => { };
        if (this.ngControl) {
            this.ngControl.valueAccessor = this;
        }
    }
    get showError() {
        return this.ngControl && !this.isDisabled ? showError(this.ngControl.errors, this.ngControl.touched) : false;
    }
    get inputId() {
        return this.ngControl ? this.ngControl.name : null;
    }
    ngOnInit() {
        if (this.ngControl) {
            this.ngControl.valueAccessor = this;
        }
        if (this.wrapperControl) {
            this.wrapperControl.valueAccessor = this;
            this.ngControl = this.wrapperControl;
        }
        if (!this.ngControl) {
            return;
        }
        this.initializeValue();
    }
    initializeValue() {
        if (!this.ngControl.value && !this.setDateNow) {
            return;
        }
        const value = this.ngControl.value || undefined;
        const date = moment(value).toObject();
        const storageDate = this.getStorageDate(date);
        this.ngControl.control.setValue(storageDate, {
            onlySelf: true,
            emitEvent: false
        });
    }
    getStorageDate(dateValue) {
        let date = moment(dateValue);
        if (!date.isValid() && !!dateValue.date) {
            date = moment(Object.assign(Object.assign({}, dateValue), { date: 1 }));
        }
        return moment(date).format(this.dateTimeStorageFormat);
    }
    selectDate(event) {
        const storageDate = this.getStorageDate(event);
        this.ngControl._parent.control.patchValue({ [this.inputId]: storageDate });
        this.onChange(storageDate);
        this.isOpen = false;
    }
    onClose() {
        this.markAsTouched();
        this.onTouched();
    }
    markAsTouched() {
        if (this.ngControl) {
            this.ngControl.control.markAllAsTouched();
        }
    }
    onDone(event) {
        this.selectDate(event.date);
        this.doneEvent.emit(event);
    }
    clearValue(event) {
        event.stopPropagation();
        if (this.isDisabled) {
            return;
        }
        this.onChange('');
        this.ngControl._parent.control.patchValue({ [this.inputId]: '' });
        this.markAsTouched();
        this.onTouched();
    }
    // ControlValueAccessor implementations
    writeValue(value) {
        // setTimeout required to avoid datetime directive impact
        setTimeout(() => {
            if (!value) {
                this.inputElementRef.nativeElement.value = '';
            }
            else {
                const date = moment(value, this.dateTimeStorageFormat);
                this.inputElementRef.nativeElement.value = date.format(this.dateTimeDisplayFormat);
            }
        });
    }
    registerOnChange(fn) {
        this.onChange = fn;
    }
    registerOnTouched(fn) {
        this.onTouched = fn;
    }
};
DateTimeInputComponent.ctorParameters = () => [
    { type: FormControlName, decorators: [{ type: Self }, { type: Optional }] }
];
__decorate([
    ViewChild('picker')
], DateTimeInputComponent.prototype, "inputElementRef", void 0);
__decorate([
    Input()
], DateTimeInputComponent.prototype, "disabledTo", void 0);
__decorate([
    Input()
], DateTimeInputComponent.prototype, "disabledAfter", void 0);
__decorate([
    Input()
], DateTimeInputComponent.prototype, "inputWidth", void 0);
__decorate([
    Input()
], DateTimeInputComponent.prototype, "dateTimeStorageFormat", void 0);
__decorate([
    Input()
], DateTimeInputComponent.prototype, "dateTimeDisplayFormat", void 0);
__decorate([
    Input()
], DateTimeInputComponent.prototype, "dateTimePickerView", void 0);
__decorate([
    Input()
], DateTimeInputComponent.prototype, "dateTimePickerType", void 0);
__decorate([
    Input()
], DateTimeInputComponent.prototype, "wrapperControl", void 0);
__decorate([
    Input()
], DateTimeInputComponent.prototype, "hint", void 0);
__decorate([
    Input()
], DateTimeInputComponent.prototype, "label", void 0);
__decorate([
    Input()
], DateTimeInputComponent.prototype, "labelDescription", void 0);
__decorate([
    Input()
], DateTimeInputComponent.prototype, "setDateNow", void 0);
__decorate([
    Input()
], DateTimeInputComponent.prototype, "dateTimePickerStartsWithYear", void 0);
__decorate([
    HostBinding('class.form-control-styles'), Input()
], DateTimeInputComponent.prototype, "formControlStyles", void 0);
__decorate([
    Input()
], DateTimeInputComponent.prototype, "isDisabled", void 0);
__decorate([
    Output()
], DateTimeInputComponent.prototype, "fieldId", void 0);
__decorate([
    Output()
], DateTimeInputComponent.prototype, "doneEvent", void 0);
DateTimeInputComponent = __decorate([
    Component({
        selector: 'app-date-time-input',
        template: "<!--~\n  ~ This file is part of the MedSafe application which is commercial software created by MedVision360 B.V.\n  ~ The source code is proprietary and confidential.\n  ~ Unauthorized copying of this file, via any medium is strictly prohibited.\n  ~\n  ~ Copyright (c) by MedVision360 B.V. All rights reserved.\n  ~\n  ~ For the application name: io.medrecord.medsafe\n  ~-->\n\n<app-label\n  *ngIf=\"!!label\"\n  [label]=\"label\"\n  [labelDescription]=\"labelDescription\"\n  [hint]=\"hint\"\n  [fieldId]=\"inputId\"\n></app-label>\n\n<div\n  class=\"picker-wrapper\"\n  appDateTimePicker\n  [dateTime]=\"datetime\"\n  [(open)]=\"isOpen\"\n  (close)=\"onClose()\"\n  [isDisabled]=\"isDisabled\"\n  [style.max-width.px]=\"inputWidth\"\n>\n  <input\n    class=\"input input_icon-right\"\n    type=\"text\"\n    [ngClass]=\"{\n      'input_disabled': isDisabled,\n      'input_icon-right-double': showError,\n      'input_warning': showError\n     }\"\n    [id]=\"inputId\"\n    [disabled]=\"true\"\n    (blur)=\"onTouched()\"\n    #picker\n  />\n\n  <div\n    [ngClass]=\"{\n      'date-time-picker-dropdown': true,\n      close: !isOpen,\n      open: isOpen\n    }\"\n    #datetime\n  >\n    <app-date-time-picker\n      *ngIf=\"dateTimePickerView !== 'partial'\"\n      [type]=\"dateTimePickerType\"\n      [disabledTo]=\"disabledTo\"\n      [disabledAfter]=\"disabledAfter\"\n      (selectDate)=\"selectDate($event)\"\n    > </app-date-time-picker>\n\n    <app-partial-datepicker\n      *ngIf=\"dateTimePickerView !== 'full'\"\n      [type]=\"dateTimePickerType\"\n      [disabledTo]=\"disabledTo\"\n      [disabledAfter]=\"disabledAfter\"\n      [selected]=\"selectedDate\"\n      (doneEvent)=\"onDone($event)\"\n    > </app-partial-datepicker>\n  </div>\n\n  <span\n    *ngIf=\"inputElementRef && inputElementRef.nativeElement.value\"\n    class=\"icon-right\"\n    [ngStyle]=\"{ marginRight: showError ? '50px' : '30px' }\"\n  >\n    <span (click)=\"clearValue($event)\">\n      <svg-icon\n        [svgClass]=\"'clear'\"\n        [name]=\"clearIcon\"\n      ></svg-icon>\n    </span>\n  </span>\n\n  <span class=\"icon-right\">\n    <span>\n      <svg-icon\n        [svgClass]=\"'calendar'\"\n        [name]=\"calendarIcon\"\n      ></svg-icon>\n    </span>\n  </span>\n\n  <span class=\"icon-warning icon-warning_optional-offset\" *ngIf=\"showError\">\n    <svg-icon [name]=\"warningIcon\"></svg-icon>\n  </span>\n</div>\n\n<app-input-errors\n  *ngIf=\"showError\"\n  [errors]=\"ngControl.errors\"\n  [touched]=\"ngControl.touched\"\n></app-input-errors>\n",
        styles: ["/*!*\n * This file is part of the MedSafe application which is commercial software created by MedVision360 B.V.\n * The source code is proprietary and confidential.\n * Unauthorized copying of this file, via any medium is strictly prohibited.\n *\n * Copyright (c) by MedVision360 B.V. All rights reserved.\n *\n * For the application name: io.medrecord.medsafe\n *//*!*\n * This file is part of the MedSafe application which is commercial software created by MedVision360 B.V.\n * The source code is proprietary and confidential.\n * Unauthorized copying of this file, via any medium is strictly prohibited.\n *\n * Copyright (c) by MedVision360 B.V. All rights reserved.\n *\n * For the application name: io.medrecord.medsafe\n */:host{display:block}:host .clear{width:8px}:host .clear path{fill:var(--secondary-color)}:host .clear circle{fill:var(--white-color);fill:var(--secondary-color)}:host .clear circle~path{fill:var(--white-color)}:host .clear rect~path{fill:var(--white-color);stroke:var(--secondary-color)}:host .clear rect~path+path{fill:var(--secondary-color)}:host .clear .inverted-stroke{stroke:var(--secondary-color)}:host .clear .inverted-fill{fill:var(--white-color)}:host .clear:hover path{fill:var(--secondary-hover-color)}:host .clear:hover circle{fill:var(--white-hover-color);fill:var(--secondary-hover-color)}:host .clear:hover circle~path{fill:var(--white-hover-color)}:host .clear:hover rect~path{fill:var(--white-hover-color);stroke:var(--secondary-hover-color)}:host .clear:hover rect~path+path{fill:var(--secondary-hover-color)}:host .clear:hover .inverted-stroke{stroke:var(--secondary-hover-color)}:host .clear:hover .inverted-fill{fill:var(--white-hover-color)}:host .clear:active path{fill:var(--secondary-pressed-color)}:host .clear:active circle{fill:var(--white-pressed-color);fill:var(--secondary-pressed-color)}:host .clear:active circle~path{fill:var(--white-pressed-color)}:host .clear:active rect~path{fill:var(--white-pressed-color);stroke:var(--secondary-pressed-color)}:host .clear:active rect~path+path{fill:var(--secondary-pressed-color)}:host .clear:active .inverted-stroke{stroke:var(--secondary-pressed-color)}:host .clear:active .inverted-fill{fill:var(--white-pressed-color)}:host .clear:focus path{fill:var(--secondary-pressed-color)}:host .clear:focus circle{fill:var(--white-pressed-color);fill:var(--secondary-pressed-color)}:host .clear:focus circle~path{fill:var(--white-pressed-color)}:host .clear:focus rect~path{fill:var(--white-pressed-color);stroke:var(--secondary-pressed-color)}:host .clear:focus rect~path+path{fill:var(--secondary-pressed-color)}:host .clear:focus .inverted-stroke{stroke:var(--secondary-pressed-color)}:host .clear:focus .inverted-fill{fill:var(--white-pressed-color)}:host .clear:disabled path{fill:var(--secondary-disabled-color)}:host .clear:disabled circle{fill:var(--white-disabled-color);fill:var(--secondary-disabled-color)}:host .clear:disabled circle~path{fill:var(--white-disabled-color)}:host .clear:disabled rect~path{fill:var(--white-disabled-color);stroke:var(--secondary-disabled-color)}:host .clear:disabled rect~path+path{fill:var(--secondary-disabled-color)}:host .clear:disabled .inverted-stroke{stroke:var(--secondary-disabled-color)}:host .clear:disabled .inverted-fill{fill:var(--white-disabled-color)}:host .clear:hover>path{fill:var(--warning-color)!important}:host .calendar path{fill:var(--primary-color)}:host .calendar circle{fill:var(--white-color);fill:var(--primary-color)}:host .calendar circle~path{fill:var(--white-color)}:host .calendar rect~path{fill:var(--white-color);stroke:var(--primary-color)}:host .calendar rect~path+path{fill:var(--primary-color)}:host .calendar .inverted-stroke{stroke:var(--primary-color)}:host .calendar .inverted-fill{fill:var(--white-color)}:host .calendar:hover path{fill:var(--primary-hover-color)}:host .calendar:hover circle{fill:var(--white-hover-color);fill:var(--primary-hover-color)}:host .calendar:hover circle~path{fill:var(--white-hover-color)}:host .calendar:hover rect~path{fill:var(--white-hover-color);stroke:var(--primary-hover-color)}:host .calendar:hover rect~path+path{fill:var(--primary-hover-color)}:host .calendar:hover .inverted-stroke{stroke:var(--primary-hover-color)}:host .calendar:hover .inverted-fill{fill:var(--white-hover-color)}:host .calendar:active path{fill:var(--primary-pressed-color)}:host .calendar:active circle{fill:var(--white-pressed-color);fill:var(--primary-pressed-color)}:host .calendar:active circle~path{fill:var(--white-pressed-color)}:host .calendar:active rect~path{fill:var(--white-pressed-color);stroke:var(--primary-pressed-color)}:host .calendar:active rect~path+path{fill:var(--primary-pressed-color)}:host .calendar:active .inverted-stroke{stroke:var(--primary-pressed-color)}:host .calendar:active .inverted-fill{fill:var(--white-pressed-color)}:host .calendar:focus path{fill:var(--primary-pressed-color)}:host .calendar:focus circle{fill:var(--white-pressed-color);fill:var(--primary-pressed-color)}:host .calendar:focus circle~path{fill:var(--white-pressed-color)}:host .calendar:focus rect~path{fill:var(--white-pressed-color);stroke:var(--primary-pressed-color)}:host .calendar:focus rect~path+path{fill:var(--primary-pressed-color)}:host .calendar:focus .inverted-stroke{stroke:var(--primary-pressed-color)}:host .calendar:focus .inverted-fill{fill:var(--white-pressed-color)}:host .calendar:disabled path{fill:var(--primary-disabled-color)}:host .calendar:disabled circle{fill:var(--white-disabled-color);fill:var(--primary-disabled-color)}:host .calendar:disabled circle~path{fill:var(--white-disabled-color)}:host .calendar:disabled rect~path{fill:var(--white-disabled-color);stroke:var(--primary-disabled-color)}:host .calendar:disabled rect~path+path{fill:var(--primary-disabled-color)}:host .calendar:disabled .inverted-stroke{stroke:var(--primary-disabled-color)}:host .calendar:disabled .inverted-fill{fill:var(--white-disabled-color)}:host .calendar:hover>path{fill:var(--warning-color)!important}:host .picker-wrapper{width:100%;position:relative}:host .picker-wrapper_no-margin{margin-bottom:0}:host.form-control-styles{margin-bottom:24px}:host .input-warning{position:absolute;top:50%;transform:translate(0,-50%);left:20px}:host .icon-right{position:absolute;top:50%;transform:translate(0,-50%);right:20px}:host .icon-warning{position:absolute;top:50%;transform:translate(0,-50%);right:20px}:host .icon-warning_optional-offset{right:50px}:host .description{position:absolute;top:50%;transform:translate(0,-50%);margin-left:20px;white-space:nowrap}:host .input{background-color:var(--athens-darken-color);border-radius:5px;border:2px solid transparent;outline:0;height:40px;width:100%;padding:0 17px;box-sizing:border-box;font-size:13px}:host .input::-moz-placeholder{color:var(--secondary-color)}:host .input:-ms-input-placeholder{color:var(--secondary-color)}:host .input:-moz-placeholder{color:var(--secondary-color)}:host .input:hover{border-color:var(--athens-darken-hover-color);background-color:var(--athens-darken-hover-color)}:host .input:focus{border-color:var(--geyser-color);background-color:var(--white-color)}:host .input_warning{border-color:var(--warning-color)!important;background-color:var(--athens-darken-color)}:host .input_warning:focus{border-color:var(--geyser-color)!important;background-color:var(--white-color)}:host .input_warning:hover{border-color:var(--warning-hover-color)!important;background-color:var(--athens-darken-hover-color)}:host .input::-webkit-input-placeholder{color:var(--secondary-color);color:var(--hit-gray-color)}:host .input::-moz-placeholder{color:var(--hit-gray-color)}:host .input:-ms-input-placeholder{color:var(--hit-gray-color)}:host .input:-moz-placeholder{color:var(--hit-gray-color)}:host .input_icon-left{padding-left:56px}:host .input_icon-right-double{padding-right:76px!important}:host .input_icon-right{padding-right:48px}:host .date-time-picker-dropdown{background-color:var(--white-color);padding:10px 5px;box-shadow:0 0 2px rgba(var(--black-color),.4);width:-webkit-fit-content;width:-moz-fit-content;width:fit-content;position:absolute;z-index:10000}:host .open{display:block;opacity:1;-webkit-animation:.4s forwards showMenu;animation:.4s forwards showMenu}:host .close{display:none;opacity:0;-webkit-animation:.4s forwards hideMenu;animation:.4s forwards hideMenu}@-webkit-keyframes showMenu{from{opacity:0}to{opacity:1;display:block}}@keyframes showMenu{from{opacity:0}to{opacity:1;display:block}}@-webkit-keyframes hideMenu{from{opacity:1}to{opacity:0;display:none}}@keyframes hideMenu{from{opacity:1}to{opacity:0;display:none}}"]
    }),
    __param(0, Self()), __param(0, Optional())
], DateTimeInputComponent);
export { DateTimeInputComponent };
//# sourceMappingURL=data:application/json;base64, 