nycJSorg/angular-presentation

<codelab-online-indicator></codelab-online-indicator>
<mat-menu #userId="matMenu">
  <button mat-menu-item (click)="copyViewerId()">
    {{ syncSessionService.viewerId$ | async }}
  </button>
</mat-menu>

<div>
  {{ syncSessionService.hasActiveSession$ | async | json }}FOF
  <ng-container
    *ngIf="syncSessionService.hasActiveSession$ | async; else noSession"
  >
    <mat-card *isAdmin>
      <button mat-icon-button (click)="present()">
        <mat-icon>present_to_all</mat-icon>
      </button>
      <button mat-icon-button (click)="stop()">
        <mat-icon>cancel</mat-icon>
      </button>
    </mat-card>

    <button
      *isViewing
      mat-icon-button
      [matMenuTriggerFor]="userId"
      class="menu-button"
    >
      <mat-icon>more_vert</mat-icon>
    </button>

    <ng-container *isViewing>
      <div
        *ngIf="
          registrationService.currentUser$ | async as user;
          else registation
        "
      >
        <!--        {{user}}-->
      </div>
      <ng-template #registation>
        <div class="registration">
          <codelab-registration></codelab-registration>
        </div>
      </ng-template>
      <button mat-icon-button [matMenuTriggerFor]="userId" class="menu-button">
        <mat-icon>more_vert</mat-icon>
      </button>
    </ng-container>

    <ng-container *isPresenting>
      <button mat-icon-button [matMenuTriggerFor]="appMenu" class="menu-button">
        <mat-icon>more_vert</mat-icon>
      </button>
    </ng-container>

    <mat-menu #appMenu="matMenu">
      <button mat-menu-item (click)="administer()">
        <mat-icon>present_to_all</mat-icon>
        Admin
      </button>
    </mat-menu>
  </ng-container>
</div>

<ng-template #noSession>
  <button mat-icon-button [matMenuTriggerFor]="userId" class="menu-button">
    <mat-icon>more_vert</mat-icon>
  </button>

  <button
    mat-raised-button
    *ngIf="syncSessionService.canStartSession$ | async"
    style="cursor:pointer"
    (click)="start()"
  >
    ⚫️ start
  </button>
</ng-template>