<!--********************************************************************************
 * Copyright (c) 2015-2018 Contributors to the Eclipse Foundation
 *
 * See the NOTICE file(s) distributed with this work for additional
 * information regarding copyright ownership.
 *
 * This program and the accompanying materials are made available under the
 * terms of the Eclipse Public License v. 2.0 which is available at
 * http://www.eclipse.org/legal/epl-2.0.
 *
 * SPDX-License-Identifier: EPL-2.0
 *
 ********************************************************************************-->

<div class="input-group" dropdown [autoClose]="'outsideClick'" style="width: 100%">
  <input type="text" class="form-control input-sm" placeholder="TT.MM.JJJJ HH:MM" [value]="date | date:'dd.MM.yyyy HH:mm'" (input)="setDate($event.target.value)" [disabled]="disabled">
  <span *ngIf="!disabled" class="input-group-addon"  title="{{TtlSelectDate}}" style="cursor:pointer; border-radius: 4px; padding-right: 12px; width: 1%; border-top-left-radius: 0; border-bottom-left-radius: 0;" dropdownToggle>
    <em class="glyphicon glyphicon-calendar"></em>
  </span>
  <span *ngIf="disabled" class="input-group-addon" style="cursor: not-allowed; border-radius: 4px; padding-right: 12px; width: 1%; border-top-left-radius: 0; border-bottom-left-radius: 0;">
    <em class="glyphicon glyphicon-calendar"></em>
  </span>
  <ul class="dropdown-menu" *dropdownMenu>
    <datepicker [(ngModel)]="date" [showWeeks]="false" (selectionDone)="onSelectionDone($event);"></datepicker>
  </ul>
</div>