97 lines
4.6 KiB
HTML
97 lines
4.6 KiB
HTML
<mat-sidenav-container autosize class='main-container'>
|
|
<mat-sidenav #sideNav [mode]="isMobile ? 'push' : 'side'" [opened]='!isMobile' disableClose='!isMobile' class="side-panel">
|
|
<mat-toolbar class='nav-toolbar'>
|
|
|
|
<!-- logo -->
|
|
<mat-toolbar-row>
|
|
<img src='/assets/img/openslides-logo-dark.png' alt='OpenSlides-logo'>
|
|
</mat-toolbar-row>
|
|
</mat-toolbar>
|
|
|
|
<!-- User Menu -->
|
|
<mat-expansion-panel class='user-menu mat-elevation-z0'>
|
|
<mat-expansion-panel-header>
|
|
<!-- Get the username from operator -->
|
|
{{username}}
|
|
</mat-expansion-panel-header>
|
|
<mat-action-row>
|
|
<button (click)='logOutButton()' mat-button>Logout</button>
|
|
</mat-action-row>
|
|
</mat-expansion-panel>
|
|
|
|
<!-- navigation -->
|
|
<mat-nav-list class='main-nav'>
|
|
<a [@navItemAnim] *appOsPerms="['core.can_see_frontpage']" mat-list-item routerLink='/' routerLinkActive='active' (click)='isMobile ? sideNav.toggle() : null'>
|
|
<fa-icon icon='home'></fa-icon>
|
|
<span translate>Home</span>
|
|
</a>
|
|
<a [@navItemAnim] *appOsPerms="['agenda.can_see']" mat-list-item routerLink='/agenda' routerLinkActive='active' (click)='isMobile ? sideNav.toggle() : null'>
|
|
<fa-icon icon='calendar'></fa-icon>
|
|
<span translate>Agenda</span>
|
|
</a>
|
|
<a [@navItemAnim] *appOsPerms="['motions.can_see']" mat-list-item routerLink='/motions' routerLinkActive='active' (click)='isMobile ? sideNav.toggle() : null'>
|
|
<fa-icon icon='file-alt'></fa-icon>
|
|
<span translate>Motions</span>
|
|
</a>
|
|
<a [@navItemAnim] *appOsPerms="['assignments.can_see']" mat-list-item routerLink='/assignments' routerLinkActive='active'
|
|
(click)='isMobile ? sideNav.toggle() : null'>
|
|
<fa-icon icon='chart-pie'></fa-icon>
|
|
<span translate>Assignments</span>
|
|
</a>
|
|
<a [@navItemAnim] *appOsPerms="['users.can_see_name']" mat-list-item routerLink='/users' routerLinkActive='active' (click)='isMobile ? sideNav.toggle() : null'>
|
|
<fa-icon icon='user'></fa-icon>
|
|
<span translate>Participants</span>
|
|
</a>
|
|
<a [@navItemAnim] *appOsPerms="['mediafiles.can_see']" mat-list-item routerLink='/mediafiles' routerLinkActive='active' (click)='isMobile ? sideNav.toggle() : null'>
|
|
<fa-icon icon='paperclip'></fa-icon>
|
|
<span translate>Files</span>
|
|
</a>
|
|
<a [@navItemAnim] *appOsPerms="['core.can_manage_config']" mat-list-item routerLink='/settings' routerLinkActive='active'
|
|
(click)='isMobile ? sideNav.toggle() : null'>
|
|
<fa-icon icon='cog'></fa-icon>
|
|
<span translate>Settings</span>
|
|
</a>
|
|
</mat-nav-list>
|
|
|
|
</mat-sidenav>
|
|
|
|
<!-- the first toolbar row is (still) a global element
|
|
the second one shall be handled by the apps -->
|
|
<mat-toolbar color='primary'>
|
|
|
|
<!-- show/hide menu button -->
|
|
<!-- <button mat-icon-button (click)='sideNav.toggle()'> -->
|
|
<button mat-icon-button *ngIf="isMobile" (click)='sideNav.toggle()'>
|
|
<fa-icon icon='bars'></fa-icon>
|
|
</button>
|
|
|
|
<!-- glob search and generic menu on the right -->
|
|
<span class='spacer'></span>
|
|
<button mat-icon-button (click)='sideNav.toggle()'>
|
|
<fa-icon icon='search'></fa-icon>
|
|
</button>
|
|
<button mat-icon-button (click)='sideNav.toggle()'>
|
|
<fa-icon icon='ellipsis-v'></fa-icon>
|
|
</button>
|
|
<button mat-icon-button [matMenuTriggerFor]="languageMenu">
|
|
<fa-icon icon='language'></fa-icon>
|
|
</button>
|
|
|
|
<!-- TODO: Could use translate.getLangs() to fetch available languages-->
|
|
<mat-menu #languageMenu="matMenu">
|
|
<button mat-menu-item (click)='selectLang("en")' translate>English</button>
|
|
<button mat-menu-item (click)='selectLang("de")' translate>German</button>
|
|
<button mat-menu-item (click)='selectLang("fr")' translate>French</button>
|
|
</mat-menu>
|
|
</mat-toolbar>
|
|
|
|
<!-- continue with <mat-toolbar> in the app-->
|
|
<main [@pageTransition]="o.isActivated ? o.activatedRoute : ''">
|
|
<router-outlet #o="outlet"></router-outlet>
|
|
</main>
|
|
|
|
<!-- the global projector button -->
|
|
<button class='projector-button' mat-fab>
|
|
<fa-icon icon='video'></fa-icon>
|
|
</button>
|
|
</mat-sidenav-container> |