<div class="hidden-toolbar"></div>
<div class="toolbar">
  <div class="logo-wrapper">
    <div class="logo"
         (click)="navigateToInstitution()"
    >
      <img src="assets/images/unigelogo.svg"
           alt="Unige"
           class="unige-logo"
      >
    </div>
  </div>

  <div class="right-part">
    <ul class="menu">
      <li *ngFor="let menu of getListMenu()"
          (click)="navigate(menu.path)"
          [class.is-active]="currentPath == menu.path"
          [matTooltip]="menu.labelToTranslate | translate"
          [matTooltipPosition]="'right'"
      >
        <fa-icon [icon]="menu.icon"></fa-icon>
      </li>
    </ul>
    <dlcm-language-selector [currentLanguage]="currentLanguage"
                            (languageChange)="useLanguage($event)"
    >
    </dlcm-language-selector>


    <dlcm-theme-selector *ngIf="!isProduction || isDemoMode"
                         [(theme)]="theme"
    >
    </dlcm-theme-selector>

    <ul class="menu">
      <li *ngIf="logged"
          class="order"
          [matTooltip]="'app.toolbar.order' | translate"
          [matTooltipPosition]="'right'"
          (click)="openOrder()"
      >
        <span [matBadge]="numberMyOrderReadyNew"
              matBadgeColor="primary"
              matBadgeSize="small"
              [class.is-active]="currentPath == routesEnum.order"
              [matBadgeHidden]="numberMyOrderReadyNew === 0"
              matBadgeDescription="Counter of new order ready in my order"
        >
        <fa-icon icon="dolly-flatbed"
        ></fa-icon>
        </span>
      </li>

      <li *ngIf="logged"
          class="cart"
          [matTooltip]="'app.toolbar.cart' | translate"
          [matTooltipPosition]="'right'"
          (click)="openCart()"
      >
        <span [matBadge]="numberArchiveInCart"
              matBadgeColor="primary"
              matBadgeSize="small"
              [matBadgeHidden]="numberArchiveInCart === 0"
              matBadgeDescription="Counter of item in cart"
        >
        <fa-icon icon="shopping-cart"
        ></fa-icon>
        </span>
      </li>

      <ng-template [ngIf]="!logged"
                   [ngIfElse]="loggedOut"
      >
        <li class="login"
            [matTooltip]="'app.toolbar.login' | translate"
            [matTooltipPosition]="'right'"
            (click)="login()"
        >
          <fa-icon icon="sign-in-alt"></fa-icon>
        </li>
      </ng-template>

      <ng-template #loggedOut>
        <li class="logout">
          <dlcm-avatar [user]="user"
                       (logoutChange)="logout()"
          ></dlcm-avatar>
        </li>
      </ng-template>
    </ul>
  </div>
</div>