Fixes relative paths on browsers

apache-cordova/arsnova-click-app/config.xml

@@ -21,6 +21,7 @@
         <allow-intent href="market:*" />
         <preference name="Scheme" value="https" />
         <preference name="ResolveServiceWorkerRequests" value="true" />
+        <preference name="AppendUserAgent" value="arsnova.click-cordova" />
     </platform>
     <platform name="ios">
         <allow-intent href="itms:*" />

src/app/header/header/header.component.html

@@ -2,11 +2,11 @@
      id="header">
   <div class="arsnova-logo d-flex align-items-center cursor-pointer">
     <a [routerLink]="interactiveLogo ? ['/'] : null" class="text-decoration-none" [class.d-md-none]="logoSize !== 'xs'">
-      <svg-icon src="./assets/images/logo.svg"></svg-icon>
+      <svg-icon [src]="(isCordovaApp ? '.' : '') + '/assets/images/logo.svg'"></svg-icon>
     </a>
     <a *ngIf="logoSize !== 'xs'"
        [routerLink]="interactiveLogo ? ['/'] : null" class="d-none d-md-block text-decoration-none">
-      <svg-icon src="./assets/images/logo.xl.svg"></svg-icon>
+      <svg-icon [src]="(isCordovaApp ? '.' : '') + '/assets/images/logo.xl.svg'"></svg-icon>
     </a>
   </div>
   <div *ngIf="showHeader"

src/app/header/header/header.component.ts

@@ -13,7 +13,6 @@ import { TrackingService } from '../../service/tracking/tracking.service';
 import { UpdateCheckService } from '../../service/update-check/update-check.service';
 import {MotdService} from '../../service/motd/motd.service';
 import {MotdDataService} from '../../service/motd/motd-data.service';
-import {SettingsService} from '../../service/settings/settings.service';
 import {environment} from '../../../environments/environment';
 
 @Component({
@@ -38,6 +37,7 @@ export class HeaderComponent implements OnInit, OnDestroy {
 
   public isCheckingForUpdates: boolean;
   public readonly version;
+  public readonly isCordovaApp: boolean = isPlatformServer(this.platformId) || !!((window as any)._cordovaNative);
 
   get storage(): StorageEstimate {
     return this._storage;
@@ -99,7 +99,7 @@ export class HeaderComponent implements OnInit, OnDestroy {
       }
     });
 
-    new Promise((resolve, reject) => {
+    new Promise<void>((resolve, reject) => {
       if ('storage' in navigator) {
         navigator.storage.estimate().then(storage => {
           this._storage = storage;

src/app/live-preview/live-preview/live-preview.component.html

@@ -5,7 +5,7 @@
   <img alt="phone-preview"
        class="w-100 position-absolute"
        draggable="false"
-       src="./assets/images/phone_empty.png"/>
+       [src]="(isCordovaApp ? '.' : '') + '/assets/images/phone_empty.png'"/>
   <div class="px-4 preview-content position-relative overflow-auto">
     <app-header [interactiveLogo]="false"
                 [logoSize]="'xs'"
@@ -33,7 +33,7 @@
   <img alt="phone-preview"
        class="w-100 position-absolute"
        draggable="false"
-       src="./assets/images/phone_empty.png"/>
+       [src]="(isCordovaApp ? '.' : '') + '/assets/images/phone_empty.png'"/>
   <div class="px-4 preview-content position-relative overflow-auto">
     <app-header [interactiveLogo]="false"
                 [logoSize]="'xs'"

src/app/live-preview/live-preview/live-preview.component.ts

-import { isPlatformBrowser } from '@angular/common';
+import { isPlatformBrowser, isPlatformServer } from '@angular/common';
 import { ChangeDetectionStrategy, ChangeDetectorRef, Component, Inject, Input, OnDestroy, OnInit, PLATFORM_ID } from '@angular/core';
 import { DomSanitizer } from '@angular/platform-browser';
 import { ActivatedRoute } from '@angular/router';
@@ -28,6 +28,7 @@ export class LivePreviewComponent implements OnInit, OnDestroy {
   private readonly _destroy = new Subject();
   private _questionIndex: number;
 
+  public readonly isCordovaApp: boolean = isPlatformServer(this.platformId) || !!((window as any)._cordovaNative);
   public readonly ENVIRONMENT_TYPE = LivePreviewEnvironment;
   public dataSource: Array<string>;
 

src/server.ts

@@ -70,7 +70,11 @@ export function app(): Express {
     const href = `theme-${theme}${hash ? '-' : ''}${hash}.css`;
     const logoHref = `theme/${theme}/logo_s32x32.png`;
     const indexHtmlContent = readFileSync(join(distFolder, indexHtml), {encoding: 'utf-8'});
-    const updatedIndexHtml = indexHtmlContent.replace(/theme-default.css/g, href).replace(/logo.svg/, logoHref);
+    let updatedIndexHtml = indexHtmlContent.replace(/theme-default.css/g, href).replace(/logo.svg/, logoHref);
+
+    if (!req.get('user-agent').includes('arsnova.click-cordova')) {
+      updatedIndexHtml = updatedIndexHtml.replace(/="\.\//g, '="/').replace('href="."', 'href="/"');
+    }
 
     res.render(indexHtml, {
       req,