Updated site to use momentum for contacting, registration, gallery and calendar, as well as some other updates to the site content

src/app/components/navbar/navbar.component.html

@@ -18,10 +18,21 @@
 				<mat-menu #menu="matMenu">
 					<ng-container *ngFor="let section of group.children; let first = first">
 						<mat-divider *ngIf="!first"></mat-divider>
-						<button *ngFor="let item of section" mat-menu-item [routerLink]="item.url" [fragment]="item.fragment">
+						<button *ngFor="let item of section" mat-menu-item (click)="openItem(item)">
 							{{item.label}}
 						</button>
 					</ng-container>
+					<!-- Auth items, Members menu only -->
+					<ng-container *ngIf="group.label === 'Members'">
+						<mat-divider></mat-divider>
+						<ng-container *ngIf="momentum.isLoggedIn | async; else guestItems">
+							<button mat-menu-item (click)="momentum.api.auth.logout()">Logout</button>
+						</ng-container>
+						<ng-template #guestItems>
+							<button mat-menu-item (click)="momentum.api.auth.handleLogin()">Login</button>
+							<button mat-menu-item (click)="openItem({label:'Register', url:'/register'})">Register</button>
+						</ng-template>
+					</ng-container>
 				</mat-menu>
 			</ng-container>
 		</div>
@@ -30,7 +41,7 @@
 			<mat-icon>menu</mat-icon>
 		</button>
 		<mat-menu #menu="matMenu">
-			<button mat-menu-item *ngFor="let item of links.topLevel" [routerLink]="item.url" [fragment]="item.fragment">
+			<button mat-menu-item *ngFor="let item of links.topLevel" (click)="openItem(item)">>
 				{{item.label}}
 			</button>
 			<ng-container *ngFor="let group of links.other">

src/app/components/navbar/navbar.component.ts

@@ -1,8 +1,8 @@
 import {AfterViewInit, Component, EventEmitter, Input, OnDestroy, Output} from '@angular/core';
-import {ActivatedRoute, NavigationEnd, NavigationStart, Router} from '@angular/router';
+import {ActivatedRoute, NavigationStart, Router} from '@angular/router';
 import {combineLatest, filter, Subscription} from 'rxjs';
-import {NAVIGATION} from '../../misc/navigation';
-import {BreakpointService} from '../../services/breakpoint.service';
+import {NAVIGATION, NavigationItem} from '../../misc/navigation';
+import {MomentumService} from '../../services/momentum.service';
 
 @Component({
 	selector: 'xxx-navbar',
@@ -21,7 +21,7 @@ export class NavbarComponent implements AfterViewInit, OnDestroy {
 
 	@Output() hamburgerClick = new EventEmitter<void>();
 
-	constructor(private route: ActivatedRoute, private router: Router, public breakpoint: BreakpointService) { }
+	constructor(private route: ActivatedRoute, private router: Router, public momentum: MomentumService) { }
 
 	ngAfterViewInit() {
 		this.sub = combineLatest([this.router.events.pipe(filter((e: any) => e.navigationTrigger != 'popstate' || e instanceof NavigationStart)), this.route.fragment]).subscribe(([url, frag]) => {
@@ -34,6 +34,15 @@ export class NavbarComponent implements AfterViewInit, OnDestroy {
 		if(this.sub) this.sub.unsubscribe();
 	}
 
+	openItem(item: NavigationItem) {
+		// Full url
+		if(item.url.startsWith('http'))
+			location.href = item.url;
+		// Relative
+		else
+			this.router.navigate([item.url], {fragment: item.fragment});
+	}
+
 	scroll(id: string) {
 		const el = document.getElementById(id);
 		if(el) el.scrollIntoView({behavior: 'smooth'});