Sets base href

.travis.yml

@@ -30,6 +30,7 @@ addons:
   chrome: stable
 
 script:
+  - export BASE_HREF="/"
   - npm run ci
 
 deploy:

Dockerfile

@@ -25,7 +25,7 @@ COPY ./docker/substitute-env-variables.sh ./entrypoint.sh
 RUN chmod +x ./entrypoint.sh
 
 # Substitute environment variables in nginx configuration and index.html
-ENTRYPOINT ["./entrypoint.sh", "/usr/share/nginx/html/index.html,/etc/nginx/conf.d/default.conf", "PRODUCTION,API_URL,IRB_URL,HOME_ROUTE,PORT0"]
+ENTRYPOINT ["./entrypoint.sh", "/usr/share/nginx/html/index.html,/etc/nginx/conf.d/default.conf", "PRODUCTION,API_URL,IRB_URL,HOME_ROUTE,BASE_HREF,PORT0"]
 
 ### STAGE 3: Profit! ###
 CMD ["nginx", "-g", "daemon off;"]

package-lock.json

@@ -12291,9 +12291,9 @@
       "integrity": "sha512-YZo3K82SD7Riyi0E1EQPojLz7kpepnSQI9IyPbHHg1XXXevb5dJI7tpyN2ADxGcQbHG7vcyRHk0cbwqcQriUtg=="
     },
     "sartography-workflow-lib": {
-      "version": "0.0.176",
-      "resolved": "https://registry.npmjs.org/sartography-workflow-lib/-/sartography-workflow-lib-0.0.176.tgz",
-      "integrity": "sha512-eIYGwLMVDUXFEyu3SWIRsvCiMdswSQnJPJvuKH0vhl4i79Ts0ADolaAGo8Gn9Bukm7IMx7QnTXrqa4whJw+FMQ=="
+      "version": "0.0.177",
+      "resolved": "https://registry.npmjs.org/sartography-workflow-lib/-/sartography-workflow-lib-0.0.177.tgz",
+      "integrity": "sha512-lR+3MljVyWj6hPJ/a3bxKhBaZ0CoK5WxNVq6Xb3Qo6CiCbuzG/CJiE3jcS1fsgPDNyLHzCKlwpNH6z95pfPI2w=="
     },
     "sass": {
       "version": "1.23.3",

package.json

@@ -52,7 +52,7 @@
     "ngx-file-drop": "^8.0.8",
     "ngx-markdown": "^9.0.0",
     "rxjs": "~6.5.4",
-    "sartography-workflow-lib": "^0.0.176",
+    "sartography-workflow-lib": "^0.0.177",
     "tslib": "^1.11.1",
     "uuid": "^7.0.2",
     "zone.js": "^0.10.3"

src/app/app-routing.module.ts

@@ -1,6 +1,7 @@
-import {NgModule} from '@angular/core';
+import {APP_BASE_HREF} from '@angular/common';
+import {Injectable, NgModule} from '@angular/core';
 import {RouterModule, Routes} from '@angular/router';
-import {SessionRedirectComponent} from 'sartography-workflow-lib';
+import {AppEnvironment, SessionRedirectComponent} from 'sartography-workflow-lib';
 import {environment} from '../environments/environment.runtime';
 import {HomeComponent} from './home/home.component';
 import {ModelerComponent} from './modeler/modeler.component';
@@ -9,6 +10,14 @@ import {ReferenceFilesComponent} from './reference-files/reference-files.compone
 import {SignInComponent} from './sign-in/sign-in.component';
 import {SignOutComponent} from './sign-out/sign-out.component';
 
+@Injectable()
+export class ThisEnvironment implements AppEnvironment {
+  homeRoute = environment.homeRoute;
+  production = environment.production;
+  api = environment.api;
+  irbUrl = environment.irbUrl;
+  baseHref = environment.baseHref;
+}
 
 const routes: Routes = [
   {
@@ -59,7 +68,11 @@ const routes: Routes = [
       scrollOffset: [0, 84],
     })
   ],
-  exports: [RouterModule]
+  exports: [RouterModule],
+  providers: [
+    {provide: 'APP_ENVIRONMENT', useClass: ThisEnvironment},
+    {provide: APP_BASE_HREF, useValue: environment.baseHref},
+  ]
 })
 export class AppRoutingModule {
 }

src/app/app.module.ts

@@ -1,3 +1,4 @@
+import {APP_BASE_HREF} from '@angular/common';
 import {HTTP_INTERCEPTORS, HttpClientModule} from '@angular/common/http';
 import {Injectable, NgModule} from '@angular/core';
 import {FlexLayoutModule} from '@angular/flex-layout';
