Get backend URL from env

docker-compose.yml

@@ -27,6 +27,8 @@ services:
       - api
     depends_on:
       - db
+    environment:
+      apiUrl: http://localhost:5000
 
   aria2c:
     build: components/aria2c/

ui/Dockerfile

@@ -12,12 +12,12 @@ RUN apt-get update && \
     npm install && \
     npm install --global bower gulp-cli && \
     bower --allow-root install
-
-
 
 # Building the ui component to obtain static files.
 RUN gulp build
 
+RUN mv env-prod.sh /ui/dist/
+
 #------------------------------ Production
 FROM nginx:alpine as production
 
@@ -32,13 +32,15 @@ COPY --from=builder /ui/dist/ /usr/share/nginx/html
 # Expose ports
 EXPOSE 80
 
+CMD sh /usr/share/nginx/html/env-prod.sh && nginx -g 'daemon off;'
+
 # Adding metadata as docker labels
 LABEL scorelab.bassa.name="Bassa Web production server" \
-      scorelab.bassa.description="Dockerfile for Bassa Web Nginx server" \
-      scorelab.bassa.url="https://github.com/scorelab/Bassa/wiki" \
-      scorelab.bassa.vcs-url="https://github.com/scorelab/Bassa" \
-      scorelab.bassa.vcs-ref=$VCS_REF \
-      scorelab.bassa.build-date=$BUILD_DATE \
-      scorelab.bassa.vendor="Sustainable Computing Research Group" \
-      scorelab.bassa.version="1.0" \
-      scorelab.bassa.schema-version="1.0"
+    scorelab.bassa.description="Dockerfile for Bassa Web Nginx server" \
+    scorelab.bassa.url="https://github.com/scorelab/Bassa/wiki" \
+    scorelab.bassa.vcs-url="https://github.com/scorelab/Bassa" \
+    scorelab.bassa.vcs-ref=$VCS_REF \
+    scorelab.bassa.build-date=$BUILD_DATE \
+    scorelab.bassa.vendor="Sustainable Computing Research Group" \
+    scorelab.bassa.version="1.0" \
+    scorelab.bassa.schema-version="1.0"

ui/Dockerfile.dev

@@ -19,16 +19,20 @@ RUN apt-get update && \
     npm install --global bower gulp-cli && \
     bower --allow-root install
 
+# Add environment variable values to env.js
+# ENV: apiUrl : backend url
+RUN sh env-dev.sh 
+
 # Starting gulp server
-CMD ["gulp", "serve"]
+CMD ["sh env-dev.sh &&" ,"gulp", "serve"]
 
 # labels to dockerfile
 LABEL scorelab.bassa.name="Bassa Web development server" \
-      scorelab.bassa.description="Dockerfile for Bassa Web" \
-      scorelab.bassa.url="https://github.com/scorelab/Bassa/wiki" \
-      scorelab.bassa.vcs-url="https://github.com/scorelab/Bassa" \
-      scorelab.bassa.vcs-ref=$VCS_REF \
-      scorelab.bassa.build-date=$BUILD_DATE \
-      scorelab.bassa.vendor="Sustainable Computing Research Group" \
-      scorelab.bassa.version="1.0" \
-      scorelab.bassa.schema-version="1.0"
+    scorelab.bassa.description="Dockerfile for Bassa Web" \
+    scorelab.bassa.url="https://github.com/scorelab/Bassa/wiki" \
+    scorelab.bassa.vcs-url="https://github.com/scorelab/Bassa" \
+    scorelab.bassa.vcs-ref=$VCS_REF \
+    scorelab.bassa.build-date=$BUILD_DATE \
+    scorelab.bassa.vendor="Sustainable Computing Research Group" \
+    scorelab.bassa.version="1.0" \
+    scorelab.bassa.schema-version="1.0"

ui/env-dev.sh

@@ -0,0 +1,5 @@
+
+pattern='  window.__env.apiUrl.*'
+replacement="  window.__env.apiUrl = '${apiUrl}';"
+
+sed -i -e 's,'"$pattern"','"$replacement"',' ./src/env.js

ui/env-prod.sh

@@ -0,0 +1,5 @@
+
+pattern='  window.__env.apiUrl.*'
+replacement="  window.__env.apiUrl = '${apiUrl}';"
+
+sed -i -e 's,'"$pattern"','"$replacement"',' /usr/share/nginx/html/env.js

ui/gulp/build.js

@@ -36,6 +36,7 @@ gulp.task('html', ['inject', 'partials'], function () {
 
   var htmlFilter = $.filter('*.html');
   var jsFilter = $.filter('**/*.js');
+  var envFilter = $.filter('*.js');
   var cssFilter = $.filter('**/*.css');
   var assets;
 
@@ -47,6 +48,10 @@ gulp.task('html', ['inject', 'partials'], function () {
     .pipe($.ngAnnotate())
     .pipe(uglify())
     .pipe(jsFilter.restore())
+    .pipe(envFilter)
+    .pipe($.ngAnnotate())
+    .pipe(uglify())
+    .pipe(envFilter.restore())
     .pipe(cssFilter)
     .pipe($.csso())
     .pipe(cssFilter.restore())

ui/src/app/index.js

@@ -1,10 +1,9 @@
 'use strict';
-// import { constants } from "./config";
 
 angular.module('bassa', ['ngAnimate', 'ngCookies', 'ngTouch',
   'ngSanitize', 'ui.router', 'ngMaterial', 'nvd3', 'app'])
 
-  .value('BassaUrl', "http://localhost:5000")
+  .value('BassaUrl', window.__env.apiUrl)
 
   .config(function ($stateProvider, $httpProvider, $urlRouterProvider, $mdThemingProvider,
                     $mdIconProvider, $qProvider) {

ui/src/env.js

@@ -0,0 +1,7 @@
+(function (window) {
+  window.__env = window.__env || {};
+
+  // Bassa API url
+  window.__env.apiUrl = 'http://localhost:5000';
+
+}(this));

ui/src/index.html

@@ -1,6 +1,7 @@
 <!doctype html>
 <html class="no-js" ng-app="bassa">
   <head>
+    <script src="env.js"></script>
     <meta charset="utf-8">
     <title>Bassa</title>
     <meta name="description" content="Automated Download Queue for Enterprise to take the best use of Internet bandwidth">