0.2.5 initial commit

Makefile incomplete

ui/src/app/components/badge-menu-button/badge-menu.component.html

@@ -0,0 +1,12 @@
+<div style="position: relative; margin-right: 1vh;">
+  <ion-icon
+    *ngIf="(badge$ | async) && !(menuFixedOpen$ | async)"
+    size="medium"
+    color="dark"
+    [class.ios-badge]="isIos"
+    [class.md-badge]="!isIos"
+    name="alert-outline"
+  >
+  </ion-icon>
+  <ion-menu-button color="dark"></ion-menu-button>
+</div>

ui/src/app/components/badge-menu-button/badge-menu.component.module.ts

@@ -0,0 +1,20 @@
+import { NgModule } from '@angular/core'
+import { CommonModule } from '@angular/common'
+import { BadgeMenuComponent } from './badge-menu.component'
+import { IonicModule } from '@ionic/angular'
+import { RouterModule } from '@angular/router'
+import { SharingModule } from 'src/app/modules/sharing.module'
+
+@NgModule({
+  declarations: [
+    BadgeMenuComponent,
+  ],
+  imports: [
+    CommonModule,
+    IonicModule,
+    RouterModule.forChild([]),
+    SharingModule,
+  ],
+  exports: [BadgeMenuComponent],
+})
+export class BadgeMenuComponentModule { }

ui/src/app/components/badge-menu-button/badge-menu.component.scss

@@ -0,0 +1,17 @@
+.ios-badge {
+  background-color: var(--ion-color-start9);
+  position: absolute;
+  top: 1px;
+  left: 62%;
+  border-radius: 5px;
+  z-index: 1;
+}
+
+.md-badge {
+  background-color: var(--ion-color-start9);
+  position: absolute;
+  top: -2px;
+  left: 56%;
+  border-radius: 5px;
+  z-index: 1;
+}

ui/src/app/components/badge-menu-button/badge-menu.component.ts

@@ -0,0 +1,27 @@
+import { Component } from '@angular/core'
+import { ServerModel } from '../../models/server-model'
+import { Observable } from 'rxjs'
+import { map } from 'rxjs/operators'
+import { SplitPaneTracker } from 'src/app/services/split-pane.service'
+import { isPlatform } from '@ionic/angular'
+
+@Component({
+  selector: 'badge-menu-button',
+  templateUrl: './badge-menu.component.html',
+  styleUrls: ['./badge-menu.component.scss'],
+})
+
+export class BadgeMenuComponent {
+  badge$: Observable<boolean>
+  menuFixedOpen$: Observable<boolean>
+  isIos: boolean
+
+  constructor (
+    private readonly serverModel: ServerModel,
+    private readonly splitPane: SplitPaneTracker,
+  ) {
+    this.menuFixedOpen$ = this.splitPane.$menuFixedOpenOnLeft$.asObservable()
+    this.badge$ = this.serverModel.watch().badge.pipe(map(i => i > 0))
+    this.isIos = isPlatform('ios')
+  }
+}