@@ -58,6 +59,7 @@ export class ThisEnvironment implements AppEnvironment {
   production = environment.production;
   api = environment.api;
   irbUrl = environment.irbUrl;
+  baseHref = environment.baseHref;
 }
 
 @NgModule({
@@ -127,11 +129,8 @@ export class ThisEnvironment implements AppEnvironment {
   providers: [
     {provide: MAT_FORM_FIELD_DEFAULT_OPTIONS, useValue: {appearance: 'outline'}},
     {provide: 'APP_ENVIRONMENT', useClass: ThisEnvironment},
-    {
-      provide: HTTP_INTERCEPTORS,
-      useClass: AuthInterceptor,
-      multi: true
-    },
+    {provide: APP_BASE_HREF, useValue: environment.baseHref},
+    {provide: HTTP_INTERCEPTORS, useClass: AuthInterceptor, multi: true},
   ]
 })
 export class AppModule {

src/environments/environment.runtime.ts

@@ -9,4 +9,5 @@ export const environment: AppEnvironment = {
   production: _has(ENV, 'production', '$PRODUCTION') ? (ENV.production === 'true') : false,
   api: _has(ENV, 'api', '$API_URL') ? ENV.api : 'http://localhost:5000/v1.0',
   irbUrl: _has(ENV, 'irbUrl', '$IRB_URL') ? ENV.irbUrl : 'http://localhost:5001',
+  baseHref: _has(ENV, 'baseHref', '$BASE_HREF') ? ENV.baseHref : (window as any)._app_base || '/',
 };

src/environments/environment.spec.ts

@@ -1,3 +1,4 @@
+import {AppEnvironment} from 'sartography-workflow-lib';
 import {_has, environment} from './environment.runtime';
 
 declare var ENV;
@@ -9,6 +10,7 @@ describe('Environments', () => {
     expect(environment.api).toEqual('apiRoot');
     expect(environment.irbUrl).toEqual('irbUrl');
     expect(environment.homeRoute).toEqual('home');
+    expect(environment.baseHref).toEqual('/');
   });
 
   it('should check if environment variables are defined', () => {
@@ -17,31 +19,37 @@ describe('Environments', () => {
       production: '$PRODUCTION',
       api: '$API_URL',
       irbUrl: '$IRB_URL',
+      baseHref: '$BASE_HREF',
     };
 
     expect(_has(env, 'homeRoute', '$HOME_ROUTE')).toBeFalse();
     expect(_has(env, 'production', '$PRODUCTION')).toBeFalse();
     expect(_has(env, 'api', '$API_URL')).toBeFalse();
     expect(_has(env, 'irbUrl', '$IRB_URL')).toBeFalse();
+    expect(_has(env, 'baseHref', '$BASE_HREF')).toBeFalse();
 
     env.homeRoute = undefined;
     env.production = undefined;
     env.api = undefined;
     env.irbUrl = undefined;
+    env.baseHref = undefined;
 
     expect(_has(env, 'homeRoute', '$HOME_ROUTE')).toBeFalse();
     expect(_has(env, 'production', '$PRODUCTION')).toBeFalse();
     expect(_has(env, 'api', '$API_URL')).toBeFalse();
     expect(_has(env, 'irbUrl', '$IRB_URL')).toBeFalse();
+    expect(_has(env, 'baseHref', '$BASE_HREF')).toBeFalse();
 
     env.homeRoute = 'something';
     env.production = 'something';
     env.api = 'something';
     env.irbUrl = 'something';
+    env.baseHref = 'something';
 
     expect(_has(env, 'homeRoute', '$HOME_ROUTE')).toBeTrue();
     expect(_has(env, 'production', '$PRODUCTION')).toBeTrue();
     expect(_has(env, 'api', '$API_URL')).toBeTrue();
     expect(_has(env, 'irbUrl', '$IRB_URL')).toBeTrue();
+    expect(_has(env, 'baseHref', '$BASE_HREF')).toBeTrue();
   });
 });

src/index.html

@@ -3,13 +3,18 @@
 <head>
   <meta charset="utf-8">
   <title>CR Connect - Configuration</title>
-  <base href="/">
+  <base href="$BASE_HREF">
   <script>
+    (function() {
+      window['_app_base'] = '/' + window.location.pathname.split('/')[1];
+    })();
+
     const ENV = {
       homeRoute: '$HOME_ROUTE',
       production: '$PRODUCTION',
       api: '$API_URL',
       irbUrl: '$IRB_URL',
+      baseHref: '$BASE_HREF',
     };
   </script>
   <meta content="width=device-width, initial-scale=1" name="viewport">