Fix text for custom apps

Using taskId only to update app info leads to various outdated states if
an app task has finished. We need to also update once the task has
finished at least once. So instead of individual app polling, we can
simply rely on the all apps listing api, which we poll anyways and not
rely on the restricted properties in the main apps view.

The app configure will fetch the updated full properties now, not
relying on the Clients internal caching

.gitignore

@@ -1,9 +1,6 @@
+dist/
 node_modules/
-coverage/
-webadmin/dist/
-installer/src/certs/server.key
 
 # vim swap files
 *.swp
 
-

.jshintrc

@@ -1,8 +0,0 @@
-{
-    "node": true,
-    "browser": true,
-    "unused": true,
-    "globalstrict": true,
-    "predef": [ "angular", "$" ],
-    "esnext": true
-}

LICENSE

@@ -1,5 +1,5 @@
 The Cloudron Subscription license
-Copyright (c) 2018 Cloudron UG
+Copyright (c) 2019 Cloudron UG
 
 With regard to the Cloudron Software:
 

README.md

@@ -1,4 +1,4 @@
-# Cloudron
+# Cloudron Dashboard
 
 [Cloudron](https://cloudron.io) is the best way to run apps on your server.
 
@@ -29,7 +29,7 @@ anyone to effortlessly host web applications on their server on their own terms.
 * Trivially migrate to another server keeping your apps and data (for example, switch your
   infrastructure provider or move to a bigger server).
 
-* Comprehensive [REST API](https://cloudron.io/documentation/developer/api/).
+* Comprehensive [REST API](https://cloudron.io/developer/api/).
 
 * [CLI](https://cloudron.io/documentation/cli/) to configure apps.
 
@@ -37,7 +37,7 @@ anyone to effortlessly host web applications on their server on their own terms.
 
 ## Demo
 
-Try our demo at https://my-demo.cloudron.me (username: cloudron password: cloudron).
+Try our demo at https://my.demo.cloudron.io (username: cloudron password: cloudron).
 
 ## Installing
 
@@ -59,6 +59,6 @@ the containers in the Cloudron.
 
 ## Community
 
-* [Chat](https://chat.cloudron.io/)
+* [Forum](https://forum.cloudron.io/)
 * [Support](mailto:support@cloudron.io)
 

gulpfile.js

@@ -7,242 +7,233 @@ var argv = require('yargs').argv,
     concat = require('gulp-concat'),
     cssnano = require('gulp-cssnano'),
     ejs = require('gulp-ejs'),
+    execSync = require('child_process').execSync,
     gulp = require('gulp'),
     rimraf = require('rimraf'),
     sass = require('gulp-sass'),
     serve = require('gulp-serve'),
-    sourcemaps = require('gulp-sourcemaps'),
-    uglify = require('gulp-uglify'),
-    url = require('url');
+    sourcemaps = require('gulp-sourcemaps');
 
-gulp.task('3rdparty', function () {
-    gulp.src([
-        'webadmin/src/3rdparty/**/*.js',
-        'webadmin/src/3rdparty/**/*.map',
-        'webadmin/src/3rdparty/**/*.css',
-        'webadmin/src/3rdparty/**/*.otf',
-        'webadmin/src/3rdparty/**/*.eot',
-        'webadmin/src/3rdparty/**/*.svg',
-        'webadmin/src/3rdparty/**/*.gif',
-        'webadmin/src/3rdparty/**/*.ttf',
-        'webadmin/src/3rdparty/**/*.woff',
-        'webadmin/src/3rdparty/**/*.woff2'
-        ])
-        .pipe(gulp.dest('webadmin/dist/3rdparty/'));
+if (argv.help || argv.h) {
+    console.log('Supported arguments for "gulp develop":');
+    console.log(' --api-origin <cloudron api uri>');
+    console.log(' --revision <revision>');
+    console.log(' --appstore-web-origin <appstore web uri>');
+    console.log(' --appstore-api-origin <appstore api uri>');
 
-    gulp.src('node_modules/bootstrap-sass/assets/javascripts/bootstrap.min.js')
-        .pipe(gulp.dest('webadmin/dist/3rdparty/js'));
+    process.exit(1);
+}
+
+const revision = argv.revision || '';
+
+let apiOrigin = '';
+if (argv.apiOrigin) {
+    if (argv.apiOrigin.indexOf('https://') === 0) apiOrigin = argv.apiOrigin;
+    else apiOrigin = 'https://' + argv.apiOrigin;
+}
+
+var appstore = {
+    webOrigin: argv.appstoreWebOrigin || '',
+    apiOrigin: argv.appstoreApiOrigin || ''
+}
+
+console.log();
+console.log('Cloudron API:          %s', apiOrigin || 'default');
+console.log('Building for revision: %s', revision);
+console.log();
+console.log('Overriding appstore origin:');
+console.log(' Website: %s', appstore.webOrigin || 'no');
+console.log(' Api:     %s', appstore.apiOrigin || 'no');
+console.log();
+
+gulp.task('fontawesome', function () {
+    return gulp.src([
+        'node_modules/@fortawesome/fontawesome-free/*css*/all.min.css',
+        'node_modules/@fortawesome/fontawesome-free/*webfonts*/*.eot',
+        'node_modules/@fortawesome/fontawesome-free/*webfonts*/*.svg',
+        'node_modules/@fortawesome/fontawesome-free/*webfonts*/*.ttf',
+        'node_modules/@fortawesome/fontawesome-free/*webfonts*/*.woff',
+        'node_modules/@fortawesome/fontawesome-free/*webfonts*/*.woff2'
+    ]).pipe(gulp.dest('dist/3rdparty/fontawesome/'));
 });
 
+gulp.task('bootstrap', function () {
+    return gulp.src('node_modules/bootstrap-sass/assets/javascripts/bootstrap.min.js')
+        .pipe(gulp.dest('dist/3rdparty/js'));
+});
+
+gulp.task('3rdparty-copy', function () {
+    return gulp.src([
+        'src/3rdparty/**/*.js',
+        'src/3rdparty/**/*.map',
+        'src/3rdparty/**/*.css',
+        'src/3rdparty/**/*.otf',
+        'src/3rdparty/**/*.eot',
+        'src/3rdparty/**/*.svg',
+        'src/3rdparty/**/*.gif',
+        'src/3rdparty/**/*.ttf'
+        ])
+        .pipe(gulp.dest('dist/3rdparty/'));
+});
+
+gulp.task('3rdparty', gulp.series(['3rdparty-copy', 'bootstrap', 'fontawesome']));
 
 // --------------
 // JavaScript
 // --------------
 
-if (argv.help || argv.h) {
-    console.log('Supported arguments for "gulp develop":');
-    console.log(' --client-id <clientId>');
-    console.log(' --client-secret <clientSecret>');
-    console.log(' --api-origin <cloudron api uri>');
-
-    process.exit(1);
-}
-
-gulp.task('js', ['js-index', 'js-logs', 'js-terminal', 'js-setup', 'js-setupdns', 'js-restore', 'js-update'], function () {});
-
-var oauth = {
-    clientId: argv.clientId || 'cid-webadmin',
-    clientSecret: argv.clientSecret || 'unused',
-    apiOrigin: argv.apiOrigin || '',
-    apiOriginHostname: argv.apiOrigin ? url.parse(argv.apiOrigin).hostname : ''
-};
-
-console.log();
-console.log('Using OAuth credentials:');
-console.log(' ClientId:      %s', oauth.clientId);
-console.log(' ClientSecret:  %s', oauth.clientSecret);
-console.log(' Cloudron API:  %s', oauth.apiOrigin || 'default');
-console.log(' Cloudron Host: %s', oauth.apiOriginHostname);
-console.log();
-
-
 gulp.task('js-index', function () {
-    // needs special treatment for error handling
-    var uglifyer = uglify();
-    uglifyer.on('error', function (error) {
-        console.error(error);
-    });
-
-    gulp.src([
-        'webadmin/src/js/index.js',
-        'webadmin/src/js/client.js',
-        'webadmin/src/js/appstore.js',
-        'webadmin/src/js/main.js',
-        'webadmin/src/views/*.js'
+    return gulp.src([
+        'src/js/index.js',
+        'src/js/client.js',
+        'src/js/main.js',
+        'src/views/*.js'
         ])
-        .pipe(ejs({ oauth: oauth }, {}, { ext: '.js' }))
+        .pipe(ejs({ apiOrigin: apiOrigin, revision: revision, appstore: appstore }, {}, { ext: '.js' }))
         .pipe(sourcemaps.init())
         .pipe(concat('index.js', { newLine: ';' }))
-        .pipe(uglifyer)
         .pipe(sourcemaps.write())
-        .pipe(gulp.dest('webadmin/dist/js'));
+        .pipe(gulp.dest('dist/js'));
 });
 
 gulp.task('js-logs', function () {
-    // needs special treatment for error handling
-    var uglifyer = uglify();
-    uglifyer.on('error', function (error) {
-        console.error(error);
-    });
-
-    gulp.src(['webadmin/src/js/logs.js', 'webadmin/src/js/client.js'])
-        .pipe(ejs({ oauth: oauth }, {}, { ext: '.js' }))
+    return gulp.src(['src/js/logs.js', 'src/js/client.js'])
+        .pipe(ejs({ apiOrigin: apiOrigin, appstore: appstore }, {}, { ext: '.js' }))
         .pipe(sourcemaps.init())
         .pipe(concat('logs.js', { newLine: ';' }))
-        .pipe(uglifyer)
         .pipe(sourcemaps.write())
-        .pipe(gulp.dest('webadmin/dist/js'));
+        .pipe(gulp.dest('dist/js'));
 });
 
 gulp.task('js-terminal', function () {
-    // needs special treatment for error handling
-    var uglifyer = uglify();
-    uglifyer.on('error', function (error) {
-        console.error(error);
-    });
-
-    gulp.src(['webadmin/src/js/terminal.js', 'webadmin/src/js/client.js'])
-        .pipe(ejs({ oauth: oauth }, {}, { ext: '.js' }))
+    return gulp.src(['src/js/terminal.js', 'src/js/client.js'])
+        .pipe(ejs({ apiOrigin: apiOrigin, appstore: appstore }, {}, { ext: '.js' }))
         .pipe(sourcemaps.init())
         .pipe(concat('terminal.js', { newLine: ';' }))
-        .pipe(uglifyer)
         .pipe(sourcemaps.write())
-        .pipe(gulp.dest('webadmin/dist/js'));
+        .pipe(gulp.dest('dist/js'));
+});
+
+gulp.task('js-login', function () {
+    return gulp.src(['src/js/login.js'])
+        .pipe(ejs({ apiOrigin: apiOrigin, appstore: appstore }, {}, { ext: '.js' }))
+        .pipe(sourcemaps.init())
+        .pipe(concat('login.js', { newLine: ';' }))
+        .pipe(sourcemaps.write())
+        .pipe(gulp.dest('dist/js'));
+});
+
+gulp.task('js-setupaccount', function () {
+    return gulp.src(['src/js/setupaccount.js'])
+        .pipe(ejs({ apiOrigin: apiOrigin, appstore: appstore }, {}, { ext: '.js' }))
+        .pipe(sourcemaps.init())
+        .pipe(concat('setupaccount.js', { newLine: ';' }))
+        .pipe(sourcemaps.write())
+        .pipe(gulp.dest('dist/js'));
 });
 
 gulp.task('js-setup', function () {
-    // needs special treatment for error handling
-    var uglifyer = uglify();
-    uglifyer.on('error', function (error) {
-        console.error(error);
-    });
-
-    gulp.src(['webadmin/src/js/setup.js', 'webadmin/src/js/client.js'])
-        .pipe(ejs({ oauth: oauth }, {}, { ext: '.js' }))
+    return gulp.src(['src/js/setup.js', 'src/js/client.js'])
+        .pipe(ejs({ apiOrigin: apiOrigin, appstore: appstore }, {}, { ext: '.js' }))
         .pipe(sourcemaps.init())
         .pipe(concat('setup.js', { newLine: ';' }))
-        .pipe(uglifyer)
         .pipe(sourcemaps.write())
-        .pipe(gulp.dest('webadmin/dist/js'));
+        .pipe(gulp.dest('dist/js'));
 });
 
 gulp.task('js-setupdns', function () {
-    // needs special treatment for error handling
-    var uglifyer = uglify();
-    uglifyer.on('error', function (error) {
-        console.error(error);
-    });
-
-    gulp.src(['webadmin/src/js/setupdns.js', 'webadmin/src/js/client.js'])
-        .pipe(ejs({ oauth: oauth }, {}, { ext: '.js' }))
+    return gulp.src(['src/js/setupdns.js', 'src/js/client.js'])
+        .pipe(ejs({ apiOrigin: apiOrigin, appstore: appstore }, {}, { ext: '.js' }))
         .pipe(sourcemaps.init())
         .pipe(concat('setupdns.js', { newLine: ';' }))
-        .pipe(uglifyer)
         .pipe(sourcemaps.write())
-        .pipe(gulp.dest('webadmin/dist/js'));
+        .pipe(gulp.dest('dist/js'));
 });
 
 gulp.task('js-restore', function () {
-    // needs special treatment for error handling
-    var uglifyer = uglify();
-    uglifyer.on('error', function (error) {
-        console.error(error);
-    });
-
-    gulp.src(['webadmin/src/js/restore.js', 'webadmin/src/js/client.js'])
-        .pipe(ejs({ oauth: oauth }, {}, { ext: '.js' }))
+    return gulp.src(['src/js/restore.js', 'src/js/client.js'])
+        .pipe(ejs({ apiOrigin: apiOrigin, appstore: appstore }, {}, { ext: '.js' }))
         .pipe(sourcemaps.init())
         .pipe(concat('restore.js', { newLine: ';' }))
-        .pipe(uglifyer)
         .pipe(sourcemaps.write())
-        .pipe(gulp.dest('webadmin/dist/js'));
-});
-
-
-gulp.task('js-update', function () {
-    // needs special treatment for error handling
-    var uglifyer = uglify();
-    uglifyer.on('error', function (error) {
-        console.error(error);
-    });
-
-    gulp.src(['webadmin/src/js/update.js'])
-        .pipe(sourcemaps.init())
-        .pipe(uglifyer)
-        .pipe(sourcemaps.write())
-        .pipe(gulp.dest('webadmin/dist/js'));
+        .pipe(gulp.dest('dist/js'));
 });
 
+gulp.task('js', gulp.series([ 'js-index', 'js-logs', 'js-terminal', 'js-login', 'js-setupaccount', 'js-setup', 'js-setupdns', 'js-restore' ]));
 
 // --------------
 // HTML
 // --------------
 
-gulp.task('html', ['html-views', 'html-templates'], function () {
-    return gulp.src('webadmin/src/*.html').pipe(ejs({ apiOriginHostname: oauth.apiOriginHostname }, {}, { ext: '.html' })).pipe(gulp.dest('webadmin/dist'));
-});
-
 gulp.task('html-views', function () {
-    return gulp.src('webadmin/src/views/**/*.html').pipe(gulp.dest('webadmin/dist/views'));
+    return gulp.src('src/views/**/*.html').pipe(gulp.dest('dist/views'));
 });
 
 gulp.task('html-templates', function () {
-    return gulp.src('webadmin/src/templates/**/*.html').pipe(gulp.dest('webadmin/dist/templates'));
+    return gulp.src('src/templates/**/*.html').pipe(gulp.dest('dist/templates'));
 });
 
+gulp.task('html-raw', function () {
+    return gulp.src('src/*.html').pipe(ejs({ apiOrigin: apiOrigin, revision: revision }, {}, { ext: '.html' })).pipe(gulp.dest('dist'));
+});
+
+gulp.task('html', gulp.series(['html-views', 'html-templates', 'html-raw']));
+
 // --------------
 // CSS
 // --------------
 
 gulp.task('css', function () {
-    return gulp.src('webadmin/src/*.scss')
+    return gulp.src('src/*.scss')
         .pipe(sourcemaps.init())
         .pipe(sass({ includePaths: ['node_modules/bootstrap-sass/assets/stylesheets/'] }).on('error', sass.logError))
         .pipe(autoprefixer())
         .pipe(cssnano())
         .pipe(sourcemaps.write())
-        .pipe(gulp.dest('webadmin/dist'));
+        .pipe(gulp.dest('dist'));
 });
 
 gulp.task('images', function () {
-    return gulp.src('webadmin/src/img/**')
-        .pipe(gulp.dest('webadmin/dist/img'));
+    return gulp.src('src/img/**')
+        .pipe(gulp.dest('dist/img'));
+});
+
+gulp.task('timezones', function (done) {
+    execSync('./scripts/createTimezones.js ./dist/js/timezones.js');
+    done();
 });
 
 // --------------
 // Utilities
 // --------------
 
-gulp.task('watch', ['default'], function () {
-    gulp.watch(['webadmin/src/*.scss'], ['css']);
-    gulp.watch(['webadmin/src/img/*'], ['images']);
-    gulp.watch(['webadmin/src/**/*.html'], ['html']);
-    gulp.watch(['webadmin/src/views/*.html'], ['html-views']);
-    gulp.watch(['webadmin/src/templates/*.html'], ['html-templates']);
-    gulp.watch(['webadmin/src/js/update.js'], ['js-update']);
-    gulp.watch(['webadmin/src/js/setup.js', 'webadmin/src/js/client.js'], ['js-setup']);
-    gulp.watch(['webadmin/src/js/setupdns.js', 'webadmin/src/js/client.js'], ['js-setupdns']);
-    gulp.watch(['webadmin/src/js/restore.js', 'webadmin/src/js/client.js'], ['js-restore']);
-    gulp.watch(['webadmin/src/js/logs.js', 'webadmin/src/js/client.js'], ['js-logs']);
-    gulp.watch(['webadmin/src/js/terminal.js', 'webadmin/src/js/client.js'], ['js-terminal']);
-    gulp.watch(['webadmin/src/js/index.js', 'webadmin/src/js/client.js', 'webadmin/src/js/appstore.js', 'webadmin/src/js/main.js', 'webadmin/src/views/*.js'], ['js-index']);
-    gulp.watch(['webadmin/src/3rdparty/**/*'], ['3rdparty']);
+gulp.task('clean', function (done) {
+    rimraf.sync('dist');
+    done();
 });
 
-gulp.task('clean', function () {
-    rimraf.sync('webadmin/dist');
+gulp.task('default', gulp.series(['clean', 'html', 'js', 'timezones', '3rdparty', 'images', 'css']));
+
+gulp.task('watch', function (done) {
+    gulp.watch(['src/*.scss'], gulp.series(['css']));
+    gulp.watch(['src/img/*'], gulp.series(['images']));
+    gulp.watch(['src/**/*.html'], gulp.series(['html']));
+    gulp.watch(['src/views/*.html'], gulp.series(['html-views']));
+    gulp.watch(['src/templates/*.html'], gulp.series(['html-templates']));
+    gulp.watch(['scripts/createTimezones.js'], gulp.series(['timezones']));
+    gulp.watch(['src/js/setup.js', 'src/js/client.js'], gulp.series(['js-setup']));
+    gulp.watch(['src/js/setupdns.js', 'src/js/client.js'], gulp.series(['js-setupdns']));
+    gulp.watch(['src/js/restore.js', 'src/js/client.js'], gulp.series(['js-restore']));
+    gulp.watch(['src/js/logs.js', 'src/js/client.js'], gulp.series(['js-logs']));
+    gulp.watch(['src/js/terminal.js', 'src/js/client.js'], gulp.series(['js-terminal']));
+    gulp.watch(['src/js/login.js'], gulp.series(['js-login']));
+    gulp.watch(['src/js/setupaccount.js'], gulp.series(['js-setupaccount']));
+    gulp.watch(['src/js/index.js', 'src/js/client.js', 'src/js/main.js', 'src/views/*.js'], gulp.series(['js-index']));
+    gulp.watch(['src/3rdparty/**/*'], gulp.series(['3rdparty']));
+    done();
 });
 
-gulp.task('default', ['clean', 'html', 'js', '3rdparty', 'images', 'css'], function () {});
+gulp.task('serve', serve({ root: 'dist', port: 4000 }));
+
+gulp.task('develop', gulp.series(['default', 'watch', 'serve']));
 
-gulp.task('develop', ['watch'], serve({ root: 'webadmin/dist', port: 4000 }));

package.json

@@ -1,111 +1,33 @@
 {
-  "name": "cloudron",
-  "description": "Main code for a cloudron",
+  "name": "dashboard",
   "version": "1.0.0",
-  "private": true,
-  "author": {
-    "name": "Cloudron authors"
+  "description": "[Cloudron](https://cloudron.io) is the best way to run apps on your server.",
+  "scripts": {
+    "test": "echo \"Error: no test specified\" && exit 1"
   },
   "repository": {
     "type": "git",
-    "url": "https://git.cloudron.io/cloudron/box.git"
-  },
-  "engines": {
-    "node": ">=4.0.0 <=4.1.1"
+    "url": "ssh://git@git.cloudron.io:6000/cloudron/dashboard.git"
   },
+  "author": "",
+  "license": "SEE LICENSE IN LICENSE",
   "dependencies": {
-    "@google-cloud/dns": "^0.7.0",
-    "@google-cloud/storage": "^1.2.1",
-    "@sindresorhus/df": "^2.1.0",
-    "async": "^2.6.0",
-    "aws-sdk": "^2.151.0",
-    "body-parser": "^1.18.2",
-    "cloudron-manifestformat": "^2.10.0",
-    "connect-ensure-login": "^0.1.1",
-    "connect-lastmile": "^1.0.2",
-    "connect-timeout": "^1.9.0",
-    "cookie-parser": "^1.3.5",
-    "cookie-session": "^1.3.2",
-    "cron": "^1.3.0",
-    "csurf": "^1.6.6",
-    "db-migrate": "^0.10.0-beta.24",
-    "db-migrate-mysql": "^1.1.10",
-    "debug": "^3.1.0",
-    "dockerode": "^2.5.3",
-    "ejs": "^2.5.7",
-    "ejs-cli": "^2.0.0",
-    "express": "^4.16.2",
-    "express-session": "^1.15.6",
-    "hat": "0.0.3",
-    "json": "^9.0.3",
-    "ldapjs": "^1.0.0",
-    "lodash.chunk": "^4.2.0",
-    "mime": "^2.0.3",
-    "moment-timezone": "^0.5.14",
-    "morgan": "^1.9.0",
-    "multiparty": "^4.1.2",
-    "mysql": "^2.15.0",
-    "nodemailer": "^4.4.0",
-    "nodemailer-smtp-transport": "^2.7.4",
-    "oauth2orize": "^1.11.0",
-    "once": "^1.3.2",
-    "parse-links": "^0.1.0",
-    "passport": "^0.4.0",
-    "passport-http": "^0.3.0",
-    "passport-http-bearer": "^1.0.1",
-    "passport-local": "^1.0.0",
-    "passport-oauth2-client-password": "^0.1.2",
-    "password-generator": "^2.2.0",
-    "progress-stream": "^2.0.0",
-    "proxy-middleware": "^0.15.0",
-    "recursive-readdir": "^2.2.1",
-    "request": "^2.83.0",
-    "s3-block-read-stream": "^0.2.0",
-    "safetydance": "^0.7.1",
-    "semver": "^5.4.1",
-    "showdown": "^1.8.2",
-    "split": "^1.0.0",
-    "superagent": "^3.8.1",
-    "supererror": "^0.7.1",
-    "tar-fs": "^1.16.0",
-    "tar-stream": "^1.5.5",
-    "tldjs": "^2.2.0",
-    "underscore": "^1.7.0",
-    "uuid": "^3.1.0",
-    "valid-url": "^1.0.9",
-    "validator": "^9.1.1",
-    "ws": "^3.3.1"
+    "@fortawesome/fontawesome-free": "^5.5.0",
+    "bootstrap-sass": "^3.4.1",
+    "gulp": "^4.0.0",
+    "gulp-autoprefixer": "^5.0.0",
+    "gulp-concat": "^2.6.1",
+    "gulp-cssnano": "^2.1.3",
+    "gulp-ejs": "^3.3.0",
+    "gulp-sass": "^4.0.2",
+    "gulp-serve": "^1.4.0",
+    "gulp-sourcemaps": "^2.6.5",
+    "rimraf": "^2.6.2",
+    "yargs": "^11.0.0"
   },
-  "devDependencies": {
-    "bootstrap-sass": "^3.3.3",
-    "expect.js": "*",
-    "gulp": "^3.9.1",
-    "gulp-autoprefixer": "^4.0.0",
-    "gulp-concat": "^2.4.3",
-    "gulp-cssnano": "^2.1.0",
-    "gulp-ejs": "^3.1.0",
-    "gulp-sass": "^3.1.0",
-    "gulp-serve": "^1.0.0",
-    "gulp-sourcemaps": "^2.6.1",
-    "gulp-uglify": "^3.0.0",
-    "hock": "^1.3.2",
-    "istanbul": "*",
-    "js2xmlparser": "^3.0.0",
-    "mocha": "*",
-    "mock-aws-s3": "git+https://github.com/cloudron-io/mock-aws-s3.git",
-    "nock": "^9.0.14",
-    "node-sass": "^4.6.1",
-    "readdirp": "https://registry.npmjs.org/readdirp/-/readdirp-2.1.0.tgz",
-    "yargs": "^10.0.3"
-  },
-  "scripts": {
-    "migrate_local": "DATABASE_URL=mysql://root:@localhost/box node_modules/.bin/db-migrate up",
-    "migrate_test": "BOX_ENV=test DATABASE_URL=mysql://root:@localhost/boxtest node_modules/.bin/db-migrate up",
-    "test": "npm run migrate_test && src/test/setupTest && BOX_ENV=test ./node_modules/istanbul/lib/cli.js test $1 ./node_modules/mocha/bin/_mocha -- --exit -R spec ./src/test ./src/routes/test/[^a]*",
-    "test_all": "npm run migrate_test && src/test/setupTest && BOX_ENV=test ./node_modules/istanbul/lib/cli.js test $1 ./node_modules/mocha/bin/_mocha -- --exit -R spec ./src/test ./src/routes/test",
-    "postmerge": "/bin/true",
-    "precommit": "/bin/true",
-    "prepush": "npm test",
-    "webadmin": "node_modules/.bin/gulp"
+  "eslintConfig": {
+    "env": {
+      "browser": true
+    }
   }
 }

scripts/addUsers.js

@@ -0,0 +1,66 @@
+#!/usr/bin/env node
+
+// This script creates many users to test the UI for such a case
+
+// WARNING keep those in sync with delUsers.js
+const USERNAME_PREFIX = 'manyuser';
+const PASSOWRD_PREFIX = 'password';
+const DISPLAYNAME_PREFIX = 'User ';
+const EMAIL_DOMAIN = 'example.com'; // addresses will be username@EMAIL_DOMAIN
+const COUNT = 100;
+
+var async = require('async'),
+    readlineSync = require('readline-sync'),
+    superagent = require('superagent');
+
+if (process.argv.length !== 3) {
+    console.log('Usage: ./addUsers.js <cloudronDomain>');
+    process.exit(1);
+}
+
+const cloudronDomain = process.argv[2];
+
+function getAccessToken(callback) {
+    let username = readlineSync.question('Username: ', {});
+    let password = readlineSync.question('Password: ', { noEchoBack: true });
+
+    superagent.post(`https://${cloudronDomain}/api/v1/developer/login`, { username: username, password: password }).end(function (error, result) {
+        if (error || result.statusCode !== 200) {
+            console.log('Login failed');
+            return getAccessToken(callback);
+        }
+
+        callback(result.body.accessToken);
+    });
+}
+
+console.log(`Login to ${cloudronDomain}`);
+getAccessToken(function (accessToken) {
+    console.log(`Now creating ${COUNT} users...`);
+
+    async.timesLimit(COUNT, 5, function (n, next) {
+        let user = {
+            username: USERNAME_PREFIX + n,
+            password: PASSOWRD_PREFIX + n,
+            email: USERNAME_PREFIX + n + '@' + EMAIL_DOMAIN,
+            displayName: DISPLAYNAME_PREFIX + n
+        };
+
+        superagent.post(`https://${cloudronDomain}/api/v1/users`, user).query({ access_token: accessToken }).end(function (error) {
+            if (error) return next(error);
+
+            process.stdout.write('.');
+
+            next();
+        });
+    }, function (error) {
+        console.log();
+
+        if (error) {
+            console.error(error);
+            process.exit(1);
+        }
+
+        console.log('Done');
+    });
+});

scripts/createTimezones.js

@@ -0,0 +1,387 @@
+#!/usr/bin/env node
+
+// This script creates a specific timezones.js to be consumed by the dashboard
+
+var execSync = require('child_process').execSync,
+    fs = require('fs'),
+    path = require('path');
+
+if (process.argv.length !== 3) {
+    console.log('Usage: createTimezones.js <output.js>');
+    process.exit(1);
+}
+
+const destinationFilePath = path.resolve(process.argv[2]);
+console.log('Creating timezone info at:', destinationFilePath);
+
+var ubuntuTimezones = execSync('timedatectl list-timezones --no-pager').toString().split('\n').filter(function (t) { return !!t; });
+
+// from https://github.com/dmfilipenko/timezones.json/blob/master/timezones.json
+var details = [
+    { name: 'UTC', offset: '+00:00' },
+    { name: 'Africa/Abidjan', offset: '+00:00' },
+    { name: 'Africa/Accra', offset: '+00:00' },
+    { name: 'Africa/Algiers', offset: '+01:00' },
+    { name: 'Africa/Bissau', offset: '+00:00' },
+    { name: 'Africa/Cairo', offset: '+02:00' },
+    { name: 'Africa/Casablanca', offset: '+01:00' },
+    { name: 'Africa/Ceuta', offset: '+01:00' },
+    { name: 'Africa/El_Aaiun', offset: '+00:00' },
+    { name: 'Africa/Johannesburg', offset: '+02:00' },
+    { name: 'Africa/Juba', offset: '+03:00' },
+    { name: 'Africa/Khartoum', offset: '+02:00' },
+    { name: 'Africa/Lagos', offset: '+01:00' },
+    { name: 'Africa/Maputo', offset: '+02:00' },
+    { name: 'Africa/Monrovia', offset: '+00:00' },
+    { name: 'Africa/Nairobi', offset: '+03:00' },
+    { name: 'Africa/Ndjamena', offset: '+01:00' },
+    { name: 'Africa/Tripoli', offset: '+02:00' },
+    { name: 'Africa/Tunis', offset: '+01:00' },
+    { name: 'Africa/Windhoek', offset: '+02:00' },
+    { name: 'America/Adak', offset: '−10:00' },
+    { name: 'America/Anchorage', offset: '−09:00' },
+    { name: 'America/Araguaina', offset: '−03:00' },
+    { name: 'America/Argentina/Buenos_Aires', offset: '−03:00' },
+    { name: 'America/Argentina/Catamarca', offset: '−03:00' },
+    { name: 'America/Argentina/Cordoba', offset: '−03:00' },
+    { name: 'America/Argentina/Jujuy', offset: '−03:00' },
+    { name: 'America/Argentina/La_Rioja', offset: '−03:00' },
+    { name: 'America/Argentina/Mendoza', offset: '−03:00' },
+    { name: 'America/Argentina/Rio_Gallegos', offset: '−03:00' },
+    { name: 'America/Argentina/Salta', offset: '−03:00' },
+    { name: 'America/Argentina/San_Juan', offset: '−03:00' },
+    { name: 'America/Argentina/San_Luis', offset: '−03:00' },
+    { name: 'America/Argentina/Tucuman', offset: '−03:00' },
+    { name: 'America/Argentina/Ushuaia', offset: '−03:00' },
+    { name: 'America/Asuncion', offset: '−04:00' },
+    { name: 'America/Atikokan', offset: '−05:00' },
+    { name: 'America/Bahia', offset: '−03:00' },
+    { name: 'America/Bahia_Banderas', offset: '−06:00' },
+    { name: 'America/Barbados', offset: '−04:00' },
+    { name: 'America/Belem', offset: '−03:00' },
+    { name: 'America/Belize', offset: '−06:00' },
+    { name: 'America/Blanc-Sablon', offset: '−04:00' },
+    { name: 'America/Boa_Vista', offset: '−04:00' },
+    { name: 'America/Bogota', offset: '−05:00' },
+    { name: 'America/Boise', offset: '−07:00' },
+    { name: 'America/Cambridge_Bay', offset: '−07:00' },
+    { name: 'America/Campo_Grande', offset: '−04:00' },
+    { name: 'America/Cancun', offset: '−05:00' },
+    { name: 'America/Caracas', offset: '−04:00' },
+    { name: 'America/Cayenne', offset: '−03:00' },
+    { name: 'America/Chicago', offset: '−06:00' },
+    { name: 'America/Chihuahua', offset: '−07:00' },
+    { name: 'America/Costa_Rica', offset: '−06:00' },
+    { name: 'America/Creston', offset: '−07:00' },
+    { name: 'America/Cuiaba', offset: '−04:00' },
+    { name: 'America/Curacao', offset: '−04:00' },
+    { name: 'America/Danmarkshavn', offset: '+00:00' },
+    { name: 'America/Dawson', offset: '−08:00' },
+    { name: 'America/Dawson_Creek', offset: '−07:00' },
+    { name: 'America/Denver', offset: '−07:00' },
+    { name: 'America/Detroit', offset: '−05:00' },
+    { name: 'America/Edmonton', offset: '−07:00' },
+    { name: 'America/Eirunepe', offset: '−05:00' },
+    { name: 'America/El_Salvador', offset: '−06:00' },
+    { name: 'America/Fort_Nelson', offset: '−07:00' },
+    { name: 'America/Fortaleza', offset: '−03:00' },
+    { name: 'America/Glace_Bay', offset: '−04:00' },
+    { name: 'America/Godthab', offset: '−03:00' },
+    { name: 'America/Goose_Bay', offset: '−04:00' },
+    { name: 'America/Grand_Turk', offset: '−05:00' },
+    { name: 'America/Guatemala', offset: '−06:00' },
+    { name: 'America/Guayaquil', offset: '−05:00' },
+    { name: 'America/Guyana', offset: '−04:00' },
+    { name: 'America/Halifax', offset: '−04:00' },
+    { name: 'America/Havana', offset: '−05:00' },
+    { name: 'America/Hermosillo', offset: '−07:00' },
+    { name: 'America/Indiana/Indianapolis', offset: '−05:00' },
+    { name: 'America/Indiana/Knox', offset: '−06:00' },
+    { name: 'America/Indiana/Marengo', offset: '−05:00' },
+    { name: 'America/Indiana/Petersburg', offset: '−05:00' },
+    { name: 'America/Indiana/Tell_City', offset: '−06:00' },
+    { name: 'America/Indiana/Vevay', offset: '−05:00' },
+    { name: 'America/Indiana/Vincennes', offset: '−05:00' },
+    { name: 'America/Indiana/Winamac', offset: '−05:00' },
+    { name: 'America/Inuvik', offset: '−07:00' },
+    { name: 'America/Iqaluit', offset: '−05:00' },
+    { name: 'America/Jamaica', offset: '−05:00' },
+    { name: 'America/Juneau', offset: '−09:00' },
+    { name: 'America/Kentucky/Louisville', offset: '−05:00' },
+    { name: 'America/Kentucky/Monticello', offset: '−05:00' },
+    { name: 'America/La_Paz', offset: '−04:00' },
+    { name: 'America/Lima', offset: '−05:00' },
+    { name: 'America/Los_Angeles', offset: '−08:00' },
+    { name: 'America/Maceio', offset: '−03:00' },
+    { name: 'America/Managua', offset: '−06:00' },
+    { name: 'America/Manaus', offset: '−04:00' },
+    { name: 'America/Martinique', offset: '−04:00' },
+    { name: 'America/Matamoros', offset: '−06:00' },
+    { name: 'America/Mazatlan', offset: '−07:00' },
+    { name: 'America/Menominee', offset: '−06:00' },
+    { name: 'America/Merida', offset: '−06:00' },
+    { name: 'America/Metlakatla', offset: '−09:00' },
+    { name: 'America/Mexico_City', offset: '−06:00' },
+    { name: 'America/Miquelon', offset: '−03:00' },
+    { name: 'America/Moncton', offset: '−04:00' },
+    { name: 'America/Monterrey', offset: '−06:00' },
+    { name: 'America/Montevideo', offset: '−03:00' },
+    { name: 'America/Nassau', offset: '−05:00' },
+    { name: 'America/New_York', offset: '−05:00' },
+    { name: 'America/Nipigon', offset: '−05:00' },
+    { name: 'America/Nome', offset: '−09:00' },
+    { name: 'America/Noronha', offset: '−02:00' },
+    { name: 'America/North_Dakota/Beulah', offset: '−06:00' },
+    { name: 'America/North_Dakota/Center', offset: '−06:00' },
+    { name: 'America/North_Dakota/New_Salem', offset: '−06:00' },
+    { name: 'America/Ojinaga', offset: '−07:00' },
+    { name: 'America/Panama', offset: '−05:00' },
+    { name: 'America/Pangnirtung', offset: '−05:00' },
+    { name: 'America/Paramaribo', offset: '−03:00' },
+    { name: 'America/Phoenix', offset: '−07:00' },
+    { name: 'America/Port_of_Spain', offset: '−04:00' },
+    { name: 'America/Port-au-Prince', offset: '−05:00' },
+    { name: 'America/Porto_Velho', offset: '−04:00' },
+    { name: 'America/Puerto_Rico', offset: '−04:00' },
+    { name: 'America/Punta_Arenas', offset: '−03:00' },
+    { name: 'America/Rainy_River', offset: '−06:00' },
+    { name: 'America/Rankin_Inlet', offset: '−06:00' },
+    { name: 'America/Recife', offset: '−03:00' },
+    { name: 'America/Regina', offset: '−06:00' },
+    { name: 'America/Resolute', offset: '−06:00' },
+    { name: 'America/Rio_Branco', offset: '−05:00' },
+    { name: 'America/Santarem', offset: '−03:00' },
+    { name: 'America/Santiago', offset: '−04:00' },
+    { name: 'America/Santo_Domingo', offset: '−04:00' },
+    { name: 'America/Sao_Paulo', offset: '−03:00' },
+    { name: 'America/Scoresbysund', offset: '−01:00' },
+    { name: 'America/Sitka', offset: '−09:00' },
+    { name: 'America/St_Johns', offset: '−03:30' },
+    { name: 'America/Swift_Current', offset: '−06:00' },
+    { name: 'America/Tegucigalpa', offset: '−06:00' },
+    { name: 'America/Thule', offset: '−04:00' },
+    { name: 'America/Thunder_Bay', offset: '−05:00' },
+    { name: 'America/Tijuana', offset: '−08:00' },
+    { name: 'America/Toronto', offset: '−05:00' },
+    { name: 'America/Vancouver', offset: '−08:00' },
+    { name: 'America/Whitehorse', offset: '−08:00' },
+    { name: 'America/Winnipeg', offset: '−06:00' },
+    { name: 'America/Yakutat', offset: '−09:00' },
+    { name: 'America/Yellowknife', offset: '−07:00' },
+    { name: 'Antarctica/Casey', offset: '+11:00' },
+    { name: 'Antarctica/Davis', offset: '+07:00' },
+    { name: 'Antarctica/DumontDUrville', offset: '+10:00' },
+    { name: 'Antarctica/Macquarie', offset: '+11:00' },
+    { name: 'Antarctica/Mawson', offset: '+05:00' },
+    { name: 'Antarctica/Palmer', offset: '−03:00' },
+    { name: 'Antarctica/Rothera', offset: '−03:00' },
+    { name: 'Antarctica/Syowa', offset: '+03:00' },
+    { name: 'Antarctica/Troll', offset: '+00:00' },
+    { name: 'Antarctica/Vostok', offset: '+06:00' },
+    { name: 'Asia/Almaty', offset: '+06:00' },
+    { name: 'Asia/Amman', offset: '+02:00' },
+    { name: 'Asia/Anadyr', offset: '+12:00' },
+    { name: 'Asia/Aqtau', offset: '+05:00' },
+    { name: 'Asia/Aqtobe', offset: '+05:00' },
+    { name: 'Asia/Ashgabat', offset: '+05:00' },
+    { name: 'Asia/Atyrau', offset: '+05:00' },
+    { name: 'Asia/Baghdad', offset: '+03:00' },
+    { name: 'Asia/Baku', offset: '+04:00' },
+    { name: 'Asia/Bangkok', offset: '+07:00' },
+    { name: 'Asia/Barnaul', offset: '+07:00' },
+    { name: 'Asia/Beirut', offset: '+02:00' },
+    { name: 'Asia/Bishkek', offset: '+06:00' },
+    { name: 'Asia/Brunei', offset: '+08:00' },
+    { name: 'Asia/Chita', offset: '+09:00' },
+    { name: 'Asia/Choibalsan', offset: '+08:00' },
+    { name: 'Asia/Colombo', offset: '+05:30' },
+    { name: 'Asia/Damascus', offset: '+02:00' },
+    { name: 'Asia/Dhaka', offset: '+06:00' },
+    { name: 'Asia/Dili', offset: '+09:00' },
+    { name: 'Asia/Dubai', offset: '+04:00' },
+    { name: 'Asia/Dushanbe', offset: '+05:00' },
+    { name: 'Asia/Famagusta', offset: '+02:00' },
+    { name: 'Asia/Gaza', offset: '+02:00' },
+    { name: 'Asia/Hebron', offset: '+02:00' },
+    { name: 'Asia/Ho_Chi_Minh', offset: '+07:00' },
+    { name: 'Asia/Hong_Kong', offset: '+08:00' },
+    { name: 'Asia/Hovd', offset: '+07:00' },
+    { name: 'Asia/Irkutsk', offset: '+08:00' },
+    { name: 'Asia/Jakarta', offset: '+07:00' },
+    { name: 'Asia/Jayapura', offset: '+09:00' },
+    { name: 'Asia/Jerusalem', offset: '+02:00' },
+    { name: 'Asia/Kabul', offset: '+04:30' },
+    { name: 'Asia/Kamchatka', offset: '+12:00' },
+    { name: 'Asia/Karachi', offset: '+05:00' },
+    { name: 'Asia/Kathmandu', offset: '+05:45' },
+    { name: 'Asia/Khandyga', offset: '+09:00' },
+    { name: 'Asia/Kolkata', offset: '+05:30' },
+    { name: 'Asia/Krasnoyarsk', offset: '+07:00' },
+    { name: 'Asia/Kuala_Lumpur', offset: '+08:00' },
+    { name: 'Asia/Kuching', offset: '+08:00' },
+    { name: 'Asia/Macau', offset: '+08:00' },
+    { name: 'Asia/Magadan', offset: '+11:00' },
+    { name: 'Asia/Makassar', offset: '+08:00' },
+    { name: 'Asia/Manila', offset: '+08:00' },
+    { name: 'Asia/Novokuznetsk', offset: '+07:00' },
+    { name: 'Asia/Novosibirsk', offset: '+07:00' },
+    { name: 'Asia/Omsk', offset: '+06:00' },
+    { name: 'Asia/Oral', offset: '+05:00' },
+    { name: 'Asia/Pontianak', offset: '+07:00' },
+    { name: 'Asia/Pyongyang', offset: '+09:00' },
+    { name: 'Asia/Qatar', offset: '+03:00' },
+    { name: 'Asia/Qyzylorda', offset: '+05:00' },
+    { name: 'Asia/Riyadh', offset: '+03:00' },
+    { name: 'Asia/Sakhalin', offset: '+11:00' },
+    { name: 'Asia/Samarkand', offset: '+05:00' },
+    { name: 'Asia/Seoul', offset: '+09:00' },
+    { name: 'Asia/Shanghai', offset: '+08:00' },
+    { name: 'Asia/Singapore', offset: '+08:00' },
+    { name: 'Asia/Srednekolymsk', offset: '+11:00' },
+    { name: 'Asia/Taipei', offset: '+08:00' },
+    { name: 'Asia/Tashkent', offset: '+05:00' },
+    { name: 'Asia/Tbilisi', offset: '+04:00' },
+    { name: 'Asia/Tehran', offset: '+03:30' },
+    { name: 'Asia/Thimphu', offset: '+06:00' },
+    { name: 'Asia/Tokyo', offset: '+09:00' },
+    { name: 'Asia/Tomsk', offset: '+07:00' },
+    { name: 'Asia/Ulaanbaatar', offset: '+08:00' },
+    { name: 'Asia/Urumqi', offset: '+06:00' },
+    { name: 'Asia/Ust-Nera', offset: '+10:00' },
+    { name: 'Asia/Vladivostok', offset: '+10:00' },
+    { name: 'Asia/Yakutsk', offset: '+09:00' },
+    { name: 'Asia/Yangon', offset: '+06:30' },
+    { name: 'Asia/Yekaterinburg', offset: '+05:00' },
+    { name: 'Asia/Yerevan', offset: '+04:00' },
+    { name: 'Atlantic/Azores', offset: '−01:00' },
+    { name: 'Atlantic/Bermuda', offset: '−04:00' },
+    { name: 'Atlantic/Canary', offset: '+00:00' },
+    { name: 'Atlantic/Cape_Verde', offset: '−01:00' },
+    { name: 'Atlantic/Faroe', offset: '+00:00' },
+    { name: 'Atlantic/Madeira', offset: '+00:00' },
+    { name: 'Atlantic/Reykjavik', offset: '+00:00' },
+    { name: 'Atlantic/South_Georgia', offset: '−02:00' },
+    { name: 'Atlantic/Stanley', offset: '−03:00' },
+    { name: 'Australia/Adelaide', offset: '+09:30' },
+    { name: 'Australia/Brisbane', offset: '+10:00' },
+    { name: 'Australia/Broken_Hill', offset: '+09:30' },
+    { name: 'Australia/Currie', offset: '+10:00' },
+    { name: 'Australia/Darwin', offset: '+09:30' },
+    { name: 'Australia/Eucla', offset: '+08:45' },
+    { name: 'Australia/Hobart', offset: '+10:00' },
+    { name: 'Australia/Lindeman', offset: '+10:00' },
+    { name: 'Australia/Lord_Howe', offset: '+10:30' },
+    { name: 'Australia/Melbourne', offset: '+10:00' },
+    { name: 'Australia/Perth', offset: '+08:00' },
+    { name: 'Australia/Sydney', offset: '+10:00' },
+    { name: 'Europe/Amsterdam', offset: '+01:00' },
+    { name: 'Europe/Andorra', offset: '+01:00' },
+    { name: 'Europe/Astrakhan', offset: '+04:00' },
+    { name: 'Europe/Athens', offset: '+02:00' },
+    { name: 'Europe/Belgrade', offset: '+01:00' },
+    { name: 'Europe/Berlin', offset: '+01:00' },
+    { name: 'Europe/Brussels', offset: '+01:00' },
+    { name: 'Europe/Bucharest', offset: '+02:00' },
+    { name: 'Europe/Budapest', offset: '+01:00' },
+    { name: 'Europe/Chisinau', offset: '+02:00' },
+    { name: 'Europe/Copenhagen', offset: '+01:00' },
+    { name: 'Europe/Dublin', offset: '+00:00' },
+    { name: 'Europe/Gibraltar', offset: '+01:00' },
+    { name: 'Europe/Helsinki', offset: '+02:00' },
+    { name: 'Europe/Istanbul', offset: '+03:00' },
+    { name: 'Europe/Kaliningrad', offset: '+02:00' },
+    { name: 'Europe/Kiev', offset: '+02:00' },
+    { name: 'Europe/Kirov', offset: '+03:00' },
+    { name: 'Europe/Lisbon', offset: '+00:00' },
+    { name: 'Europe/London', offset: '+00:00' },
+    { name: 'Europe/Luxembourg', offset: '+01:00' },
+    { name: 'Europe/Madrid', offset: '+01:00' },
+    { name: 'Europe/Malta', offset: '+01:00' },
+    { name: 'Europe/Minsk', offset: '+03:00' },
+    { name: 'Europe/Monaco', offset: '+01:00' },
+    { name: 'Europe/Moscow', offset: '+03:00' },
+    { name: 'Asia/Nicosia', offset: '+02:00' },
+    { name: 'Europe/Oslo', offset: '+01:00' },
+    { name: 'Europe/Paris', offset: '+01:00' },
+    { name: 'Europe/Prague', offset: '+01:00' },
+    { name: 'Europe/Riga', offset: '+02:00' },
+    { name: 'Europe/Rome', offset: '+01:00' },
+    { name: 'Europe/Samara', offset: '+04:00' },
+    { name: 'Europe/Saratov', offset: '+04:00' },
+    { name: 'Europe/Simferopol', offset: '+03:00' },
+    { name: 'Europe/Sofia', offset: '+02:00' },
+    { name: 'Europe/Stockholm', offset: '+01:00' },
+    { name: 'Europe/Tallinn', offset: '+02:00' },
+    { name: 'Europe/Tirane', offset: '+01:00' },
+    { name: 'Europe/Ulyanovsk', offset: '+04:00' },
+    { name: 'Europe/Uzhgorod', offset: '+02:00' },
+    { name: 'Europe/Vienna', offset: '+01:00' },
+    { name: 'Europe/Vilnius', offset: '+02:00' },
+    { name: 'Europe/Volgograd', offset: '+04:00' },
+    { name: 'Europe/Warsaw', offset: '+01:00' },
+    { name: 'Europe/Zaporozhye', offset: '+02:00' },
+    { name: 'Europe/Zurich', offset: '+01:00' },
+    { name: 'Indian/Chagos', offset: '+06:00' },
+    { name: 'Indian/Christmas', offset: '+07:00' },
+    { name: 'Indian/Cocos', offset: '+06:30' },
+    { name: 'Indian/Kerguelen', offset: '+05:00' },
+    { name: 'Indian/Mahe', offset: '+04:00' },
+    { name: 'Indian/Maldives', offset: '+05:00' },
+    { name: 'Indian/Mauritius', offset: '+04:00' },
+    { name: 'Indian/Reunion', offset: '+04:00' },
+    { name: 'Pacific/Apia', offset: '+13:00' },
+    { name: 'Pacific/Auckland', offset: '+12:00' },
+    { name: 'Pacific/Bougainville', offset: '+11:00' },
+    { name: 'Pacific/Chatham', offset: '+12:45' },
+    { name: 'Pacific/Chuuk', offset: '+10:00' },
+    { name: 'Pacific/Easter', offset: '−06:00' },
+    { name: 'Pacific/Efate', offset: '+11:00' },
+    { name: 'Pacific/Enderbury', offset: '+13:00' },
+    { name: 'Pacific/Fakaofo', offset: '+13:00' },
+    { name: 'Pacific/Fiji', offset: '+12:00' },
+    { name: 'Pacific/Funafuti', offset: '+12:00' },
+    { name: 'Pacific/Galapagos', offset: '−06:00' },
+    { name: 'Pacific/Gambier', offset: '−09:00' },
+    { name: 'Pacific/Guadalcanal', offset: '+11:00' },
+    { name: 'Pacific/Guam', offset: '+10:00' },
+    { name: 'Pacific/Honolulu', offset: '−10:00' },
+    { name: 'Pacific/Kiritimati', offset: '+14:00' },
+    { name: 'Pacific/Kosrae', offset: '+11:00' },
+    { name: 'Pacific/Kwajalein', offset: '+12:00' },
+    { name: 'Pacific/Majuro', offset: '+12:00' },
+    { name: 'Pacific/Marquesas', offset: '−09:30' },
+    { name: 'Pacific/Nauru', offset: '+12:00' },
+    { name: 'Pacific/Niue', offset: '−11:00' },
+    { name: 'Pacific/Norfolk', offset: '+11:00' },
+    { name: 'Pacific/Noumea', offset: '+11:00' },
+    { name: 'Pacific/Pago_Pago', offset: '−11:00' },
+    { name: 'Pacific/Palau', offset: '+09:00' },
+    { name: 'Pacific/Pitcairn', offset: '−08:00' },
+    { name: 'Pacific/Pohnpei', offset: '+11:00' },
+    { name: 'Pacific/Port_Moresby', offset: '+10:00' },
+    { name: 'Pacific/Rarotonga', offset: '−10:00' },
+    { name: 'Pacific/Tahiti', offset: '−10:00' },
+    { name: 'Pacific/Tarawa', offset: '+12:00' },
+    { name: 'Pacific/Tongatapu', offset: '+13:00' },
+    { name: 'Pacific/Wake', offset: '+12:00' },
+    { name: 'Pacific/Wallis', offset: '+12:00' },
+];
+
+var timezones = ubuntuTimezones.map(function (t) {
+    var detail = details.find(function (d) {
+        return d.name === t;
+    });
+
+    if (!detail) return null;
+
+    return {
+        id: t,
+        display: `${t} (UTC${detail.offset})`
+    }
+}).filter(function (t) { return !!t; });
+
+var output = `(function () { window.timezones = ${JSON.stringify(timezones)}; })();\n`;
+
+fs.writeFileSync(destinationFilePath, output, 'utf-8');
+
+console.log('Done');

scripts/delUsers.js

@@ -0,0 +1,69 @@
+#!/usr/bin/env node
+
+// This script deletes many users to test the UI for such a case
+
+// WARNING keep those in sync with addUsers.js
+const USERNAME_PREFIX = 'manyuser';
+
+var async = require('async'),
+    readlineSync = require('readline-sync'),
+    superagent = require('superagent');
+
+if (process.argv.length !== 3) {
+    console.log('Usage: ./delUsers.js <cloudronDomain>');
+    process.exit(1);
+}
+
+const cloudronDomain = process.argv[2];
+
+function getAccessToken(callback) {
+    let username = readlineSync.question('Username: ', {});
+    let password = readlineSync.question('Password: ', { noEchoBack: true });
+
+    superagent.post(`https://${cloudronDomain}/api/v1/developer/login`, { username: username, password: password }).end(function (error, result) {
+        if (error || result.statusCode !== 200) {
+            console.log('Login failed');
+            return getAccessToken(callback);
+        }
+
+        callback(result.body.accessToken);
+    });
+}
+
+console.log(`Login to ${cloudronDomain}`);
+getAccessToken(function (accessToken) {
+    console.log('Listing users...');
+
+    superagent.get(`https://${cloudronDomain}/api/v1/users`).query({ access_token: accessToken, per_page: 1000 }).end(function (error, result) {
+            if (error) {
+                console.error(error);
+                process.exit(1);
+            }
+
+            console.log(`Found ${result.body.users.length} users`);
+            let matchingUsers = result.body.users.filter(function (u) { return u.username.indexOf(USERNAME_PREFIX) === 0; });
+            console.log(`Found ${matchingUsers.length} users with matching prefix`);
+
+            console.log('Deleting users...');
+
+            async.eachLimit(matchingUsers, 5, function (user, next) {
+                superagent.del(`https://${cloudronDomain}/api/v1/users/${user.id}`).query({ access_token: accessToken }).end(function (error) {
+                    if (error) return next(error);
+
+                    process.stdout.write('.');
+
+                    next();
+                });
+            }, function (error) {
+                console.log();
+
+                if (error) {
+                    console.error(error);
+                    process.exit(1);
+                }
+
+                console.log('Done');
+            });
+        });
+
+});

scripts/package-lock.json

@@ -0,0 +1,163 @@
+{
+  "name": "scripts",
+  "version": "1.0.0",
+  "lockfileVersion": 1,
+  "requires": true,
+  "dependencies": {
+    "async": {
+      "version": "3.1.0",
+      "resolved": "https://registry.npmjs.org/async/-/async-3.1.0.tgz",
+      "integrity": "sha512-4vx/aaY6j/j3Lw3fbCHNWP0pPaTCew3F6F3hYyl/tHs/ndmV1q7NW9T5yuJ2XAGwdQrP+6Wu20x06U4APo/iQQ=="
+    },
+    "asynckit": {
+      "version": "0.4.0",
+      "resolved": "https://registry.npmjs.org/asynckit/-/asynckit-0.4.0.tgz",
+      "integrity": "sha1-x57Zf380y48robyXkLzDZkdLS3k="
+    },
+    "combined-stream": {
+      "version": "1.0.8",
+      "resolved": "https://registry.npmjs.org/combined-stream/-/combined-stream-1.0.8.tgz",
+      "integrity": "sha512-FQN4MRfuJeHf7cBbBMJFXhKSDq+2kAArBlmRBvcvFE5BB1HZKXtSFASDhdlz9zOYwxh8lDdnvmMOe/+5cdoEdg==",
+      "requires": {
+        "delayed-stream": "~1.0.0"
+      }
+    },
+    "component-emitter": {
+      "version": "1.3.0",
+      "resolved": "https://registry.npmjs.org/component-emitter/-/component-emitter-1.3.0.tgz",
+      "integrity": "sha512-Rd3se6QB+sO1TwqZjscQrurpEPIfO0/yYnSin6Q/rD3mOutHvUrCAhJub3r90uNb+SESBuE0QYoB90YdfatsRg=="
+    },
+    "cookiejar": {
+      "version": "2.1.2",
+      "resolved": "https://registry.npmjs.org/cookiejar/-/cookiejar-2.1.2.tgz",
+      "integrity": "sha512-Mw+adcfzPxcPeI+0WlvRrr/3lGVO0bD75SxX6811cxSh1Wbxx7xZBGK1eVtDf6si8rg2lhnUjsVLMFMfbRIuwA=="
+    },
+    "debug": {
+      "version": "4.1.1",
+      "resolved": "https://registry.npmjs.org/debug/-/debug-4.1.1.tgz",
+      "integrity": "sha512-pYAIzeRo8J6KPEaJ0VWOh5Pzkbw/RetuzehGM7QRRX5he4fPHx2rdKMB256ehJCkX+XRQm16eZLqLNS8RSZXZw==",
+      "requires": {
+        "ms": "^2.1.1"
+      }
+    },
+    "delayed-stream": {
+      "version": "1.0.0",
+      "resolved": "https://registry.npmjs.org/delayed-stream/-/delayed-stream-1.0.0.tgz",
+      "integrity": "sha1-3zrhmayt+31ECqrgsp4icrJOxhk="
+    },
+    "fast-safe-stringify": {
+      "version": "2.0.7",
+      "resolved": "https://registry.npmjs.org/fast-safe-stringify/-/fast-safe-stringify-2.0.7.tgz",
+      "integrity": "sha512-Utm6CdzT+6xsDk2m8S6uL8VHxNwI6Jub+e9NYTcAms28T84pTa25GJQV9j0CY0N1rM8hK4x6grpF2BQf+2qwVA=="
+    },
+    "form-data": {
+      "version": "2.5.1",
+      "resolved": "https://registry.npmjs.org/form-data/-/form-data-2.5.1.tgz",
+      "integrity": "sha512-m21N3WOmEEURgk6B9GLOE4RuWOFf28Lhh9qGYeNlGq4VDXUlJy2th2slBNU8Gp8EzloYZOibZJ7t5ecIrFSjVA==",
+      "requires": {
+        "asynckit": "^0.4.0",
+        "combined-stream": "^1.0.6",
+        "mime-types": "^2.1.12"
+      }
+    },
+    "formidable": {
+      "version": "1.2.1",
+      "resolved": "https://registry.npmjs.org/formidable/-/formidable-1.2.1.tgz",
+      "integrity": "sha512-Fs9VRguL0gqGHkXS5GQiMCr1VhZBxz0JnJs4JmMp/2jL18Fmbzvv7vOFRU+U8TBkHEE/CX1qDXzJplVULgsLeg=="
+    },
+    "inherits": {
+      "version": "2.0.4",
+      "resolved": "https://registry.npmjs.org/inherits/-/inherits-2.0.4.tgz",
+      "integrity": "sha512-k/vGaX4/Yla3WzyMCvTQOXYeIHvqOKtnqBduzTHpzpQZzAskKMhZ2K+EnBiSM9zGSoIFeMpXKxa4dYeZIQqewQ=="
+    },
+    "methods": {
+      "version": "1.1.2",
+      "resolved": "https://registry.npmjs.org/methods/-/methods-1.1.2.tgz",
+      "integrity": "sha1-VSmk1nZUE07cxSZmVoNbD4Ua/O4="
+    },
+    "mime": {
+      "version": "2.4.4",
+      "resolved": "https://registry.npmjs.org/mime/-/mime-2.4.4.tgz",
+      "integrity": "sha512-LRxmNwziLPT828z+4YkNzloCFC2YM4wrB99k+AV5ZbEyfGNWfG8SO1FUXLmLDBSo89NrJZ4DIWeLjy1CHGhMGA=="
+    },
+    "mime-db": {
+      "version": "1.40.0",
+      "resolved": "https://registry.npmjs.org/mime-db/-/mime-db-1.40.0.tgz",
+      "integrity": "sha512-jYdeOMPy9vnxEqFRRo6ZvTZ8d9oPb+k18PKoYNYUe2stVEBPPwsln/qWzdbmaIvnhZ9v2P+CuecK+fpUfsV2mA=="
+    },
+    "mime-types": {
+      "version": "2.1.24",
+      "resolved": "https://registry.npmjs.org/mime-types/-/mime-types-2.1.24.tgz",
+      "integrity": "sha512-WaFHS3MCl5fapm3oLxU4eYDw77IQM2ACcxQ9RIxfaC3ooc6PFuBMGZZsYpvoXS5D5QTWPieo1jjLdAm3TBP3cQ==",
+      "requires": {
+        "mime-db": "1.40.0"
+      }
+    },
+    "ms": {
+      "version": "2.1.2",
+      "resolved": "https://registry.npmjs.org/ms/-/ms-2.1.2.tgz",
+      "integrity": "sha512-sGkPx+VjMtmA6MX27oA4FBFELFCZZ4S4XqeGOXCv68tT+jb3vk/RyaKWP0PTKyWtmLSM0b+adUTEvbs1PEaH2w=="
+    },
+    "qs": {
+      "version": "6.9.0",
+      "resolved": "https://registry.npmjs.org/qs/-/qs-6.9.0.tgz",
+      "integrity": "sha512-27RP4UotQORTpmNQDX8BHPukOnBP3p1uUJY5UnDhaJB+rMt9iMsok724XL+UHU23bEFOHRMQ2ZhI99qOWUMGFA=="
+    },
+    "readable-stream": {
+      "version": "3.4.0",
+      "resolved": "https://registry.npmjs.org/readable-stream/-/readable-stream-3.4.0.tgz",
+      "integrity": "sha512-jItXPLmrSR8jmTRmRWJXCnGJsfy85mB3Wd/uINMXA65yrnFo0cPClFIUWzo2najVNSl+mx7/4W8ttlLWJe99pQ==",
+      "requires": {
+        "inherits": "^2.0.3",
+        "string_decoder": "^1.1.1",
+        "util-deprecate": "^1.0.1"
+      }
+    },
+    "readline-sync": {
+      "version": "1.4.10",
+      "resolved": "https://registry.npmjs.org/readline-sync/-/readline-sync-1.4.10.tgz",
+      "integrity": "sha512-gNva8/6UAe8QYepIQH/jQ2qn91Qj0B9sYjMBBs3QOB8F2CXcKgLxQaJRP76sWVRQt+QU+8fAkCbCvjjMFu7Ycw=="
+    },
+    "safe-buffer": {
+      "version": "5.2.0",
+      "resolved": "https://registry.npmjs.org/safe-buffer/-/safe-buffer-5.2.0.tgz",
+      "integrity": "sha512-fZEwUGbVl7kouZs1jCdMLdt95hdIv0ZeHg6L7qPeciMZhZ+/gdesW4wgTARkrFWEpspjEATAzUGPG8N2jJiwbg=="
+    },
+    "semver": {
+      "version": "6.3.0",
+      "resolved": "https://registry.npmjs.org/semver/-/semver-6.3.0.tgz",
+      "integrity": "sha512-b39TBaTSfV6yBrapU89p5fKekE2m/NwnDocOVruQFS1/veMgdzuPcnOM34M6CwxW8jH/lxEa5rBoDeUwu5HHTw=="
+    },
+    "string_decoder": {
+      "version": "1.3.0",
+      "resolved": "https://registry.npmjs.org/string_decoder/-/string_decoder-1.3.0.tgz",
+      "integrity": "sha512-hkRX8U1WjJFd8LsDJ2yQ/wWWxaopEsABU1XfkM8A+j0+85JAGppt16cr1Whg6KIbb4okU6Mql6BOj+uup/wKeA==",
+      "requires": {
+        "safe-buffer": "~5.2.0"
+      }
+    },
+    "superagent": {
+      "version": "5.1.0",
+      "resolved": "https://registry.npmjs.org/superagent/-/superagent-5.1.0.tgz",
+      "integrity": "sha512-7V6JVx5N+eTL1MMqRBX0v0bG04UjrjAvvZJTF/VDH/SH2GjSLqlrcYepFlpTrXpm37aSY6h3GGVWGxXl/98TKA==",
+      "requires": {
+        "component-emitter": "^1.3.0",
+        "cookiejar": "^2.1.2",
+        "debug": "^4.1.1",
+        "fast-safe-stringify": "^2.0.6",
+        "form-data": "^2.3.3",
+        "formidable": "^1.2.1",
+        "methods": "^1.1.2",
+        "mime": "^2.4.4",
+        "qs": "^6.7.0",
+        "readable-stream": "^3.4.0",
+        "semver": "^6.1.1"
+      }
+    },
+    "util-deprecate": {
+      "version": "1.0.2",
+      "resolved": "https://registry.npmjs.org/util-deprecate/-/util-deprecate-1.0.2.tgz",
+      "integrity": "sha1-RQ1Nyfpw3nMnYvvS1KKJgUGaDM8="
+    }
+  }
+}

scripts/package.json

@@ -0,0 +1,16 @@
+{
+  "name": "scripts",
+  "version": "1.0.0",
+  "description": "",
+  "main": "manyUsers.js",
+  "scripts": {
+    "test": "echo \"Error: no test specified\" && exit 1"
+  },
+  "author": "",
+  "license": "ISC",
+  "dependencies": {
+    "async": "^3.1.0",
+    "readline-sync": "^1.4.10",
+    "superagent": "^5.1.0"
+  }
+}

src/3rdparty/angular-ui-notification.css

@@ -0,0 +1,85 @@
+/**
+ * angular-ui-notification - Angular.js service providing simple notifications using Bootstrap 3 styles with css transitions for animating
+ * @author Alex_Crack
+ * @version v0.3.6
+ * @link https://github.com/alexcrack/angular-ui-notification
+ * @license MIT
+ */
+.ui-notification
+{
+    position: fixed;
+    z-index: 9999;
+
+    width: 300px;
+
+    -webkit-transition: all ease .5s;
+         -o-transition: all ease .5s;
+            transition: all ease .5s;
+
+    color: #fff;
+    border-radius: 0;
+    background: #337ab7;
+    box-shadow: 5px 5px 10px rgba(0, 0, 0, .3);
+}
+.ui-notification.clickable
+{
+    cursor: pointer;
+}
+.ui-notification.clickable:hover
+{
+    opacity: .7;
+}
+.ui-notification.killed
+{
+    -webkit-transition: opacity ease 1s;
+         -o-transition: opacity ease 1s;
+            transition: opacity ease 1s;
+
+    opacity: 0;
+}
+.ui-notification > h3
+{
+    font-size: 14px;
+    font-weight: bold;
+
+    display: block;
+
+    margin: 10px 10px 0 10px;
+    padding: 0 0 5px 0;
+
+    text-align: left;
+
+    border-bottom: 1px solid rgba(255, 255, 255, .3);
+}
+.ui-notification a
+{
+    color: #fff;
+}
+.ui-notification a:hover
+{
+    text-decoration: underline;
+}
+.ui-notification > .message
+{
+    margin: 10px 10px 10px 10px;
+}
+.ui-notification.warning
+{
+    color: #fff;
+    background: #f0ad4e;
+}
+.ui-notification.error
+{
+    color: #fff;
+    background: #d9534f;
+}
+.ui-notification.success
+{
+    color: #fff;
+    background: #5cb85c;
+}
+.ui-notification.info
+{
+    color: #fff;
+    background: #5bc0de;
+}

src/3rdparty/js/angular-ui-notification.js

@@ -0,0 +1,271 @@
+/**
+ * angular-ui-notification - Angular.js service providing simple notifications using Bootstrap 3 styles with css transitions for animating
+ * @author Alex_Crack
+ * @version v0.3.6
+ * @link https://github.com/alexcrack/angular-ui-notification
+ * @license MIT
+ */
+angular.module('ui-notification', []);
+
+angular.module('ui-notification').provider('Notification', function () {
+
+  this.options = {
+    delay: 5000,
+    startTop: 10,
+    startRight: 10,
+    verticalSpacing: 10,
+    horizontalSpacing: 10,
+    positionX: 'right',
+    positionY: 'top',
+    replaceMessage: false,
+    templateUrl: 'angular-ui-notification.html',
+    onClose: undefined,
+    onClick: undefined,
+    closeOnClick: true,
+    maxCount: 0, // 0 - Infinite
+    container: 'body',
+    priority: 10
+  };
+
+  this.setOptions = function (options) {
+    if (!angular.isObject(options)) throw new Error("Options should be an object!");
+    this.options = angular.extend({}, this.options, options);
+  };
+
+  this.$get = ["$timeout", "$http", "$compile", "$templateCache", "$rootScope", "$injector", "$sce", "$q", "$window", function ($timeout, $http, $compile, $templateCache, $rootScope, $injector, $sce, $q, $window) {
+    var options = this.options;
+
+    var startTop = options.startTop;
+    var startRight = options.startRight;
+    var verticalSpacing = options.verticalSpacing;
+    var horizontalSpacing = options.horizontalSpacing;
+    var delay = options.delay;
+
+    var messageElements = [];
+    var isResizeBound = false;
+
+    var notify = function (args, t) {
+      var deferred = $q.defer();
+
+      if (typeof args !== 'object' || args === null) {
+        args = {message: args};
+      }
+
+      args.scope = args.scope ? args.scope : $rootScope;
+      args.template = args.templateUrl ? args.templateUrl : options.templateUrl;
+      args.delay = !angular.isUndefined(args.delay) ? args.delay : delay;
+      args.type = t || args.type || options.type || '';
+      args.positionY = args.positionY ? args.positionY : options.positionY;
+      args.positionX = args.positionX ? args.positionX : options.positionX;
+      args.replaceMessage = args.replaceMessage ? args.replaceMessage : options.replaceMessage;
+      args.onClose = args.onClose ? args.onClose : options.onClose;
+      args.onClick = args.onClick ? args.onClick : options.onClick;
+      args.closeOnClick = (args.closeOnClick !== null && args.closeOnClick !== undefined) ? args.closeOnClick : options.closeOnClick;
+      args.container = args.container ? args.container : options.container;
+      args.priority = args.priority ? args.priority : options.priority;
+
+      var template = $templateCache.get(args.template);
+
+      if (template) {
+        processNotificationTemplate(template);
+      } else {
+        // load it via $http only if it isn't default template and template isn't exist in template cache
+        // cache:true means cache it for later access.
+        $http.get(args.template, {cache: true})
+          .then(function (response) {
+            processNotificationTemplate(response.data);
+          })
+          .catch(function (data) {
+            throw new Error('Template (' + args.template + ') could not be loaded. ' + data);
+          });
+      }
+
+
+      function processNotificationTemplate(template) {
+
+        var scope = args.scope.$new();
+        scope.message = $sce.trustAsHtml(args.message);
+        scope.title = $sce.trustAsHtml(args.title);
+        scope.t = args.type.substr(0, 1);
+        scope.delay = args.delay;
+        scope.onClose = args.onClose;
+        scope.onClick = args.onClick;
+
+        var priorityCompareTop = function (a, b) {
+          return a._priority - b._priority;
+        };
+
+        var priorityCompareBtm = function (a, b) {
+          return b._priority - a._priority;
+        };
+
+        var reposite = function () {
+          var j = 0;
+          var k = 0;
+          var lastTop = startTop;
+          var lastRight = startRight;
+          var lastPosition = [];
+
+          if (args.positionY === 'top') {
+            messageElements.sort(priorityCompareTop);
+          } else if (args.positionY === 'bottom') {
+            messageElements.sort(priorityCompareBtm);
+          }
+
+          for (var i = messageElements.length - 1; i >= 0; i--) {
+            var element = messageElements[i];
+            if (args.replaceMessage && i < messageElements.length - 1) {
+              element.addClass('killed');
+              continue;
+            }
+            var elHeight = parseInt(element[0].offsetHeight);
+            var elWidth = parseInt(element[0].offsetWidth);
+            var position = lastPosition[element._positionY + element._positionX];
+
+            if ((top + elHeight) > window.innerHeight) {
+              position = startTop;
+              k++;
+              j = 0;
+            }
+
+            var top = (lastTop = position ? (j === 0 ? position : position + verticalSpacing) : startTop);
+            var right = lastRight + (k * (horizontalSpacing + elWidth));
+
+            element.css(element._positionY, top + 'px');
+            if (element._positionX === 'center') {
+              element.css('left', parseInt(window.innerWidth / 2 - elWidth / 2) + 'px');
+            } else {
+              element.css(element._positionX, right + 'px');
+            }
+
+            lastPosition[element._positionY + element._positionX] = top + elHeight;
+
+            if (options.maxCount > 0 && messageElements.length > options.maxCount && i === 0) {
+              element.scope().kill(true);
+            }
+
+            j++;
+          }
+        };
+
+        var templateElement = $compile(template)(scope);
+        templateElement._positionY = args.positionY;
+        templateElement._positionX = args.positionX;
+        templateElement._priority = args.priority;
+        templateElement.addClass(args.type);
+
+        var closeEvent = function (e) {
+          e = e.originalEvent || e;
+          if (e.type === 'click' || e.propertyName === 'opacity' && e.elapsedTime >= 1) {
+
+            if (scope.onClose) {
+              scope.$apply(scope.onClose(templateElement));
+            }
+
+            if (e.type === 'click')
+              if (scope.onClick) {
+                scope.$apply(scope.onClick(templateElement));
+              }
+
+            templateElement.remove();
+            messageElements.splice(messageElements.indexOf(templateElement), 1);
+            scope.$destroy();
+            reposite();
+          }
+        };
+
+        if (args.closeOnClick) {
+          templateElement.addClass('clickable');
+          templateElement.bind('click', closeEvent);
+        }
+
+        templateElement.bind('webkitTransitionEnd oTransitionEnd otransitionend transitionend msTransitionEnd', closeEvent);
+
+        if (angular.isNumber(args.delay)) {
+          $timeout(function () {
+            templateElement.addClass('killed');
+          }, args.delay);
+        }
+
+        setCssTransitions('none');
+
+        angular.element(document.querySelector(args.container)).append(templateElement);
+        var offset = -(parseInt(templateElement[0].offsetHeight) + 50);
+        templateElement.css(templateElement._positionY, offset + "px");
+        messageElements.push(templateElement);
+
+        if (args.positionX == 'center') {
+          var elWidth = parseInt(templateElement[0].offsetWidth);
+          templateElement.css('left', parseInt(window.innerWidth / 2 - elWidth / 2) + 'px');
+        }
+
+        $timeout(function () {
+          setCssTransitions('');
+        });
+
+        function setCssTransitions(value) {
+          ['-webkit-transition', '-o-transition', 'transition'].forEach(function (prefix) {
+            templateElement.css(prefix, value);
+          });
+        }
+
+        scope._templateElement = templateElement;
+
+        scope.kill = function (isHard) {
+          if (isHard) {
+            if (scope.onClose) {
+              scope.$apply(scope.onClose(scope._templateElement));
+            }
+
+            messageElements.splice(messageElements.indexOf(scope._templateElement), 1);
+            scope._templateElement.remove();
+            scope.$destroy();
+            $timeout(reposite);
+          } else {
+            scope._templateElement.addClass('killed');
+          }
+        };
+
+        $timeout(reposite);
+
+        if (!isResizeBound) {
+          angular.element($window).bind('resize', function (e) {
+            $timeout(reposite);
+          });
+          isResizeBound = true;
+        }
+
+        deferred.resolve(scope);
+
+      }
+
+      return deferred.promise;
+    };
+
+    notify.primary = function (args) {
+      return this(args, 'primary');
+    };
+    notify.error = function (args) {
+      return this(args, 'error');
+    };
+    notify.success = function (args) {
+      return this(args, 'success');
+    };
+    notify.info = function (args) {
+      return this(args, 'info');
+    };
+    notify.warning = function (args) {
+      return this(args, 'warning');
+    };
+
+    notify.clearAll = function () {
+      angular.forEach(messageElements, function (element) {
+        element.addClass('killed');
+      });
+    };
+
+    return notify;
+  }];
+});
+
+angular.module("ui-notification").run(["$templateCache", function($templateCache) {$templateCache.put("angular-ui-notification.html","<div class=\"ui-notification\"><h3 ng-show=\"title\" ng-bind-html=\"title\"></h3><div class=\"message\" ng-bind-html=\"message\"></div></div>");}]);

src/appstatus.html

@@ -22,6 +22,9 @@
             height: 100%;
             width: 100%;
             text-align: center;
+            font-family: "Roboto","Helvetica Neue",Helvetica,Arial,sans-serif;
+            font-size: 13px;
+            line-height: 1.846;
         }
 
         .content {
@@ -37,23 +40,31 @@
             bottom: 0;
             width: 100%;
             color: #555;
-            font-size: 14px;
+            font-size: 12px;
+            text-align: center;
             padding: 5px;
             z-index: 1000;
             position: fixed;
+            opacity: .5;
+            transition: all .25s;
         }
 
-        footer a {
-            color: #62bdfc;
-            padding: 10px;
+        footer:hover {
+            opacity: 1;
+        }
+
+        a {
+            color: #2196f3;
             text-decoration: none;
+            background-color: transparent;
         }
 
-        h1, h2, p {
-            margin: 10px;
+        a:hover {
+            color: #0a6ebd;
+            text-decoration: underline;
         }
 
-    </style>
+        </style>
 
 </head>
 
@@ -65,10 +76,8 @@
     <p>This app is currently not responding. Try refreshing the page.</p>
 </div>
 
-<footer class="text-center">
+<footer>
     <span class="text-muted"><a href="https://cloudron.io" target="_blank">Cloudron</a></span>
-    <span class="text-muted"><a href="https://twitter.com/cloudron_io" target="_blank">Twitter</a></span>
-    <span class="text-muted"><a href="https://chat.cloudron.io" target="_blank">Chat <i class="fa fa-comments"></i></a></span>
 </footer>
 
 </body>

src/img/appicon_fallback.svg

@@ -0,0 +1,102 @@
+<?xml version="1.0" encoding="UTF-8" standalone="no"?>
+<!-- Created with Inkscape (http://www.inkscape.org/) -->
+
+<svg
+   xmlns:dc="http://purl.org/dc/elements/1.1/"
+   xmlns:cc="http://creativecommons.org/ns#"
+   xmlns:rdf="http://www.w3.org/1999/02/22-rdf-syntax-ns#"
+   xmlns:svg="http://www.w3.org/2000/svg"
+   xmlns="http://www.w3.org/2000/svg"
+   xmlns:sodipodi="http://sodipodi.sourceforge.net/DTD/sodipodi-0.dtd"
+   xmlns:inkscape="http://www.inkscape.org/namespaces/inkscape"
+   width="546.13336"
+   height="546.13336"
+   viewBox="0 0 512.00001 512.00001"
+   id="svg4519"
+   version="1.1"
+   inkscape:version="0.92.2 2405546, 2018-03-11"
+   sodipodi:docname="appicon_fallback.svg"
+   inkscape:export-filename="/home/nebulon/projects/yellowtent/dashboard/src/img/appicon_fallback.png"
+   inkscape:export-xdpi="90"
+   inkscape:export-ydpi="90">
+  <defs
+     id="defs4521" />
+  <sodipodi:namedview
+     id="base"
+     pagecolor="#ffffff"
+     bordercolor="#666666"
+     borderopacity="1.0"
+     inkscape:pageopacity="0.0"
+     inkscape:pageshadow="2"
+     inkscape:zoom="0.7"
+     inkscape:cx="89.894291"
+     inkscape:cy="162.5294"
+     inkscape:document-units="px"
+     inkscape:current-layer="g4496"
+     showgrid="false"
+     units="px"
+     inkscape:window-width="2880"
+     inkscape:window-height="1565"
+     inkscape:window-x="0"
+     inkscape:window-y="55"
+     inkscape:window-maximized="1" />
+  <metadata
+     id="metadata4524">
+    <rdf:RDF>
+      <cc:Work
+         rdf:about="">
+        <dc:format>image/svg+xml</dc:format>
+        <dc:type
+           rdf:resource="http://purl.org/dc/dcmitype/StillImage" />
+        <dc:title></dc:title>
+      </cc:Work>
+    </rdf:RDF>
+  </metadata>
+  <g
+     inkscape:label="Layer 1"
+     inkscape:groupmode="layer"
+     id="layer1"
+     transform="translate(0,-540.36216)">
+    <g
+       id="g4467"
+       transform="matrix(20.50952,0,0,20.859456,-526.58031,-94.042799)">
+      <g
+         inkscape:export-ydpi="67.349998"
+         inkscape:export-xdpi="67.349998"
+         transform="matrix(0.59473169,0,0,0.59473169,31.04719,102.48374)"
+         id="g4382">
+        <g
+           id="g4496">
+          <path
+             sodipodi:type="star"
+             style="opacity:1;fill:#03a9f4;fill-opacity:1;stroke:none;stroke-width:1.10000002;stroke-miterlimit:4;stroke-dasharray:none;stroke-dashoffset:0;stroke-opacity:1"
+             id="path4162"
+             sodipodi:sides="6"
+             sodipodi:cx="12.46875"
+             sodipodi:cy="-99.893143"
+             sodipodi:r1="19.266006"
+             sodipodi:r2="16.307295"
+             sodipodi:arg1="-0.52224059"
+             sodipodi:arg2="0.0013581913"
+             inkscape:flatsided="true"
+             inkscape:rounded="0.12490573"
+             inkscape:randomized="0"
+             d="m 29.166669,-109.50348 c 1.200386,2.08567 1.17988,17.183595 -0.02617,19.265993 -1.206046,2.082397 -14.291486,9.613601 -16.697919,9.610333 -2.406432,-0.0033 -15.4713664,-7.56999 -16.671752,-9.655655 -1.2003857,-2.085666 -1.1798799,-17.183591 0.026167,-19.265991 1.2060467,-2.0824 14.2914862,-9.6136 16.6979192,-9.61033 2.406432,0.003 15.471366,7.56999 16.671752,9.65565 z"
+             transform="rotate(-30,10.993604,-99.259973)"
+             inkscape:export-xdpi="67.349998"
+             inkscape:export-ydpi="67.349998" />
+          <rect
+             inkscape:transform-center-x="0.66390665"
+             ry="3.9522502"
+             y="-107.69034"
+             x="4.8100815"
+             height="14.288903"
+             width="14.288903"
+             id="rect4168-1-1"
+             style="opacity:1;fill:#ffffff;fill-opacity:1;stroke:none;stroke-width:3.75875854;stroke-miterlimit:4;stroke-dasharray:none;stroke-dashoffset:0;stroke-opacity:1"
+             inkscape:transform-center-y="3.7035412e-06" />
+        </g>
+      </g>
+    </g>
+  </g>
+</svg>

src/index.html

@@ -0,0 +1,169 @@
+<!DOCTYPE html>
+<html ng-app="Application" ng-controller="MainController">
+<head>
+    <meta charset="utf-8" />
+    <meta name="viewport" content="user-scalable=no, initial-scale=1, maximum-scale=1, minimum-scale=1, width=device-width, height=device-height" />
+
+    <!-- this gets changed once we get the config (because angular has not loaded yet, we see template string for a flash) -->
+    <title>&lrm;</title>
+
+    <link id="favicon" type="image/png" rel="icon" href="/api/v1/cloudron/avatar">
+    <link rel="apple-touch-icon" href="/api/v1/cloudron/avatar">
+    <link rel="icon" href="/api/v1/cloudron/avatar">
+
+    <!-- CSS -->
+    <link type="text/css" rel="stylesheet" href="/3rdparty/slick.css?<%= revision %>"/>
+    <link type="text/css" rel="stylesheet" href="/3rdparty/angular-ui-notification.css?<%= revision %>"/>
+    <link type="text/css" rel="stylesheet" href="/3rdparty/bootstrap-slider/bootstrap-slider.min.css?<%= revision %>"/>
+    <link type="text/css" rel="stylesheet" href="/theme.css?<%= revision %>">
+
+    <!-- Custom Fonts -->
+    <link type="text/css" rel="stylesheet" href="/3rdparty/fontawesome/css/all.min.css?<%= revision %>">
+
+    <!-- jQuery-->
+    <script type="text/javascript" src="/3rdparty/js/jquery.min.js?<%= revision %>"></script>
+
+    <!-- async -->
+    <script type="text/javascript" src="/3rdparty/js/async-3.2.0.min.js?<%= revision %>"></script>
+
+    <!-- toBlob() polyfill-->
+    <script type="text/javascript" src="/3rdparty/js/canvas-to-blob.min.js?<%= revision %>"></script>
+
+    <!-- Bootstrap Core JavaScript -->
+    <script type="text/javascript" src="/3rdparty/js/bootstrap.min.js?<%= revision %>"></script>
+
+    <!-- Slick carousel -->
+    <script type="text/javascript" src="/3rdparty/js/slick.js?<%= revision %>"></script>
+
+    <!-- Angularjs scripts -->
+    <script type="text/javascript" src="/3rdparty/js/angular.min.js?<%= revision %>"></script>
+    <script type="text/javascript" src="/3rdparty/js/angular-loader.min.js?<%= revision %>"></script>
+    <script type="text/javascript" src="/3rdparty/js/angular-route.min.js?<%= revision %>"></script>
+    <script type="text/javascript" src="/3rdparty/js/angular-animate.min.js?<%= revision %>"></script>
+    <script type="text/javascript" src="/3rdparty/js/angular-base64.min.js?<%= revision %>"></script>
+    <script type="text/javascript" src="/3rdparty/js/angular-md5.min.js?<%= revision %>"></script>
+    <script type="text/javascript" src="/3rdparty/js/angular-sanitize.min.js?<%= revision %>"></script>
+    <script type="text/javascript" src="/3rdparty/js/angular-slick.min.js?<%= revision %>"></script>
+    <script type="text/javascript" src="/3rdparty/js/angular-ui-notification.js?<%= revision %>"></script>
+    <script type="text/javascript" src="/3rdparty/js/angular-fittext.min.js?<%= revision %>"></script>
+    <script type="text/javascript" src="/3rdparty/js/autofill-event.js?<%= revision %>"></script>
+
+    <!-- Angular directives for tldjs -->
+    <script type="text/javascript" src="/3rdparty/js/tld.js?<%= revision %>"></script>
+    <script type="text/javascript" src="/3rdparty/js/angular-tld.js?<%= revision %>"></script>
+
+    <!-- Angular directives for bootstrap https://angular-ui.github.io/bootstrap/ -->
+    <script type="text/javascript" src="/3rdparty/js/ui-bootstrap-tpls-1.3.3.min.js?<%= revision %>"></script>
+
+    <script type="text/javascript" src="/3rdparty/js/Chart.min.js?<%= revision %>"></script>
+    <script type="text/javascript" src="/3rdparty/js/ansi_up.js?<%= revision %>"></script>
+    <script type="text/javascript" src="/3rdparty/js/clipboard.min.js?<%= revision %>"></script>
+
+    <!-- Showdown (markdown converter) -->
+    <script type="text/javascript" src="/3rdparty/js/showdown-1.6.4.min.js?<%= revision %>"></script>
+    <script type="text/javascript" src="/3rdparty/js/showdown-target-blank.min.js?<%= revision %>"></script>
+
+    <!-- Bootstrap slider -->
+    <script type="text/javascript" src="/3rdparty/bootstrap-slider/bootstrap-slider.min.js?<%= revision %>"></script>
+    <script type="text/javascript" src="/3rdparty/bootstrap-slider/slider.js?<%= revision %>"></script>
+
+    <!-- Anugular Multiselect https://github.com/sebastianha/angular-bootstrap-multiselect -->
+    <script type="text/javascript" src="/3rdparty/js/angular-bootstrap-multiselect.js?<%= revision %>"></script>
+
+    <!-- colors -->
+    <script type="text/javascript" src="/3rdparty/js/colors.js?<%= revision %>"></script>
+
+    <!-- moment -->
+    <script type="text/javascript" src="/3rdparty/js/moment.min.js?<%= revision %>"></script>
+
+    <!-- timezone list -->
+    <script type="text/javascript" src="/js/timezones.js?<%= revision %>"></script>
+
+    <!-- Main Application -->
+    <script type="text/javascript" src="/js/index.js?<%= revision %>"></script>
+
+</head>
+
+<body>
+
+    <script type="text/ng-template" id="notification.html">
+        <div class="ui-notification">
+            <h3 ng-show="title" ng-bind-html="title"></h3>
+            <div class="message">
+                <a href="{{action}}" ng-show="action" ng-bind-html="message"></a>
+                <span ng-hide="action" ng-bind-html="message"></span>
+            </div>
+        </div>
+    </script>
+
+    <a class="offline-banner animateMe" ng-show="client.offline" ng-cloak href="https://cloudron.io/documentation/troubleshooting/" target="_blank"><i class="fa fa-circle-notch fa-spin"></i> Cloudron is offline. Reconnecting...</a>
+
+    <div class="animateMe ng-hide layout-root" ng-show="initialized">
+
+        <!-- Navigation -->
+        <nav class="navbar navbar-default navbar-static-top shadow" role="navigation" style="margin-bottom: 0">
+            <div class="container-fluid">
+                <div class="navbar-header">
+                    <button type="button" class="navbar-toggle" data-toggle="collapse" data-target=".navbar-collapse">
+                        <span class="sr-only">Toggle navigation</span>
+                        <span class="icon-bar"></span>
+                        <span class="icon-bar"></span>
+                        <span class="icon-bar"></span>
+                    </button>
+                    <a class="navbar-brand navbar-brand-icon" href="#/"><img ng-src="{{ client.avatar }}" width="40" height="40"/></a>
+                    <a class="navbar-brand" href="#/">{{ config.cloudronName || 'Cloudron' }}</a>
+                </div>
+                <!-- /.navbar-header -->
+
+                <div class="collapse navbar-collapse">
+                  <ul class="nav navbar-nav navbar-right" ng-hide="hideNavBarActions">
+                        <li ng-show="user.isAtLeastOwner && (subscription.plan.id === 'free' || subscription.plan.id === 'expired')">
+                          <a ng-click="openSubscriptionSetup()" style="cursor: pointer">
+                            <span class="badge badge-success">{{ subscription.plan.id === 'free' ? 'Setup' : 'Reactivate' }} Subscription</span>
+                          </a>
+                        </li>
+                        <li>
+                            <a ng-class="{ active: isActive('/apps')}" href="#/apps"><i class="fa fa-th fa-fw"></i> My Apps</a>
+                        </li>
+                        <li ng-show="user.isAtLeastAdmin">
+                            <a ng-class="{ active: isActive('/appstore')}" href="#/appstore"><i class="fa fa-cloud-download-alt fa-fw"></i> App Store</a>
+                        </li>
+                        <li ng-show="user.isAtLeastUserManager">
+                            <a ng-class="{ active: isActive('/users')}" href="#/users"><i class="fa fa-users fa-fw"></i> Users</a>
+                        </li>
+                        <li class="dropdown">
+                            <a href="" class="dropdown-toggle" data-toggle="dropdown" role="button" aria-expanded="false"><img ng-src="{{user.avatarUrl}}" style="width: 24px; height: 24px;"/> {{user.username}} <span class="badge badge-danger" ng-show="notifications.length">{{ notifications.length }}</span> <span class="caret"></span></a>
+                            <ul class="dropdown-menu" role="menu">
+                                <li><a href="#/profile"><i class="fa fa-user fa-fw"></i> Profile</a></li>
+                                <li ng-show="user.isAtLeastAdmin" class="divider"></li>
+                                <li ng-show="user.isAtLeastAdmin"><a href="#/backups"><i class="fa fa-archive fa-fw"></i> Backups</a></li>
+                                <li ng-show="user.role === 'owner'"><a href="#/branding"><i class="fa fa-passport fa-fw"></i> Branding</a></li>
+                                <li ng-show="user.isAtLeastAdmin"><a href="#/domains"><i class="fa fa-globe fa-fw"></i> Domains & Certs</a></li>
+                                <li ng-show="user.isAtLeastAdmin"><a href="#/email"><i class="fa fa-envelope fa-fw"></i> Email</a></li>
+                                <li ng-show="user.isAtLeastAdmin"><a href="#/activity"><i class="fa fa-list-alt fa-fw"></i> Event Log</a></li>
+                                <li ng-show="user.isAtLeastAdmin"><a href="#/network"><i class="fas fa-network-wired fa-fw"></i> Network</a></li>
+                                <li><a href="#/notifications"><i class="fa fa-bell fa-fw"></i> Notifications <span class="badge badge-danger" ng-show="notifications.length">{{ notifications.length }}</span></a></li>
+                                <li ng-show="user.isAtLeastAdmin"><a href="#/settings"><i class="fa fa-wrench fa-fw"></i> Settings</a></li>
+                                <li ng-show="user.isAtLeastAdmin" class="divider"></li>
+                                <li ng-show="user.isAtLeastAdmin"><a href="#/support"><i class="fa fa-comment fa-fw"></i> Support</a></li>
+                                <li ng-show="user.isAtLeastAdmin"><a href="#/system"><i class="fa fa-cogs fa-fw"></i> System</a></li>
+                                <li class="divider"></li>
+                                <li><a href="" ng-click="logout($event)"><i class="fa fa-sign-out-alt fa-fw"></i> Logout</a></li>
+                            </ul>
+                        </li>
+                    </ul>
+
+                </div>
+            </div>
+        </nav>
+
+        <div ng-view id="ng-view" class="layout-content"></div>
+
+        <footer class="text-center ng-cloak">
+          <span class="text-muted" ng-bind-html="config.footer | markdown2html"></span>
+          <span class="version">v{{config.version}}</span>
+        </footer>
+    </div>
+
+</body>
+</html>

src/js/index.js

@@ -2,6 +2,9 @@
 
 /* global angular:false */
 /* global showdown:false */
+/* global moment:false */
+/* global $:false */
+/* global ERROR,ISTATES,HSTATES,RSTATES */
 
 // deal with accessToken in the query, this is passed for example on password reset and account setup upon invite
 var search = decodeURIComponent(window.location.search).slice(1).split('&').map(function (item) { return item.split('='); }).reduce(function (o, k) { o[k[0]] = k[1]; return o; }, {});
@@ -16,7 +19,6 @@ if (search.accessToken) {
     window.location.search = encodeURIComponent(Object.keys(search).map(function (key) { return key + '=' + search[key]; }).join('&'));
 }
 
-
 // create main application module
 var app = angular.module('Application', ['ngFitText', 'ngRoute', 'ngAnimate', 'ngSanitize', 'angular-md5', 'base64', 'slick', 'ui-notification', 'ui.bootstrap', 'ui.bootstrap-slider', 'ngTld', 'ui.multiselect']);
 
@@ -25,76 +27,85 @@ app.config(['NotificationProvider', function (NotificationProvider) {
         delay: 5000,
         startTop: 60,
         positionX: 'left',
-        maxCount: 3,
         templateUrl: 'notification.html'
     });
 }]);
 
+// configure resourceUrlWhitelist https://code.angularjs.org/1.5.8/docs/api/ng/provider/$sceDelegateProvider#resourceUrlWhitelist
+app.config(function ($sceDelegateProvider) {
+    $sceDelegateProvider.resourceUrlWhitelist([
+        // Allow same origin resource loads.
+        'self',
+        // Allow loading from our assets domain.
+        'https://cloudron.io/**',
+        'https://staging.cloudron.io/**',
+        'https://dev.cloudron.io/**',
+        // Allow local development against the appstore pages
+        'http://localhost:5000/**'
+    ]);
+});
+
 // setup all major application routes
 app.config(['$routeProvider', function ($routeProvider) {
     $routeProvider.when('/', {
         redirectTo: '/apps'
     }).when('/users', {
         controller: 'UsersController',
-        templateUrl: 'views/users.html'
+        templateUrl: 'views/users.html?<%= revision %>'
+    }).when('/app/:appId/:view?', {
+        controller: 'AppController',
+        templateUrl: 'views/app.html?<%= revision %>'
     }).when('/appstore', {
         controller: 'AppStoreController',
-        templateUrl: 'views/appstore.html'
+        templateUrl: 'views/appstore.html?<%= revision %>'
     }).when('/appstore/:appId', {
         controller: 'AppStoreController',
-        templateUrl: 'views/appstore.html'
+        templateUrl: 'views/appstore.html?<%= revision %>'
     }).when('/apps', {
         controller: 'AppsController',
-        templateUrl: 'views/apps.html'
-    }).when('/account', {
-        controller: 'AccountController',
-        templateUrl: 'views/account.html'
-    }).when('/graphs', {
-        controller: 'GraphsController',
-        templateUrl: 'views/graphs.html'
+        templateUrl: 'views/apps.html?<%= revision %>'
+    }).when('/profile', {
+        controller: 'ProfileController',
+        templateUrl: 'views/profile.html?<%= revision %>'
+    }).when('/backups', {
+        controller: 'BackupsController',
+        templateUrl: 'views/backups.html?<%= revision %>'
+    }).when('/branding', {
+        controller: 'BrandingController',
+        templateUrl: 'views/branding.html?<%= revision %>'
+    }).when('/network', {
+        controller: 'NetworkController',
+        templateUrl: 'views/network.html?<%= revision %>'
     }).when('/domains', {
         controller: 'DomainsController',
-        templateUrl: 'views/domains.html'
+        templateUrl: 'views/domains.html?<%= revision %>'
     }).when('/email', {
+        controller: 'EmailsController',
+        templateUrl: 'views/emails.html?<%= revision %>'
+    }).when('/email/:domain', {
         controller: 'EmailController',
-        templateUrl: 'views/email.html'
+        templateUrl: 'views/email.html?<%= revision %>'
+    }).when('/notifications', {
+        controller: 'NotificationsController',
+        templateUrl: 'views/notifications.html?<%= revision %>'
     }).when('/settings', {
         controller: 'SettingsController',
-        templateUrl: 'views/settings.html'
+        templateUrl: 'views/settings.html?<%= revision %>'
     }).when('/activity', {
         controller: 'ActivityController',
-        templateUrl: 'views/activity.html'
+        templateUrl: 'views/activity.html?<%= revision %>'
     }).when('/support', {
         controller: 'SupportController',
-        templateUrl: 'views/support.html'
-    }).when('/tokens', {
-        controller: 'TokensController',
-        templateUrl: 'views/tokens.html'
+        templateUrl: 'views/support.html?<%= revision %>'
+    }).when('/system', {
+        controller: 'SystemController',
+        templateUrl: 'views/system.html?<%= revision %>'
     }).otherwise({ redirectTo: '/'});
 }]);
 
-// keep in sync with appdb.js
-var ISTATES = {
-    PENDING_INSTALL: 'pending_install',
-    PENDING_CLONE: 'pending_clone',
-    PENDING_CONFIGURE: 'pending_configure',
-    PENDING_UNINSTALL: 'pending_uninstall',
-    PENDING_RESTORE: 'pending_restore',
-    PENDING_UPDATE: 'pending_update',
-    PENDING_FORCE_UPDATE: 'pending_force_update',
-    PENDING_BACKUP: 'pending_backup',
-    ERROR: 'error',
-    INSTALLED: 'installed'
-};
-var HSTATES = {
-    HEALTHY: 'healthy',
-    UNHEALTHY: 'unhealthy',
-    ERROR: 'error',
-    DEAD: 'dead'
-};
-
 app.filter('installError', function () {
     return function (app) {
+        if (!app) return false;
         if (app.installationState === ISTATES.ERROR) return true;
         if (app.installationState === ISTATES.INSTALLED) {
             // app.health can also be null to indicate insufficient data
@@ -105,85 +116,207 @@ app.filter('installError', function () {
     };
 });
 
+app.filter('activeTask', function () {
+    return function (app) {
+        if (!app) return false;
+        return app.taskId !== null;
+    };
+});
+
 app.filter('installSuccess', function () {
     return function (app) {
+        if (!app) return false;
         return app.installationState === ISTATES.INSTALLED;
     };
 });
 
-app.filter('activeOAuthClients', function () {
-    return function (clients, user) {
-        return clients.filter(function (c) { return user.admin || (c.activeTokens && c.activeTokens.length > 0); });
+app.filter('appIsInstalledAndHealthy', function () {
+    return function (app) {
+        if (!app) return false;
+        return (app.installationState === ISTATES.INSTALLED && app.health === HSTATES.HEALTHY && app.runState === RSTATES.RUNNING);
     };
 });
 
-app.filter('prettyAppMessage', function () {
-    return function (message) {
-        if (message === 'ETRYAGAIN') return 'The DNS record for this location is not setup correctly. Please verify your DNS settings and repair this app.';
-        if (message === 'DNS Record already exists') return 'The DNS record for this location already exists. Manually remove the DNS record and then click on repair.';
+app.filter('applicationLink', function() {
+    return function(app) {
+        if (!app) return '';
+
+        if (app.installationState === ISTATES.INSTALLED && app.health === HSTATES.HEALTHY && app.runState === RSTATES.RUNNING && !app.pendingPostInstallConfirmation) {
+            return 'https://' + app.fqdn;
+        } else {
+            return '';
+        }
+    };
+});
+
+// this appears when an item in app grid is clicked
+app.filter('prettyAppErrorMessage', function () {
+    return function (app) {
+        if (!app) return '';
+
+        if (app.installationState === ISTATES.INSTALLED) {
+            // app.health can also be null to indicate insufficient data
+            if (app.health === HSTATES.UNHEALTHY) return 'The app is not responding to health checks. Check the logs for any error messages.';
+        }
+
+        if (app.error.reason === 'Access Denied') {
+            if (app.error.domain) return 'The DNS record for this location is not setup correctly. Please verify your DNS settings and repair this app.';
+        } else if (app.error.reason === 'Already Exists') {
+            if (app.error.domain) return 'The DNS record for this location already exists. Cloudron does not remove existing DNS records. Manually remove the DNS record and then click on repair.';
+        }
+
+        return app.error.message;
+    };
+});
+
+// this appears as tool tip in app grid
+app.filter('appProgressMessage', function () {
+    return function (app) {
+        var message = app.message || (app.error ? app.error.message : '');
         return message;
     };
 });
 
-app.filter('shortAppMessage', function () {
-    return function (message) {
-        if (message === 'ETRYAGAIN') return 'DNS record not setup correctly';
-        return message;
+app.filter('selectedTagFilter', function () {
+    return function selectedTagFilter(apps, selectedTags) {
+        return apps.filter(function (app) {
+            if (selectedTags.length === 0) return true;
+            if (!app.tags) return false;
+
+            for (var i = 0; i < selectedTags.length; i++) {
+                if (app.tags.indexOf(selectedTags[i]) === -1) return false;
+            }
+
+            return true;
+        });
     };
 });
 
-app.filter('prettyMemory', function () {
-    return function (memory) {
-        // Adjust the default memory limit if it changes
-        return memory ? Math.floor(memory / 1024 / 1024) : 256;
+app.filter('selectedDomainFilter', function () {
+    return function selectedDomainFilter(apps, selectedDomain) {
+        return apps.filter(function (app) {
+            if (!selectedDomain) return true;
+            if (selectedDomain._alldomains) return true;  // magic domain for single select, see apps.js ALL_DOMAINS_DOMAIN
+
+            if (selectedDomain.domain === app.domain) return true;
+            return !!app.alternateDomains.find(function (ad) { return ad.domain === selectedDomain.domain; });
+        });
+    };
+});
+
+app.filter('appSearchFilter', function () {
+    return function appSearchFilter(apps, appSearch) {
+        return apps.filter(function (app) {
+            if (!appSearch) return true;
+            return app.fqdn.indexOf(appSearch) !== -1 || (app.label && app.label.indexOf(appSearch) !== -1);
+        });
+    };
+});
+
+app.filter('prettyDomains', function () {
+    return function prettyDomains(domains) {
+        return domains.map(function (d) { return d.domain; }).join(', ');
     };
 });
 
 app.filter('installationActive', function () {
-    return function(app) {
+    return function (app) {
         if (app.installationState === ISTATES.ERROR) return false;
         if (app.installationState === ISTATES.INSTALLED) return false;
         return true;
     };
 });
 
-app.filter('installationStateLabel', function() {
-    // for better DNS errors
-    function detailedError(app) {
-        if (app.installationProgress === 'ETRYAGAIN') return 'DNS Error';
-        return 'Error';
-    }
-
+// this appears in the app grid
+app.filter('installationStateLabel', function () {
     return function(app) {
-        var waiting = app.progress === 0 ? ' (Pending)' : '';
+        if (!app) return '';
+
+        var waiting = app.progress === 0 ? ' (Queued)' : '';
 
         switch (app.installationState) {
         case ISTATES.PENDING_INSTALL:
-        case ISTATES.PENDING_CLONE:
             return 'Installing' + waiting;
-        case ISTATES.PENDING_CONFIGURE: return 'Configuring' + waiting;
+        case ISTATES.PENDING_CLONE:
+            return 'Cloning' + waiting;
+        case ISTATES.PENDING_LOCATION_CHANGE:
+        case ISTATES.PENDING_CONFIGURE:
+        case ISTATES.PENDING_RECREATE_CONTAINER:
+        case ISTATES.PENDING_DEBUG:
+            return 'Configuring' + waiting;
+        case ISTATES.PENDING_RESIZE:
+            return 'Resizing' + waiting;
+        case ISTATES.PENDING_DATA_DIR_MIGRATION:
+            return 'Migrating data' + waiting;
         case ISTATES.PENDING_UNINSTALL: return 'Uninstalling' + waiting;
         case ISTATES.PENDING_RESTORE: return 'Restoring' + waiting;
         case ISTATES.PENDING_UPDATE: return 'Updating' + waiting;
-        case ISTATES.PENDING_FORCE_UPDATE: return 'Updating' + waiting;
         case ISTATES.PENDING_BACKUP: return 'Backing up' + waiting;
-        case ISTATES.ERROR: return detailedError(app);
+        case ISTATES.PENDING_START: return 'Starting' + waiting;
+        case ISTATES.PENDING_STOP: return 'Stopping' + waiting;
+        case ISTATES.PENDING_RESTART: return 'Restarting' + waiting;
+        case ISTATES.ERROR: {
+            if (app.error && app.error.message === 'ETRYAGAIN') return 'DNS Error';
+            return 'Error';
+        }
         case ISTATES.INSTALLED: {
-            if (app.runState === 'running') {
+            if (app.debugMode) {
+                return 'Recovery Mode';
+            } else if (app.runState === 'running') {
                 if (!app.health) return 'Starting...'; // no data yet
                 if (app.health === HSTATES.HEALTHY) return 'Running';
                 return 'Not responding'; // dead/exit/unhealthy
-            } else if (app.runState === 'pending_start') return 'Starting...';
-            else if (app.runState === 'pending_stop') return 'Stopping...';
-            else if (app.runState === 'stopped') return 'Stopped';
+            } else if (app.runState === 'stopped') return 'Stopped';
             else return app.runState;
-            break;
         }
         default: return app.installationState;
         }
     };
 });
 
+app.filter('taskName', function () {
+    return function(installationState) {
+        switch (installationState) {
+        case ISTATES.PENDING_INSTALL: return 'install';
+        case ISTATES.PENDING_CLONE: return 'clone';
+        case ISTATES.PENDING_LOCATION_CHANGE: return 'location change';
+        case ISTATES.PENDING_CONFIGURE: return 'configure';
+        case ISTATES.PENDING_RECREATE_CONTAINER: return 'create container';
+        case ISTATES.PENDING_DEBUG: return 'debug';
+        case ISTATES.PENDING_RESIZE: return 'resize';
+        case ISTATES.PENDING_DATA_DIR_MIGRATION: return 'data migration';
+        case ISTATES.PENDING_UNINSTALL: return 'uninstall';
+        case ISTATES.PENDING_RESTORE: return 'restore';
+        case ISTATES.PENDING_UPDATE: return 'update';
+        case ISTATES.PENDING_BACKUP: return 'backup';
+        case ISTATES.PENDING_START: return 'start app';
+        case ISTATES.PENDING_STOP: return 'stop app';
+        case ISTATES.PENDING_RESTART: return 'restart app';
+        default: return installationState || '';
+        }
+    };
+});
+
+app.filter('errorSuggestion', function () {
+    return function (error) {
+        if (!error) return '';
+
+        switch (error.reason) {
+        case ERROR.ACCESS_DENIED:
+            if (error.domain) return 'Check the DNS credentials of ' + error.domain.domain + ' in the Domains & Certs view';
+            return '';
+        case ERROR.COLLECTD_ERROR: return 'Check if collectd is running on the server';
+        case ERROR.DATABASE_ERROR: return 'Check if MySQL database is running on the server';
+        case ERROR.DOCKER_ERROR: return 'Check if docker is running on the server';
+        case ERROR.DNS_ERROR: return 'Check if the DNS service of the domain is running';
+        case ERROR.LOGROTATE_ERROR: return 'Check if logrotate is running on the server';
+        case ERROR.NETWORK_ERROR: return 'Check if there are any network issues on the server';
+        case ERROR.REVERSEPROXY_ERROR: return 'Check if nginx is running on the server';
+        default: return '';
+        }
+    };
+});
+
 app.filter('readyToUpdate', function () {
     return function (apps) {
         return apps.every(function (app) {
@@ -200,25 +333,6 @@ app.filter('inProgressApps', function () {
     };
 });
 
-app.filter('ignoreAdminGroup', function () {
-    return function (groups) {
-        return groups.filter(function (group) {
-            if (group.id) return group.id !== 'admin';
-            return group !== 'admin';
-        });
-    };
-});
-
-app.filter('applicationLink', function() {
-    return function(app) {
-        if (app.installationState === ISTATES.INSTALLED && app.health === HSTATES.HEALTHY) {
-            return 'https://' + app.fqdn;
-        } else {
-            return '';
-        }
-    };
-});
-
 app.filter('prettyHref', function () {
     return function (input) {
         if (!input) return input;
@@ -230,8 +344,8 @@ app.filter('prettyHref', function () {
 
 app.filter('prettyDate', function () {
     // http://ejohn.org/files/pretty.js
-    return function prettyDate(time) {
-        var date = new Date(time),
+    return function prettyDate(utc) {
+        var date = new Date(utc), // this converts utc into browser timezone and not cloudron timezone!
             diff = (((new Date()).getTime() - date.getTime()) / 1000) + 30, // add 30seconds for clock skew
             day_diff = Math.floor(diff / 86400);
 
@@ -252,16 +366,41 @@ app.filter('prettyDate', function () {
     };
 });
 
+app.filter('prettyLongDate', function () {
+    return function prettyLongDate(utc) {
+        return moment(utc).format('MMMM Do YYYY, h:mm:ss a'); // this converts utc into browser timezone and not cloudron timezone!
+    };
+});
+
+app.filter('prettyShortDate', function () {
+    return function prettyShortDate(utc) {
+        return moment(utc).format('MMMM Do YYYY'); // this converts utc into browser timezone and not cloudron timezone!
+    };
+});
+
+app.filter('prettyEmailAddresses', function () {
+    return function prettyEmailAddresses(addresses) {
+        if (!addresses || addresses === '<>') return '<>';
+        if (Array.isArray(addresses)) return addresses.map(function (a) { return a.slice(1, -1); }).join(', ');
+        return addresses.slice(1, -1);
+    };
+});
+
 app.filter('markdown2html', function () {
     var converter = new showdown.Converter({
-        extensions: ['targetblank'],
+        extensions: [ 'targetblank' ],
         simplifiedAutoLink: true,
         strikethrough: true,
         tables: true
     });
 
+    // without this cache, the code runs into some infinite loop (https://github.com/angular/angular.js/issues/3980)
+    var cache = {};
+
     return function (text) {
-        return converter.makeHtml(text);
+        if (cache[text]) return cache[text];
+        cache[text] = converter.makeHtml(text);
+        return cache[text];
     };
 });
 
@@ -284,58 +423,6 @@ app.filter('postInstallMessage', function () {
     };
 });
 
-
-// keep this in sync with eventlog.js and CLI tool
-var ACTION_ACTIVATE = 'cloudron.activate';
-var ACTION_APP_CONFIGURE = 'app.configure';
-var ACTION_APP_INSTALL = 'app.install';
-var ACTION_APP_RESTORE = 'app.restore';
-var ACTION_APP_UNINSTALL = 'app.uninstall';
-var ACTION_APP_UPDATE = 'app.update';
-var ACTION_APP_LOGIN = 'app.login';
-var ACTION_BACKUP_FINISH = 'backup.finish';
-var ACTION_BACKUP_START = 'backup.start';
-var ACTION_BACKUP_CLEANUP = 'backup.cleanup';
-var ACTION_CERTIFICATE_RENEWAL = 'certificate.renew';
-var ACTION_CLI_MODE = 'settings.climode';
-var ACTION_START = 'cloudron.start';
-var ACTION_UPDATE = 'cloudron.update';
-var ACTION_USER_ADD = 'user.add';
-var ACTION_USER_LOGIN = 'user.login';
-var ACTION_USER_REMOVE = 'user.remove';
-var ACTION_USER_UPDATE = 'user.update';
-
-app.filter('eventLogDetails', function() {
-    // NOTE: if you change this, the CLI tool (cloudron machine eventlog) probably needs fixing as well
-    return function(eventLog) {
-        var source = eventLog.source;
-        var data = eventLog.data;
-        var errorMessage = data.errorMessage;
-
-        switch (eventLog.action) {
-        case ACTION_ACTIVATE: return 'Cloudron activated';
-        case ACTION_APP_CONFIGURE: return 'App ' + data.appId + ' was configured';
-        case ACTION_APP_INSTALL: return 'App ' + data.manifest.id + '@' + data.manifest.version + ' installed at ' + data.location + ' with id ' + data.appId;
-        case ACTION_APP_RESTORE: return 'App ' + data.appId + ' restored';
-        case ACTION_APP_UNINSTALL: return 'App ' + data.appId + ' uninstalled';
-        case ACTION_APP_UPDATE: return 'App ' + data.appId + ' updated to version ' + data.toManifest.id + '@' + data.toManifest.version;
-        case ACTION_APP_LOGIN: return 'App ' + data.appId + ' logged in';
-        case ACTION_BACKUP_START: return 'Backup started';
-        case ACTION_BACKUP_FINISH: return 'Backup finished. ' + (errorMessage ? ('error: ' + errorMessage) : ('id: ' + data.filename));
-        case ACTION_BACKUP_CLEANUP: return 'Backup ' + data.backup.id + ' removed';
-        case ACTION_CERTIFICATE_RENEWAL: return 'Certificate renewal for ' + data.domain + (errorMessage ? ' failed' : 'succeeded');
-        case ACTION_CLI_MODE: return 'CLI mode was ' + (data.enabled ? 'enabled' : 'disabled');
-        case ACTION_START: return 'Cloudron started with version ' + data.version;
-        case ACTION_UPDATE: return 'Updating to version ' + data.boxUpdateInfo.version;
-        case ACTION_USER_ADD: return 'User ' + data.email + ' added with id ' + data.userId;
-        case ACTION_USER_LOGIN: return 'User ' + data.userId + ' logged in';
-        case ACTION_USER_REMOVE: return 'User ' + data.userId + ' removed';
-        case ACTION_USER_UPDATE: return 'User ' + data.userId + ' updated';
-        default: return eventLog.action;
-        }
-    };
-});
-
 // custom directive for dynamic names in forms
 // See http://stackoverflow.com/questions/23616578/issue-registering-form-control-with-interpolated-name#answer-23617401
 app.directive('laterName', function () {                   // (2)
@@ -375,7 +462,7 @@ app.run(['$route', '$rootScope', '$location', function ($route, $rootScope, $loc
 app.directive('ngClickSelect', function () {
     return {
         restrict: 'AC',
-        link: function (scope, element, attrs) {
+        link: function (scope, element/*, attrs */) {
             element.bind('click', function () {
                 var selection = window.getSelection();
                 var range = document.createRange();
@@ -416,7 +503,8 @@ app.directive('tagInput', function () {
         scope: {
             inputTags: '=taglist'
         },
-        link: function ($scope, element, attrs) {
+        require: '^form',
+        link: function ($scope, element, attrs, formCtrl) {
             $scope.defaultWidth = 200;
             $scope.tagText = ''; // current tag being edited
             $scope.placeholder = attrs.placeholder;
@@ -424,18 +512,20 @@ app.directive('tagInput', function () {
                 if ($scope.inputTags === undefined) {
                     return [];
                 }
-                return $scope.inputTags.split(',').filter(function (tag) {
+                return $scope.inputTags.split(' ').filter(function (tag) {
                     return tag !== '';
                 });
             };
             $scope.addTag = function () {
-                var tagArray;
-                if ($scope.tagText.length === 0) {
-                    return;
+                var tagArray = $scope.tagArray();
+
+                // prevent adding empty or existing items
+                if ($scope.tagText.length === 0 || tagArray.indexOf($scope.tagText) !== -1) {
+                    return $scope.tagText = '';
                 }
-                tagArray = $scope.tagArray();
+
                 tagArray.push($scope.tagText);
-                $scope.inputTags = tagArray.join(',');
+                $scope.inputTags = tagArray.join(' ');
                 return $scope.tagText = '';
             };
             $scope.deleteTag = function (key) {
@@ -448,7 +538,8 @@ app.directive('tagInput', function () {
                         tagArray.splice(key, 1);
                     }
                 }
-                return $scope.inputTags = tagArray.join(',');
+                formCtrl.$setDirty();
+                return $scope.inputTags = tagArray.join(' ');
             };
             $scope.$watch('tagText', function (newVal, oldVal) {
                 var tempEl;
@@ -461,6 +552,9 @@ app.directive('tagInput', function () {
                     return tempEl.remove();
                 }
             });
+            element.bind('click', function () {
+                element[0].firstChild.lastChild.focus();
+            });
             element.bind('keydown', function (e) {
                 var key = e.which;
                 if (key === 9 || key === 13) {
@@ -472,7 +566,7 @@ app.directive('tagInput', function () {
             });
             element.bind('keyup', function (e) {
                 var key = e.which;
-                if (key === 9 || key === 13 || key === 32 || key === 188) {
+                if (key === 9 || key === 13 || key === 32) {
                     e.preventDefault();
                     return $scope.$apply('addTag()');
                 }
@@ -480,9 +574,9 @@ app.directive('tagInput', function () {
         },
         template:
             '<div class="tag-input-container">' +
-                '<div class="input-tag" data-ng-repeat="tag in tagArray()">' +
-                    '{{tag}}' +
-                    '<div class="delete-tag" data-ng-click="deleteTag($index)">&times;</div>' +
+                '<div class="btn-group input-tag" data-ng-repeat="tag in tagArray()">' +
+                    '<button type="button" class="btn btn-xs btn-primary" disabled>{{ tag }}</button>' +
+                    '<button type="button" class="btn btn-xs btn-primary" data-ng-click="deleteTag($index)">&times;</button>' +
                 '</div>' +
                 '<input type="text" data-ng-model="tagText" ng-blur="addTag()" placeholder="{{placeholder}}"/>' +
             '</div>'

src/js/login.js

@@ -0,0 +1,149 @@
+'use strict';
+
+/* global angular, $, showdown */
+
+// create main application module
+var app = angular.module('Application', []);
+
+app.filter('markdown2html', function () {
+    var converter = new showdown.Converter({
+        extensions: [ 'targetblank' ],
+        simplifiedAutoLink: true,
+        strikethrough: true,
+        tables: true
+    });
+
+    return function (text) {
+        return converter.makeHtml(text);
+    };
+});
+
+// disable sce for footer https://code.angularjs.org/1.5.8/docs/api/ng/service/$sce
+app.config(function ($sceProvider) {
+    $sceProvider.enabled(false);
+});
+
+app.controller('LoginController', ['$scope', '$http', function ($scope, $http) {
+    // Stupid angular location provider either wants html5 location mode or not, do the query parsing on my own
+    var search = decodeURIComponent(window.location.search).slice(1).split('&').map(function (item) { return item.indexOf('=') === -1 ? [item, true] : [item.slice(0, item.indexOf('=')), item.slice(item.indexOf('=')+1)]; }).reduce(function (o, k) { o[k[0]] = k[1]; return o; }, {});
+
+    $scope.initialized = false;
+    $scope.mode = '';
+    $scope.busy = false;
+    $scope.error = false;
+    $scope.status = null;
+    $scope.username = '';
+    $scope.password = '';
+    $scope.totpToken = '';
+    $scope.passwordResetIdentifier = '';
+    $scope.newPassword = '';
+    $scope.newPasswordRepeat = '';
+    var API_ORIGIN = '<%= apiOrigin %>' || window.location.origin;
+
+    $scope.onLogin = function () {
+        $scope.busy = true;
+        $scope.error = false;
+
+        var data = {
+            username: $scope.username,
+            password: $scope.password,
+            totpToken: $scope.totpToken
+        };
+
+        function error() {
+            $scope.busy = false;
+            $scope.error = true;
+
+            $scope.password = '';
+            $scope.loginForm.$setPristine();
+            setTimeout(function () { $('#inputPassword').focus(); }, 200);
+        }
+
+        $http.post(API_ORIGIN + '/api/v1/cloudron/login', data).success(function (data, status) {
+            if (status !== 200) return error();
+
+            localStorage.token = data.accessToken;
+            window.location.href = search.returnTo || '/';
+        }).error(error);
+    };
+
+    $scope.onPasswordReset = function () {
+        $scope.busy = true;
+
+        var data = {
+            identifier: $scope.passwordResetIdentifier
+        };
+
+        function done() {
+            $scope.busy = false;
+            $scope.mode = 'passwordResetDone';
+        }
+
+        $http.post(API_ORIGIN + '/api/v1/cloudron/password_reset_request', data).success(done).error(done);
+    };
+
+    $scope.onNewPassword = function () {
+        $scope.busy = true;
+
+        var data = {
+            resetToken: search.resetToken,
+            password: $scope.newPassword
+        };
+
+        function error(status) {
+            console.log('error', status)
+            $scope.busy = false;
+
+            if (status === 401) $scope.error = 'Invalid reset token';
+            else if (status === 409) $scope.error = 'Ask your admin for an invite link first';
+            else $scope.error = 'Unknown error';
+        }
+
+        $http.post(API_ORIGIN + '/api/v1/cloudron/password_reset', data).success(function (data, status) {
+            if (status !== 202) return error(status);
+
+            // set token to autologin
+            localStorage.token = data.accessToken;
+
+            $scope.mode = 'newPasswordDone';
+        }).error(function (data, status) {
+            error(status);
+        });
+    };
+
+    $scope.showPasswordReset = function () {
+        window.document.title = 'Password Reset';
+        $scope.mode = 'passwordReset';
+        $scope.passwordResetIdentifier = '';
+        setTimeout(function () { $('#inputPasswordResetIdentifier').focus(); }, 200);
+    };
+
+    $scope.showLogin = function () {
+        if ($scope.status) window.document.title = $scope.status.cloudronName + ' Login';
+        $scope.mode = 'login';
+        $scope.error = false;
+        setTimeout(function () { $('#inputUsername').focus(); }, 200);
+    };
+
+    $scope.showNewPassword = function () {
+        window.document.title = 'Set New Password';
+        $scope.mode = 'newPassword';
+        setTimeout(function () { $('#inputNewPassword').focus(); }, 200);
+    };
+
+    $http.get(API_ORIGIN + '/api/v1/cloudron/status').success(function (data, status) {
+        $scope.initialized = true;
+
+        if (status !== 200) return;
+
+        if ($scope.mode === 'login') window.document.title = data.cloudronName + ' Login';
+        $scope.status = data;
+    }).error(function () {
+        $scope.initialized = false;
+    });
+
+    // Init into the correct view
+    if (search.passwordReset) $scope.showPasswordReset();
+    else if (search.resetToken) $scope.showNewPassword();
+    else $scope.showLogin();
+}]);

src/js/logs.js

@@ -0,0 +1,190 @@
+'use strict';
+
+/* global angular */
+/* global moment */
+/* global $ */
+
+// create main application module
+var app = angular.module('Application', ['angular-md5', 'ui-notification']);
+
+app.controller('LogsController', ['$scope', 'Client', function ($scope, Client) {
+    var search = decodeURIComponent(window.location.search).slice(1).split('&').map(function (item) { return item.split('='); }).reduce(function (o, k) { o[k[0]] = k[1]; return o; }, {});
+
+    $scope.initialized = false;
+    $scope.client = Client;
+    $scope.selected = '';
+    $scope.activeEventSource = null;
+    $scope.lines = 100;
+    $scope.selectedAppInfo = null;
+    $scope.selectedTaskInfo = null;
+
+    function ab2str(buf) {
+        return String.fromCharCode.apply(null, new Uint16Array(buf));
+    }
+
+    $scope.clear = function () {
+        var logViewer = $('.logs-container');
+        logViewer.empty();
+    };
+
+    // https://github.com/janl/mustache.js/blob/master/mustache.js#L60
+    var entityMap = {
+        '&': '&',
+        '<': '&lt;',
+        '>': '&gt;',
+        '"': '&quot;',
+        "'": '&#39;',
+        '/': '&#x2F;',
+        '`': '&#x60;',
+        '=': '&#x3D;'
+    };
+
+    function escapeHtml(string) {
+        return String(string).replace(/[&<>"'`=\/]/g, function fromEntityMap (s) {
+            return entityMap[s];
+        });
+    }
+
+    function showLogs() {
+        if (!$scope.selected) return;
+
+        var func;
+        if ($scope.selected.type === 'platform') func = Client.getPlatformLogs;
+        else if ($scope.selected.type === 'service') func = Client.getServiceLogs;
+        else if ($scope.selected.type === 'task') func = Client.getTaskLogs;
+        else if ($scope.selected.type === 'app') func = Client.getAppLogs;
+
+        func($scope.selected.value, true /* follow */, $scope.lines, function handleLogs(error, result) {
+            if (error) return console.error(error);
+
+            $scope.activeEventSource = result;
+            result.onmessage = function handleMessage(message) {
+                var data;
+
+                try {
+                    data = JSON.parse(message.data);
+                } catch (e) {
+                    return console.error(e);
+                }
+
+                // check if we want to auto scroll (this is before the appending, as that skews the check)
+                var tmp = $('.logs-container');
+                var autoScroll = tmp[0].scrollTop > (tmp[0].scrollHeight - tmp.innerHeight() - 24);
+
+                var logLine = $('<div class="log-line">');
+                // realtimeTimestamp is 0 if line is blank or some parse error
+                var timeString = data.realtimeTimestamp ? moment(data.realtimeTimestamp/1000).format('MMM DD HH:mm:ss') : '';
+                logLine.html('<span class="time">' + timeString + ' </span>' + window.ansiToHTML(escapeHtml(typeof data.message === 'string' ? data.message : ab2str(data.message))));
+                tmp.append(logLine);
+
+                if (autoScroll) tmp[0].lastChild.scrollIntoView({ behavior: 'instant', block: 'end' });
+            };
+        });
+    }
+
+    function select(ids, callback) {
+        if (ids.id) {
+            var BUILT_IN_LOGS = [
+                { name: 'Box', type: 'platform', value: 'box', url: Client.makeURL('/api/v1/cloudron/logs/box') },
+                { name: 'Graphite', type: 'service', value: 'graphite', url: Client.makeURL('/api/v1/services/graphite/logs') },
+                { name: 'MongoDB', type: 'service', value: 'mongodb', url: Client.makeURL('/api/v1/services/mongodb/logs') },
+                { name: 'MySQL', type: 'service', value: 'mysql', url: Client.makeURL('/api/v1/services/mysql/logs') },
+                { name: 'PostgreSQL', type: 'service', value: 'postgresql', url: Client.makeURL('/api/v1/services/postgresql/logs') },
+                { name: 'Mail', type: 'service', value: 'mail', url: Client.makeURL('/api/v1/services/mail/logs') },
+                { name: 'Docker', type: 'service', value: 'docker', url: Client.makeURL('/api/v1/services/docker/logs') },
+                { name: 'Nginx', type: 'service', value: 'nginx', url: Client.makeURL('/api/v1/services/nginx/logs') },
+                { name: 'Unbound', type: 'service', value: 'unbound', url: Client.makeURL('/api/v1/services/unbound/logs') },
+                { name: 'SFTP', type: 'service', value: 'sftp', url: Client.makeURL('/api/v1/services/sftp/logs') },
+                { name: 'TURN/STUN', type: 'service', value: 'turn', url: Client.makeURL('/api/v1/services/turn/logs') },
+            ];
+
+            $scope.selected = BUILT_IN_LOGS.find(function (e) { return e.value === ids.id; });
+            callback();
+        } else if (ids.crashId) {
+            $scope.selected = {
+                type: 'platform',
+                value: 'crash-' + ids.crashId,
+                name: 'Crash',
+                url: Client.makeURL('/api/v1/cloudron/logs/crash-' + ids.crashId)
+            };
+
+            callback();
+        } else if (ids.appId) {
+            Client.getApp(ids.appId, function (error, app) {
+                if (error) return callback(error);
+
+                $scope.selectedAppInfo = app;
+
+                $scope.selected = {
+                    type: 'app',
+                    value: app.id,
+                    name: app.fqdn + ' (' + app.manifest.title + ')',
+                    url: Client.makeURL('/api/v1/apps/' + app.id + '/logs'),
+                    addons: app.manifest.addons
+                };
+
+                callback();
+            });
+        } else if (ids.taskId) {
+            Client.getTask(ids.taskId, function (error, task) {
+                if (error) return callback(error);
+
+                $scope.selectedTaskInfo = task;
+
+                $scope.selected = {
+                    type: 'task',
+                    value: task.id,
+                    name: task.type,
+                    url: Client.makeURL('/api/v1/tasks/' + task.id + '/logs')
+                };
+
+                callback();
+            });
+        }
+    }
+
+    function init() {
+
+        Client.getStatus(function (error, status) {
+            if (error) return Client.initError(error, init);
+
+            if (!status.activated) {
+                console.log('Not activated yet, redirecting', status);
+                window.location.href = '/';
+                return;
+            }
+
+            // check version and force reload if needed
+            if (!localStorage.version) {
+                localStorage.version = status.version;
+            } else if (localStorage.version !== status.version) {
+                localStorage.version = status.version;
+                window.location.reload(true);
+            }
+
+            console.log('Running log version ', localStorage.version);
+
+            // get user profile as the first thing. this populates the "scope" and affects subsequent API calls
+            Client.refreshUserInfo(function (error) {
+                if (error) return Client.initError(error, init);
+
+                Client.refreshConfig(function (error) {
+                    if (error) return Client.initError(error, init);
+
+                    select({ id: search.id, taskId: search.taskId, appId: search.appId, crashId: search.crashId }, function (error) {
+                        if (error) return Client.initError(error, init);
+
+                        // now mark the Client to be ready
+                        Client.setReady();
+
+                        $scope.initialized = true;
+
+                        showLogs();
+                    });
+                });
+            });
+        });
+    }
+
+    init();
+}]);

src/js/main.js

@@ -0,0 +1,140 @@
+'use strict';
+
+/* global angular */
+/* global $ */
+
+angular.module('Application').controller('MainController', ['$scope', '$route', '$timeout', '$location', 'Client', function ($scope, $route, $timeout, $location, Client) {
+    $scope.initialized = false; // used to animate the UI
+    $scope.user = Client.getUserInfo();
+    $scope.installedApps = Client.getInstalledApps();
+    $scope.config = {};
+    $scope.client = Client;
+    $scope.subscription = {};
+    $scope.notifications = [];
+    $scope.hideNavBarActions = $location.path() === '/logs';
+
+    $scope.isActive = function (url) {
+        if (!$route.current) return false;
+        return $route.current.$$route.originalPath.indexOf(url) === 0;
+    };
+
+    $scope.logout = function (event) {
+        event.stopPropagation();
+        $scope.initialized = false;
+        Client.logout();
+    };
+
+    $scope.openSubscriptionSetup = function () {
+        Client.openSubscriptionSetup($scope.subscription);
+    };
+
+    // NOTE: this function is exported and called from the appstore.js
+    $scope.updateSubscriptionStatus = function () {
+        if (!Client.getUserInfo().isAtLeastAdmin) return;
+
+        Client.getSubscription(function (error, subscription) {
+            if (error && error.statusCode === 412) return; // ignore if not yet registered
+            if (error && error.statusCode === 402) return; // ignore if not yet registered
+            if (error) return console.error(error);
+
+            $scope.subscription = subscription;
+        });
+    };
+
+    function refreshNotifications(poll) {
+        Client.getNotifications(false, 1, 100, function (error, results) {
+            if (error) console.error(error);
+            else $scope.notifications = results;
+
+            if (poll) $timeout(refreshNotifications, 60 * 1000);
+        });
+    }
+
+    // update state of acknowledged notification
+    $scope.notificationAcknowledged = function (notificationId) {
+        // remove notification from list
+        $scope.notifications = $scope.notifications.filter(function (n) { return n.id !== notificationId; });
+    };
+
+    function init() {
+        Client.getStatus(function (error, status) {
+            if (error) return Client.initError(error, init);
+
+            // WARNING if anything about the routing is changed here test these use-cases:
+            //
+            // 1. Caas
+            // 3. selfhosted restore
+            // 4. local development with gulp develop
+
+            if (!status.activated) {
+                console.log('Not activated yet, redirecting', status);
+                if (status.restore.active || status.restore.errorMessage) { // show the error message in restore page
+                    window.location.href = '/restore.html';
+                } else {
+                    window.location.href = status.adminFqdn ? '/setup.html' : '/setupdns.html';
+                }
+                return;
+            }
+
+            // support local development with localhost check
+            if (window.location.hostname !== status.adminFqdn && window.location.hostname !== 'localhost') {
+                // user is accessing by IP or by the old admin location (pre-migration)
+                window.location.href = '/setupdns.html';
+                return;
+            }
+
+            // check version and force reload if needed
+            if (!localStorage.version) {
+                localStorage.version = status.version;
+            } else if (localStorage.version !== status.version) {
+                localStorage.version = status.version;
+                window.location.reload(true);
+            }
+
+            console.log('Running dashboard version ', localStorage.version);
+
+            // get user profile as the first thing. this populates the "scope" and affects subsequent API calls
+            Client.refreshUserInfo(function (error) {
+                if (error) return Client.initError(error, init);
+
+                Client.refreshConfig(function (error) {
+                    if (error) return Client.initError(error, init);
+
+                    Client.refreshInstalledApps(function (error) {
+                        if (error) return Client.initError(error, init);
+
+                        // now mark the Client to be ready
+                        Client.setReady();
+
+                        $scope.config = Client.getConfig();
+
+                        $scope.initialized = true;
+
+                        refreshNotifications(true);
+
+                        $scope.updateSubscriptionStatus();
+                    });
+                });
+            });
+        });
+    }
+
+    Client.onConfig(function (config) {
+        if (config.cloudronName) {
+            document.title = config.cloudronName;
+        }
+    });
+
+    Client.onReconnect(function () {
+        refreshNotifications(false);
+    });
+
+    init();
+
+    // setup all the dialog focus handling
+    ['updateModal'].forEach(function (id) {
+        $('#' + id).on('shown.bs.modal', function () {
+            $(this).find('[autofocus]:first').focus();
+        });
+    });
+}]);

src/js/restore.js

@@ -1,9 +1,11 @@
 'use strict';
 
+/* global angular */
 /* global tld */
+/* global $ */
 
 // create main application module
-var app = angular.module('Application', ['angular-md5', 'ui-notification']);
+var app = angular.module('Application', ['angular-md5', 'ui-notification', 'ui.bootstrap']);
 
 app.filter('zoneName', function () {
     return function (domain) {
@@ -11,11 +13,15 @@ app.filter('zoneName', function () {
     };
 });
 
-app.controller('RestoreController', ['$scope', '$http', 'Client', function ($scope, $http, Client) {
+app.controller('RestoreController', ['$scope', 'Client', function ($scope, Client) {
     var search = decodeURIComponent(window.location.search).slice(1).split('&').map(function (item) { return item.split('='); }).reduce(function (o, k) { o[k[0]] = k[1]; return o; }, {});
 
+    $scope.client = Client;
     $scope.busy = false;
     $scope.error = {};
+    $scope.message = ''; // progress
+
+    // variables here have to match the import config logic!
     $scope.provider = '';
     $scope.bucket = '';
     $scope.prefix = '';
@@ -29,10 +35,35 @@ app.controller('RestoreController', ['$scope', '$http', 'Client', function ($sco
     $scope.instanceId = '';
     $scope.acceptSelfSignedCerts = false;
     $scope.format = 'tgz';
+    $scope.advancedVisible = false;
+    $scope.password = '';
+    $scope.encrypted = false; // only used if a backup config contains that flag
+
+    $scope.sysinfo = {
+        provider: 'generic',
+        ip: '',
+        ifname: ''
+    };
+
+    $scope.sysinfoProvider = [
+        { name: 'Public IP', value: 'generic' },
+        { name: 'Static IP Address', value: 'fixed' },
+        { name: 'Network Interface', value: 'network-interface' }
+    ];
+
+    $scope.prettySysinfoProviderName = function (provider) {
+        switch (provider) {
+        case 'generic': return 'Public IP';
+        case 'fixed': return 'Static IP Address';
+        case 'network-interface': return 'Network Interface';
+        default: return 'Unknown';
+        }
+    };
 
     // List is from http://docs.aws.amazon.com/general/latest/gr/rande.html#s3_region
     $scope.s3Regions = [
         { name: 'Asia Pacific (Mumbai)', value: 'ap-south-1' },
+        { name: 'Asia Pacific (Osaka-Local)', value: 'ap-northeast-3' },
         { name: 'Asia Pacific (Seoul)', value: 'ap-northeast-2' },
         { name: 'Asia Pacific (Singapore)', value: 'ap-southeast-1' },
         { name: 'Asia Pacific (Sydney)', value: 'ap-southeast-2' },
@@ -41,6 +72,8 @@ app.controller('RestoreController', ['$scope', '$http', 'Client', function ($sco
         { name: 'EU (Frankfurt)', value: 'eu-central-1' },
         { name: 'EU (Ireland)', value: 'eu-west-1' },
         { name: 'EU (London)', value: 'eu-west-2' },
+        { name: 'EU (Paris)', value: 'eu-west-3' },
+        { name: 'EU (Stockholm)', value: 'eu-north-1' },
         { name: 'South America (São Paulo)', value: 'sa-east-1' },
         { name: 'US East (N. Virginia)', value: 'us-east-1' },
         { name: 'US East (Ohio)', value: 'us-east-2' },
@@ -50,18 +83,58 @@ app.controller('RestoreController', ['$scope', '$http', 'Client', function ($sco
 
     $scope.doSpacesRegions = [
         { name: 'AMS3', value: 'https://ams3.digitaloceanspaces.com' },
+        { name: 'FRA1', value: 'https://fra1.digitaloceanspaces.com' },
         { name: 'NYC3', value: 'https://nyc3.digitaloceanspaces.com' },
+        { name: 'SFO2', value: 'https://sfo2.digitaloceanspaces.com' },
         { name: 'SGP1', value: 'https://sgp1.digitaloceanspaces.com' }
     ];
 
+    $scope.exoscaleSosRegions = [
+        { name: 'AT-VIE-1', value: 'https://sos-at-vie-1.exo.io' },
+        { name: 'CH-DK-2', value: 'https://sos-ch-dk-2.exo.io' },
+        { name: 'CH-GVA-2', value: 'https://sos-ch-gva-2.exo.io' },
+        { name: 'DE-FRA-1', value: 'https://sos-de-fra-1.exo.io' },
+    ];
+
+    // https://www.scaleway.com/docs/object-storage-feature/
+    $scope.scalewayRegions = [
+        { name: 'FR-PAR', value: 'https://s3.fr-par.scw.cloud', region: 'fr-par' }, // default
+        { name: 'NL-AMS', value: 'https://s3.nl-ams.scw.cloud', region: 'nl-ams' }
+    ];
+
+    $scope.linodeRegions = [
+        { name: 'Newark', value: 'us-east-1.linodeobjects.com', region: 'us-east-1' }, // default
+        { name: 'Frankfurt', value: 'eu-central-1.linodeobjects.com', region: 'us-east-1' },
+    ];
+
+    $scope.ovhRegions = [
+        { name: 'Beauharnois (BHS)', value: 'https://s3.bhs.cloud.ovh.net', region: 'bhs' }, // default
+        { name: 'Frankfurt (DE)', value: 'https://s3.de.cloud.ovh.net', region: 'de' },
+        { name: 'Gravelines (GRA)', value: 'https://s3.gra.cloud.ovh.net', region: 'gra' },
+        { name: 'Strasbourg (SBG)', value: 'https://s3.sbg.cloud.ovh.net', region: 'sbg' },
+        { name: 'London (UK)', value: 'https://s3.uk.cloud.ovh.net', region: 'uk' },
+        { name: 'Warsaw (WAW)', value: 'https://s3.waw.cloud.ovh.net', region: 'waw' },
+    ];
+
+    $scope.wasabiRegions = [
+        { name: 'EU Central 1', value: 'https://s3.eu-central-1.wasabisys.com' },
+        { name: 'US East 1', value: 'https://s3.us-east-1.wasabisys.com' },
+        { name: 'US East 2', value: 'https://s3.us-east-2.wasabisys.com ' },
+        { name: 'US West 1', value: 'https://s3.us-west-1.wasabisys.com' }
+    ];
+
     $scope.storageProvider = [
         { name: 'Amazon S3', value: 's3' },
         { name: 'DigitalOcean Spaces', value: 'digitalocean-spaces' },
         { name: 'Exoscale SOS', value: 'exoscale-sos' },
         { name: 'Filesystem', value: 'filesystem' },
         { name: 'Google Cloud Storage', value: 'gcs' },
+        { name: 'Linode Object Storage', value: 'linode-objectstorage' },
         { name: 'Minio', value: 'minio' },
+        { name: 'OVH Object Storage', value: 'ovh-objectstorage' },
+        { name: 'Scaleway Object Storage', value: 'scaleway-objectstorage' },
         { name: 'S3 API Compatible (v4)', value: 's3-v4-compat' },
+        { name: 'Wasabi', value: 'wasabi' }
     ];
 
     $scope.formats = [
@@ -70,7 +143,9 @@ app.controller('RestoreController', ['$scope', '$http', 'Client', function ($sco
     ];
 
     $scope.s3like = function (provider) {
-        return provider === 's3' || provider === 'minio' || provider === 's3-v4-compat' || provider === 'exoscale-sos' || provider === 'digitalocean-spaces';
+        return provider === 's3' || provider === 'minio' || provider === 's3-v4-compat' || provider === 'exoscale-sos'
+            || provider === 'digitalocean-spaces' || provider === 'wasabi' || provider === 'scaleway-objectstorage'
+            || provider === 'linode-objectstorage' || provider === 'ovh-objectstorage';
     };
 
     $scope.restore = function () {
@@ -79,9 +154,9 @@ app.controller('RestoreController', ['$scope', '$http', 'Client', function ($sco
 
         var backupConfig = {
             provider: $scope.provider,
-            key: $scope.key,
             format: $scope.format
         };
+        if ($scope.password) backupConfig.password = $scope.password;
 
         // only set provider specific fields, this will clear them in the db
         if ($scope.s3like(backupConfig.provider)) {
@@ -94,13 +169,25 @@ app.controller('RestoreController', ['$scope', '$http', 'Client', function ($sco
 
             if (backupConfig.provider === 's3') {
                 if ($scope.region) backupConfig.region = $scope.region;
+                delete backupConfig.endpoint;
             } else if (backupConfig.provider === 'minio' || backupConfig.provider === 's3-v4-compat') {
                 backupConfig.region = 'us-east-1';
                 backupConfig.acceptSelfSignedCerts = $scope.acceptSelfSignedCerts;
             } else if (backupConfig.provider === 'exoscale-sos') {
-                backupConfig.endpoint = 'https://sos-ch-dk-2.exo.io';
                 backupConfig.region = 'us-east-1';
                 backupConfig.signatureVersion = 'v4';
+            } else if (backupConfig.provider === 'wasabi') {
+                backupConfig.region = $scope.wasabiRegions.find(function (x) { return x.value === $scope.endpoint; }).region;
+                backupConfig.signatureVersion = 'v4';
+            } else if (backupConfig.provider === 'scaleway-objectstorage') {
+                backupConfig.region = $scope.scalewayRegions.find(function (x) { return x.value === $scope.endpoint; }).region;
+                backupConfig.signatureVersion = 'v4';
+            } else if (backupConfig.provider === 'linode-objectstorage') {
+                backupConfig.region = $scope.linodeRegions.find(function (x) { return x.value === $scope.endpoint; }).region;
+                backupConfig.signatureVersion = 'v4';
+            } else if (backupConfig.provider === 'ovh-objectstorage') {
+                backupConfig.region = $scope.ovhRegions.find(function (x) { return x.value === $scope.endpoint; }).region;
+                backupConfig.signatureVersion = 'v4';
             } else if (backupConfig.provider === 'digitalocean-spaces') {
                 backupConfig.region = 'us-east-1';
             }
@@ -135,6 +222,13 @@ app.controller('RestoreController', ['$scope', '$http', 'Client', function ($sco
             return;
         }
 
+        if ($scope.backupId.indexOf('box') === -1) {
+            $scope.error.generic = 'Backup id must contain "box"';
+            $scope.error.backupId = true;
+            $scope.busy = false;
+            return;
+        }
+
         var version = $scope.backupId.match(/_v(\d+.\d+.\d+)/);
         if (!version) {
             $scope.error.generic = 'Backup id is missing version information';
@@ -143,11 +237,20 @@ app.controller('RestoreController', ['$scope', '$http', 'Client', function ($sco
             return;
         }
 
-        Client.restore(backupConfig, $scope.backupId.replace(/\.tar\.gz(\.enc)?$/, ''), version ? version[1] : '', function (error) {
+        var sysinfoConfig = {
+            provider: $scope.sysinfo.provider
+        };
+        if ($scope.sysinfo.provider === 'fixed') {
+            sysinfoConfig.ip = $scope.sysinfo.ip;
+        } else if ($scope.sysinfo.provider === 'network-interface') {
+            sysinfoConfig.ifname = $scope.sysinfo.ifname;
+        }
+
+        Client.restore(backupConfig, $scope.backupId.replace(/\.tar\.gz(\.enc)?$/, ''), version ? version[1] : '', sysinfoConfig, function (error) {
             $scope.busy = false;
 
             if (error) {
-                if (error.statusCode === 402) {
+                if (error.statusCode === 424) {
                     $scope.error.generic = error.message;
 
                     if (error.message.indexOf('AWS Access Key Id') !== -1) {
@@ -169,12 +272,12 @@ app.controller('RestoreController', ['$scope', '$http', 'Client', function ($sco
                         $scope.error.generic = 'Unknown region';
                         $scope.error.region = true;
                         $scope.configureBackupForm.region.$setPristine();
-                        $('#inputConfigureBackupRegion').focus();
+                        $('#inputConfigureBackupDORegion').focus();
                     } else if (error.message.toLowerCase() === 'wrong region') {
                         $scope.error.generic = 'Wrong S3 Region';
                         $scope.error.region = true;
                         $scope.configureBackupForm.region.$setPristine();
-                        $('#inputConfigureBackupRegion').focus();
+                        $('#inputConfigureBackupS3Region').focus();
                     } else {
                         $('#inputConfigureBackupBucket').focus();
                     }
@@ -187,16 +290,24 @@ app.controller('RestoreController', ['$scope', '$http', 'Client', function ($sco
 
             waitForRestore();
         });
-    }
+    };
 
     function waitForRestore() {
         $scope.busy = true;
 
         Client.getStatus(function (error, status) {
-            if (!error && !status.webadminStatus.restoring) {
-                window.location.href = '/';
+            if (!error && !status.restore.active) { // restore finished
+                if (status.restore.errorMessage) {
+                    $scope.busy = false;
+                    $scope.error.generic = status.restore.errorMessage;
+                } else { // restore worked, redirect to admin page
+                    window.location.href = '/';
+                }
+                return;
             }
 
+            $scope.message = status.restore.message;
+
             setTimeout(waitForRestore, 5000);
         });
     }
@@ -219,20 +330,47 @@ app.controller('RestoreController', ['$scope', '$http', 'Client', function ($sco
 
     document.getElementById('gcsKeyFileInput').onchange = readFileLocally($scope.gcsKey, 'content', 'keyFileName');
 
-    Client.getStatus(function (error, status) {
-        if (error) {
-            window.location.href = '/error.html';
-            return;
-        }
+    document.getElementById('backupConfigFileInput').onchange = function (event) {
+        var reader = new FileReader();
+        reader.onload = function (result) {
+            if (!result.target || !result.target.result) return console.error('Unable to read backup config');
 
-        if (status.restoring) return waitForRestore();
+            var backupConfig;
+            try {
+                backupConfig = JSON.parse(result.target.result);
+            } catch (e) {
+                console.error('Unable to parse backup config');
+                return;
+            }
 
-        if (status.activated) {
-            window.location.href = '/';
-            return;
-        }
+            $scope.$apply(function () {
+                // we assume property names match here, this does not yet work for gcs keys
+                Object.keys(backupConfig).forEach(function (k) {
+                    if (k in $scope) $scope[k] = backupConfig[k];
+                });
+            });
+        };
+        reader.readAsText(event.target.files[0]);
+    };
 
-        $scope.instanceId = search.instanceId;
-        $scope.initialized = true;
-    });
+    function init() {
+        Client.getStatus(function (error, status) {
+            if (error) return Client.initError(error, init);
+
+            if (status.restore.active) return waitForRestore();
+
+            if (status.restore.errorMessage) $scope.error.generic = status.restore.errorMessage;
+
+            if (status.activated) {
+                window.location.href = '/';
+                return;
+            }
+
+            $scope.status = status;
+            $scope.instanceId = search.instanceId;
+            $scope.initialized = true;
+        });
+    }
+
+    init();
 }]);

src/js/setup.js

@@ -0,0 +1,105 @@
+'use strict';
+
+/* global angular */
+/* global $ */
+
+// create main application module
+var app = angular.module('Application', ['angular-md5', 'ui-notification', 'ui.bootstrap']);
+
+app.controller('SetupController', ['$scope', 'Client', function ($scope, Client) {
+    // Stupid angular location provider either wants html5 location mode or not, do the query parsing on my own
+    var search = decodeURIComponent(window.location.search).slice(1).split('&').map(function (item) { return item.split('='); }).reduce(function (o, k) { o[k[0]] = k[1]; return o; }, {});
+
+    $scope.client = Client;
+    $scope.view = '';
+    $scope.initialized = false;
+    $scope.apiServerOrigin = '';
+    $scope.webServerOrigin = '';
+
+    $scope.owner = {
+        error: null,
+        busy: false,
+
+        email: '',
+        displayName: '',
+        username: '',
+        password: '',
+
+        submit: function () {
+            $scope.owner.busy = true;
+            $scope.owner.error = null;
+
+            Client.createAdmin($scope.owner.username, $scope.owner.password, $scope.owner.email, $scope.owner.displayName, function (error) {
+                if (error && error.statusCode === 400) {
+                    $scope.owner.busy = false;
+                    $scope.owner.error = { username: error.message };
+                    $scope.owner.username = '';
+                    $scope.ownerForm.username.$setPristine();
+                    setTimeout(function () { $('#inputUsername').focus(); }, 200);
+                    return;
+                } else if (error) {
+                    $scope.owner.busy = false;
+                    console.error('Internal error', error);
+                    $scope.owner.error = { generic: error.message };
+                    return;
+                }
+
+                setView('finished');
+            });
+        }
+    };
+
+    function redirectIfNeeded(status) {
+        if ('develop' in search || localStorage.getItem('develop')) {
+            console.warn('Cloudron develop mode on. To disable run localStorage.removeItem(\'develop\')');
+            localStorage.setItem('develop', true);
+            return;
+        }
+
+        // if we are here from the ip first go to the real domain if already setup
+        if (status.adminFqdn && status.adminFqdn !== window.location.hostname) {
+            window.location.href = 'https://' + status.adminFqdn + '/setup.html';
+            return;
+        }
+
+        // if we don't have a domain yet, first go to domain setup
+        if (!status.adminFqdn) {
+            window.location.href = '/setupdns.html';
+            return;
+        }
+
+        if (status.activated) {
+            window.location.href = '/';
+            return;
+        }
+    }
+
+    function setView(view) {
+        if (view === 'finished') {
+            $scope.view = 'finished';
+        } else {
+            $scope.view = 'owner';
+        }
+    }
+
+    function init() {
+        Client.getStatus(function (error, status) {
+            if (error) return Client.initError(error, init);
+
+            redirectIfNeeded(status);
+            setView(search.view);
+
+            $scope.apiServerOrigin = status.apiServerOrigin;
+            $scope.webServerOrigin = status.webServerOrigin;
+
+            $scope.initialized = true;
+
+            // Ensure we have a good autofocus
+            setTimeout(function () {
+                $(document).find("[autofocus]:first").focus();
+            }, 250);
+        });
+    }
+
+    init();
+}]);

src/js/setupaccount.js

@@ -0,0 +1,101 @@
+'use strict';
+
+/* global angular, $, showdown */
+
+// create main application module
+var app = angular.module('Application', []);
+
+app.filter('markdown2html', function () {
+    var converter = new showdown.Converter({
+        extensions: [ 'targetblank' ],
+        simplifiedAutoLink: true,
+        strikethrough: true,
+        tables: true
+    });
+
+    return function (text) {
+        return converter.makeHtml(text);
+    };
+});
+
+// disable sce for footer https://code.angularjs.org/1.5.8/docs/api/ng/service/$sce
+app.config(function ($sceProvider) {
+    $sceProvider.enabled(false);
+});
+
+app.controller('SetupAccountController', ['$scope', '$http', function ($scope, $http) {
+    // Stupid angular location provider either wants html5 location mode or not, do the query parsing on my own
+    var search = decodeURIComponent(window.location.search).slice(1).split('&').map(function (item) { return item.indexOf('=') === -1 ? [item, true] : [item.slice(0, item.indexOf('=')), item.slice(item.indexOf('=')+1)]; }).reduce(function (o, k) { o[k[0]] = k[1]; return o; }, {});
+
+    var API_ORIGIN = '<%= apiOrigin %>' || window.location.origin;
+
+    $scope.initialized = false;
+    $scope.busy = false;
+    $scope.error = null;
+    $scope.view = 'setup';
+    $scope.status = null;
+
+    $scope.existingUsername = !!search.username;
+    $scope.username = search.username || '';
+    $scope.displayName = search.displayName || '';
+    $scope.password = '';
+    $scope.passwordRepeat = '';
+
+    $scope.onSubmit = function () {
+        $scope.busy = true;
+        $scope.error = null;
+
+        var data = {
+            resetToken: search.resetToken,
+            email: search.email,
+            username: $scope.username,
+            displayName: $scope.displayName,
+            password: $scope.password
+        };
+
+        function error(data, status) {
+            $scope.busy = false;
+
+            if (status === 401) {
+                $scope.view = 'invalidToken';
+            } else if (status === 409) {
+                $scope.error = {
+                    username: true,
+                    message: 'Username already taken'
+                };
+                $scope.setupAccountForm.username.$setPristine();
+                setTimeout(function () { $('#inputUsername').focus(); }, 200);
+            } else if (status === 400) {
+                $scope.error = {
+                    message: data.message
+                };
+                if (data.message.indexOf('Username') === 0) {
+                    $scope.setupAccountForm.username.$setPristine();
+                    $scope.error.username = true;
+                }
+            } else {
+                $scope.error = { message: 'Unknown error. Please try again later.' };
+                console.error(status, data);
+            }
+        }
+
+        $http.post(API_ORIGIN + '/api/v1/cloudron/setup_account', data).success(function (data, status) {
+            if (status !== 201) return error(data, status);
+
+            // set token to autologin
+            localStorage.token = data.accessToken;
+
+            $scope.view = 'done';
+        }).error(error);
+    };
+
+    $http.get(API_ORIGIN + '/api/v1/cloudron/status').success(function (data, status) {
+        $scope.initialized = true;
+
+        if (status !== 200) return;
+
+        $scope.status = data;
+    }).error(function () {
+        $scope.initialized = false;
+    });
+}]);