Add initial support to add applinks

src/js/client.js

@@ -1844,6 +1844,38 @@ angular.module('Application').service('Client', ['$http', '$interval', '$timeout
         });
     };
 
+    Client.prototype.getApplinks = function (callback) {
+        get('/api/v1/applinks', null, function (error, data, status) {
+            if (error) return callback(error);
+            if (status !== 200) return callback(new ClientError(status, data));
+
+            // amend properties to mimick full app
+            data.applinks.forEach(function (applink) {
+                applink.fqdn = applink.upstreamUri; // this fqdn may contain the protocol!
+                applink.manifest = { addons: {}};
+                applink.installationState = ISTATES.INSTALLED;
+                applink.runState = RSTATES.RUNNING;
+                applink.health = HSTATES.HEALTHY;
+                applink.accessLevel = 'operator';
+            });
+
+            callback(null, data.applinks);
+        });
+    };
+
+    Client.prototype.addApplink = function (applink, callback) {
+        var data = {
+            upstreamUri: applink.upstreamUri
+        };
+
+        post('/api/v1/applinks', data, null, function (error, data, status) {
+            if (error) return callback(error);
+            if (status !== 201) return callback(new ClientError(status, data));
+
+            callback(null);
+        });
+    };
+
     Client.prototype.addUser = function (user, callback) {
         var data = {
             email: user.email,
@@ -2223,49 +2255,56 @@ angular.module('Application').service('Client', ['$http', '$interval', '$timeout
         this.getApps(function (error, apps) {
             if (error) return callback(error);
 
-            async.eachLimit(apps, 20, function (app, iteratorCallback) {
-                app.ssoAuth = (app.manifest.addons['ldap'] || app.manifest.addons['proxyAuth']) && app.sso;
+            that.getApplinks(function (error, applinks) {
+                if (error) return callback(error);
 
-                if (app.accessLevel !== 'operator' && app.accessLevel !== 'admin') { // only fetch if we have permissions
-                    app.progress = 0;
-                    app.message = '';
-                    app.taskMinutesActive = 0;
+                apps = apps.concat(applinks);
 
-                    that._updateAppCache(app);
+                async.eachLimit(apps, 20, function (app, iteratorCallback) {
+                    app.ssoAuth = (app.manifest.addons['ldap'] || app.manifest.addons['proxyAuth']) && app.sso;
 
-                    return iteratorCallback();
-                }
-
-                var getTaskFunc = app.taskId ? that.getAppTask.bind(null, app.id) : function (next) { return next(); };
-                getTaskFunc(function (error, task) {
-                    if (error) return iteratorCallback(error);
-
-                    if (task) {
-                        app.progress = task.percent;
-                        app.message = task.message;
-                        app.taskMinutesActive = moment.duration(moment.utc().diff(moment.utc(task.creationTime))).asMinutes();
-                    } else {
+                    if (app.accessLevel !== 'operator' && app.accessLevel !== 'admin') { // only fetch if we have permissions
                         app.progress = 0;
                         app.message = '';
                         app.taskMinutesActive = 0;
+
+                        that._updateAppCache(app);
+
+                        return iteratorCallback();
                     }
 
-                    that._updateAppCache(app);
+                    var getTaskFunc = app.taskId ? that.getAppTask.bind(null, app.id) : function (next) { return next(); };
+                    getTaskFunc(function (error, task) {
+                        if (error) return iteratorCallback(error);
 
-                    iteratorCallback();
+                        if (task) {
+                            app.progress = task.percent;
+                            app.message = task.message;
+                            app.taskMinutesActive = moment.duration(moment.utc().diff(moment.utc(task.creationTime))).asMinutes();
+                        } else {
+                            app.progress = 0;
+                            app.message = '';
+                            app.taskMinutesActive = 0;
+                        }
+
+                        that._updateAppCache(app);
+
+                        iteratorCallback();
+                    });
+                }, function iteratorDone(error) {
+                    if (error) return callback(error);
+
+
+                    // filter out old apps, going backwards to allow splicing
+                    for (var i = that._installedApps.length - 1; i >= 0; --i) {
+                        if (!apps.some(function (elem) { return (elem.id === that._installedApps[i].id); })) {
+                            var removed = that._installedApps.splice(i, 1);
+                            delete that._installedAppsById[removed[0].id];
+                        }
+                    }
+
+                    callback(null);
                 });
-            }, function iteratorDone(error) {
-                if (error) return callback(error);
-
-                // filter out old apps, going backwards to allow splicing
-                for (var i = that._installedApps.length - 1; i >= 0; --i) {
-                    if (!apps.some(function (elem) { return (elem.id === that._installedApps[i].id); })) {
-                        var removed = that._installedApps.splice(i, 1);
-                        delete that._installedAppsById[removed[0].id];
-                    }
-                }
-
-                callback(null);
             });
         });
     };

src/js/index.js

@@ -149,7 +149,9 @@ app.filter('applicationLink', function () {
         if (!app) return '';
 
         if (!app.pendingPostInstallConfirmation) {
-            return 'https://' + app.fqdn;
+            // app links have http already in the fqdn
+            if (app.fqdn.indexOf('http') !== 0) return 'https://' + app.fqdn;
+            else return app.fqdn;
         } else {
             return '';
         }

src/views/apps.html

@@ -31,6 +31,31 @@
   </div>
 </div>
 
+<!-- Modal applinks add -->
+<div class="modal fade" id="applinksAddModal" tabindex="-1" role="dialog">
+  <div class="modal-dialog">
+    <div class="modal-content">
+      <div class="modal-header">
+        <h4 class="modal-title">Add external app link</h4>
+      </div>
+      <div class="modal-body">
+        <form name="applinksAddForm" role="form" ng-submit="applinksAdd.submit()" autocomplete="off">
+          <div class="form-group" ng-class="{ 'has-error': (applinksAddForm.upstreamUri.$dirty && applinksAddForm.upstreamUri.$invalid) || (!applinksAddForm.upstreamUri.$dirty && applinksAdd.error.upstreamUri) }">
+            <label class="control-label">UpstreamURI</label>
+            <input type="text" class="form-control" ng-model="applinksAdd.upstreamUri" name="upstreamUri" id="inputUpstreamUri" autofocus autocomplete="off" required>
+          </div>
+
+          <input class="ng-hide" type="submit" ng-disabled="applinksAddForm.$invalid || applinksAdd.busy"/>
+        </form>
+      </div>
+      <div class="modal-footer">
+        <button type="button" class="btn btn-default" data-dismiss="modal">{{ 'main.dialog.close' | tr }}</button>
+        <button type="button" class="btn btn-success" ng-click="applinksAdd.submit()">{{ 'main.dialog.save' | tr }}</button>
+      </div>
+    </div>
+  </div>
+</div>
+
 <div class="content content-large">
 
     <!-- Workaround for select-all issue, see commit message -->
@@ -57,6 +82,7 @@
     <div class="animateMeOpacity ng-hide" ng-show="installedApps.length > 0">
       <h1 class="view-header">
         {{ 'apps.title' | tr }}
+        <button class="btn btn-outline" ng-click="applinksAdd.show()" uib-tooltip="Add Applink" tooltip-placement="right"><i class="fas fa-plus"></i></button>
         <div class="pull-right">
           <form class="form-inline">
             <input type="text" class="form-control" ng-show="installedApps.length > 8" placeholder="{{ 'apps.searchPlaceholder' | tr }}" id="appSearch" ng-model="appSearch"/>

src/views/apps.js

@@ -89,6 +89,32 @@ angular.module('Application').controller('AppsController', ['$scope', '$translat
         }
     };
 
+    $scope.applinksAdd = {
+        error: {},
+        busy: false,
+        upstreamUri: '',
+
+        show: function () {
+            $scope.applinksAdd.error = {};
+            $scope.applinksAdd.busy = false;
+            $scope.applinksAdd.upstreamUri = '';
+
+            $('#applinksAddModal').modal('show');
+
+            return false; // prevent propagation and default
+        },
+
+        submit: function () {
+            if (!$scope.applinksAdd.upstreamUri) return;
+
+            Client.addApplink({ upstreamUri: $scope.applinksAdd.upstreamUri }, function (error, result) {
+                if (error) return console.error('Failed to add applink', error);
+
+                $('#applinksAddModal').modal('hide');
+            });
+        }
+    };
+
     $scope.showAppConfigure = function (app, view) {
         $location.path('/app/' + app.id + '/' + view);
     };
@@ -136,6 +162,13 @@ angular.module('Application').controller('AppsController', ['$scope', '$translat
         });
     });
 
+    // setup all the dialog focus handling
+    ['applinksAddModal'].forEach(function (id) {
+        $('#' + id).on('shown.bs.modal', function () {
+            $(this).find("[autofocus]:first").focus();
+        });
+    });
+
     $('.collapse').on('shown.bs.collapse', function(){
         $(this).parent().find('.fa-angle-right').removeClass('fa-angle-right').addClass('fa-angle-down');
     }).on('hidden.bs.collapse', function(){