120 lines
4.4 KiB
HTML
120 lines
4.4 KiB
HTML
<ng-template [(tuiDialog)]="changeLogOpen"
|
|
[tuiDialogOptions]="{closable: false, dismissible: false, label: 'chat.changeLogDialog.label'|translate}">
|
|
<h3>{{ "version"|translate }}</h3>
|
|
<ul>
|
|
<li>{{ "chat.changeLogDialog.changeLog.1"|translate }}</li>
|
|
<li>{{ "chat.changeLogDialog.changeLog.2"|translate }}</li>
|
|
</ul>
|
|
|
|
<button tuiButton iconStart="@tui.check"
|
|
(click)="localStorage.setItem('changeLogLastRead', environment.version); changeLogOpen.set(false)">{{ "ok"|translate }}
|
|
</button>
|
|
</ng-template>
|
|
|
|
@if (serviceManager.currentSession() == null) {
|
|
<main style="width: 100%; height: 100svh; display: flex; justify-content: center; align-items: center;">
|
|
<tui-loader size="xl"/>
|
|
</main>
|
|
} @else {
|
|
@if (breakpoint() != "mobile") {
|
|
<main id="layout" tuiGroup [collapsed]="true">
|
|
<aside id="chatnav">
|
|
<aside>
|
|
<tui-segmented id="mode_switcher" [(activeItemIndex)]="navigationActiveIndex">
|
|
<button>
|
|
<tui-icon icon="@tui.message-circle"/>
|
|
</button>
|
|
<button>
|
|
<tui-icon icon="@tui.network"/>
|
|
</button>
|
|
<button disabled style="pointer-events: none; opacity: 0.5">
|
|
<tui-icon icon="@tui.image"/>
|
|
</button>
|
|
</tui-segmented>
|
|
|
|
<button id="bottom_btn" tuiButton appearance="flat" disabled>
|
|
<tui-icon icon="@tui.cog"/>
|
|
</button>
|
|
</aside>
|
|
|
|
<main>
|
|
@switch (navigationActiveIndex) {
|
|
@case (0) {
|
|
<app-dm-list [token]="serviceManager.currentSession()!.token"
|
|
[userid]="serviceManager.currentSession()!.userData.userid"></app-dm-list>
|
|
}
|
|
@case (1) {
|
|
<network-list [token]="serviceManager.currentSession()!.token"
|
|
[userid]="serviceManager.currentSession()!.userData.userid"></network-list>
|
|
}
|
|
}
|
|
</main>
|
|
</aside>
|
|
|
|
<main id="content">
|
|
<div id="content_tint">
|
|
@if (router.url.startsWith("/chat/dm")) {
|
|
<!-- To ensure data is loaded -->
|
|
@defer (when serviceManager.chatsStatus() != LoadStatus.loading) {
|
|
<router-outlet/>
|
|
}
|
|
} @else if (router.url.startsWith("/chat/network")) {
|
|
@defer (when serviceManager.networksStatus() != LoadStatus.loading) {
|
|
<router-outlet/>
|
|
}
|
|
} @else {
|
|
<router-outlet/>
|
|
}
|
|
</div>
|
|
</main>
|
|
</main>
|
|
} @else {
|
|
<main id="layout_mobile">
|
|
@if (!routerOutletActive()) {
|
|
<div id="navigation">
|
|
<div id="navigation_content">
|
|
@switch (navigationActiveIndex) {
|
|
@case (0) {
|
|
<app-dm-list [token]="serviceManager.currentSession()!.token"
|
|
[userid]="serviceManager.currentSession()!.userData.userid"></app-dm-list>
|
|
}
|
|
@case (1) {
|
|
<network-list [token]="serviceManager.currentSession()!.token"
|
|
[userid]="serviceManager.currentSession()!.userData.userid"></network-list>
|
|
}
|
|
}
|
|
</div>
|
|
|
|
<nav tuiTabBar [(activeItemIndex)]="navigationActiveIndex">
|
|
@for (item of tabBarItems; track item; let i = $index) {
|
|
<button
|
|
[disabled]="!item.implemented"
|
|
[class.disabled]="!item.implemented"
|
|
tuiTabBarItem
|
|
type="button"
|
|
[icon]="item.icon"
|
|
(click)="navigationActiveIndex = i"
|
|
>
|
|
{{ item.text | translate }}
|
|
</button>
|
|
}
|
|
</nav>
|
|
</div>
|
|
}
|
|
|
|
@if (router.url.startsWith("/chat/dm")) {
|
|
<!-- To ensure data is loaded -->
|
|
@defer (when serviceManager.chatsStatus() != LoadStatus.loading) {
|
|
<router-outlet (activate)="routerOutletActive.set(true)" (deactivate)="routerOutletActive.set(false)"/>
|
|
}
|
|
} @else if (router.url.startsWith("/chat/network")) {
|
|
@defer (when serviceManager.networksStatus() != LoadStatus.loading) {
|
|
<router-outlet (activate)="routerOutletActive.set(true)" (deactivate)="routerOutletActive.set(false)"/>
|
|
}
|
|
} @else {
|
|
<router-outlet (activate)="routerOutletActive.set(true)" (deactivate)="routerOutletActive.set(false)"/>
|
|
}
|
|
</main>
|
|
}
|
|
}
|