Added the Open Mobile app to the navbar when on small devices (mobile)

src/Ombi/ClientApp/src/app/app.component.html

@@ -170,7 +170,17 @@
 
 
 <div>
-    <app-my-nav id="main-container dark" [showNav]="showNav" [isAdmin]="isAdmin" [applicationName]="applicationName" [applicationLogo]="customizationSettings?.logo" [username]="username" [email]="user?.email " (logoutClick)="logOut();">
+    <app-my-nav id="main-container dark"
+        [showNav]="showNav"
+        [isAdmin]="isAdmin"
+        [applicationName]="applicationName"
+        [applicationLogo]="customizationSettings?.logo"
+        [username]="username"
+        [email]="user?.email"
+        [accessToken]="accessToken"
+        [applicationUrl]="customizationSettings?.applicationUrl"
+        (logoutClick)="logOut();"
+    >
     </app-my-nav>
 
 

src/Ombi/ClientApp/src/app/app.component.ts

@@ -33,6 +33,7 @@ export class AppComponent implements OnInit {
     public applicationName: string = "Ombi"
     public isAdmin: boolean;
     public username: string;
+    public accessToken: string;
 
     private hubConnected: boolean;
 
@@ -55,6 +56,7 @@ export class AppComponent implements OnInit {
         if (this.authService.loggedIn()) {
             this.user = this.authService.claims();
             this.username = this.user.name;
+            this.identity.getAccessToken().subscribe(x => this.accessToken = x);
             if (!this.hubConnected) {
                 this.signalrNotification.initialize();
                 this.hubConnected = true;

src/Ombi/ClientApp/src/app/my-nav/my-nav.component.html

@@ -28,6 +28,13 @@
                 </div>
             </span>
 
+            <span mat-list-item  >
+            <a mat-list-item [disableRipple]="true" id="nav-openMobile" [routerLinkActive]="'active-list-item'"
+                aria-label="Toggle sidenav" (click)="openMobileApp($event);">
+                <i class="fa-lg fas fa-mobile-alt  icon-spacing"></i>
+                &nbsp;{{ 'NavigationBar.OpenMobileApp' | translate }}
+            </a></span>
+
             <a mat-list-item [disableRipple]="true"   class="menu-spacing" id="nav-logout" [routerLinkActive]="'active-list-item'"
                 aria-label="Toggle sidenav" (click)="logOut();">
                 <i class="fa-lg fas fa-sign-out-alt  icon-spacing"></i>

src/Ombi/ClientApp/src/app/my-nav/my-nav.component.scss

@@ -107,10 +107,21 @@
     margin-right:5px;
 }
 
+#nav-openMobile {
+    display: none;
+}
+
 @media (max-width: 600px) {
     .profile-username{
         display:none;
     }
+
+}
+
+@media (max-width: 950px) {
+    #nav-openMobile {
+        display: block;
+    }
 }
 
 .profile-img img {

src/Ombi/ClientApp/src/app/my-nav/my-nav.component.ts

@@ -1,16 +1,17 @@
-import { Component, Input, Output, EventEmitter, OnInit } from '@angular/core';
 import { BreakpointObserver, Breakpoints } from '@angular/cdk/layout';
-import { Observable } from 'rxjs';
+import { Component, EventEmitter, Input, OnInit, Output } from '@angular/core';
-import { map } from 'rxjs/operators';
-import { INavBar } from '../interfaces/ICommon';
-import { StorageService } from '../shared/storage/storage-service';
-import { SettingsService, SettingsStateService } from '../services';
-import { MatSlideToggleChange } from '@angular/material/slide-toggle';
-import { SearchFilter } from './SearchFilter';
-import { Md5 } from 'ts-md5/dist/md5';
 import { IUser, RequestType, UserType } from '../interfaces';
+import { SettingsService, SettingsStateService } from '../services';
+
 import { FilterService } from '../discover/services/filter-service';
 import { ILocalUser } from '../auth/IUserLogin';
+import { INavBar } from '../interfaces/ICommon';
+import { MatSlideToggleChange } from '@angular/material/slide-toggle';
+import { Md5 } from 'ts-md5/dist/md5';
+import { Observable } from 'rxjs';
+import { SearchFilter } from './SearchFilter';
+import { StorageService } from '../shared/storage/storage-service';
+import { map } from 'rxjs/operators';
 
 export enum SearchFilterType {
   Movie = 1,
@@ -34,6 +35,8 @@ export class MyNavComponent implements OnInit {
   @Input() public showNav: boolean;
   @Input() public applicationName: string;
   @Input() public applicationLogo: string;
+  @Input() public applicationUrl: string;
+  @Input() public accessToken: string;
   @Input() public username: string;
   @Input() public isAdmin: string;
   @Input() public email: string;
@@ -122,4 +125,12 @@ export class MyNavComponent implements OnInit {
     var fallback = this.applicationLogo ? this.applicationLogo : 'https://raw.githubusercontent.com/Ombi-app/Ombi/gh-pages/img/android-chrome-512x512.png';
     return `https://www.gravatar.com/avatar/${this.emailHash}?d=${fallback}`;
   }
+
+  public openMobileApp(event: any) {
+    event.preventDefault();
+
+    const url = `ombi://${this.applicationUrl}|${this.accessToken}`;
+    window.location.assign(url);
+}
+
 }