change backup provider to caas

This moves the wizard flow logic to next() instead of the views individually

src/apptask.js

@@ -51,7 +51,7 @@ var addons = require('./addons.js'),
     paths = require('./paths.js'),
     safe = require('safetydance'),
     shell = require('./shell.js'),
-    SubdomainError = require('./subdomainerror.js'),
+    SubdomainError = require('./subdomains.js').SubdomainError,
     subdomains = require('./subdomains.js'),
     superagent = require('superagent'),
     sysinfo = require('./sysinfo.js'),

src/backups.js

@@ -12,9 +12,10 @@ exports = module.exports = {
 };
 
 var assert = require('assert'),
-    aws = require('./aws.js'),
+    caas = require('./storage/caas.js'),
     config = require('./config.js'),
     debug = require('debug')('box:backups'),
+    s3 = require('./storage/s3.js'),
     superagent = require('superagent'),
     util = require('util');
 
@@ -39,6 +40,12 @@ function BackupsError(reason, errorOrMessage) {
 util.inherits(BackupsError, Error);
 BackupsError.EXTERNAL_ERROR = 'external error';
 BackupsError.INTERNAL_ERROR = 'internal error';
+BackupsError.MISSING_CREDENTIALS = 'missing credentials';
+
+// choose which storage backend we use for test purpose we use s3
+function api() {
+    return config.token() ? caas : s3;
+}
 
 function getAllPaged(page, perPage, callback) {
     assert.strictEqual(typeof page, 'number');
@@ -68,7 +75,7 @@ function getBackupUrl(app, callback) {
         filename = util.format('backup_%s-v%s.tar.gz', (new Date()).toISOString(), config.version());
     }
 
-    aws.getSignedUploadUrl(filename, function (error, result) {
+    api().getSignedUploadUrl(filename, function (error, result) {
         if (error) return callback(error);
 
         var obj = {
@@ -89,7 +96,7 @@ function getRestoreUrl(backupId, callback) {
     assert.strictEqual(typeof backupId, 'string');
     assert.strictEqual(typeof callback, 'function');
 
-    aws.getSignedDownloadUrl(backupId, function (error, result) {
+    api().getSignedDownloadUrl(backupId, function (error, result) {
         if (error) return callback(error);
 
         var obj = {
@@ -111,7 +118,7 @@ function copyLastBackup(app, callback) {
     assert.strictEqual(typeof callback, 'function');
 
     var toFilename = util.format('appbackup_%s_%s-v%s.tar.gz', app.id, (new Date()).toISOString(), app.manifest.version);
-    aws.copyObject(app.lastBackupId, toFilename, function (error) {
+    api().copyObject(app.lastBackupId, toFilename, function (error) {
         if (error) return callback(new BackupsError(BackupsError.EXTERNAL_ERROR, error));
 
         return callback(null, toFilename);

src/cloudron.js

@@ -393,6 +393,7 @@ function addDnsRecords() {
     var records = [ ];
     if (config.isCustomDomain()) {
         records.push(webadminRecord);
+        records.push(dkimRecord);
     } else {
         records.push(nakedDomainRecord);
         records.push(webadminRecord);
@@ -561,19 +562,36 @@ function doUpdate(boxUpdateInfo, callback) {
 
                 // this data is opaque to the installer
                 data: {
-                    apiServerOrigin: config.apiServerOrigin(),
-                    aws: config.aws(),
-                    backupKey: config.backupKey(),
-                    boxVersionsUrl: config.get('boxVersionsUrl'),
-                    fqdn: config.fqdn(),
-                    isCustomDomain: config.isCustomDomain(),
-                    restoreUrl: null,
-                    restoreKey: null,
                     token: config.token(),
+                    apiServerOrigin: config.apiServerOrigin(),
+                    webServerOrigin: config.webServerOrigin(),
+                    fqdn: config.fqdn(),
                     tlsCert: fs.readFileSync(path.join(paths.NGINX_CERT_DIR, 'host.cert'), 'utf8'),
                     tlsKey: fs.readFileSync(path.join(paths.NGINX_CERT_DIR, 'host.key'), 'utf8'),
+                    isCustomDomain: config.isCustomDomain(),
+
                     version: boxUpdateInfo.version,
-                    webServerOrigin: config.webServerOrigin()
+                    boxVersionsUrl: config.get('boxVersionsUrl'),
+
+                    restore: {
+                        url: null,
+                        key: null
+                    },
+                    backupConfig: {
+                        provider: 'caas',
+                        token: config.token(),
+                        key: config.backupKey(),
+                        region: config.aws().region,
+                        bucket: config.aws().backupBucket,
+                        prefix: config.aws().backupPrefix
+                    },
+
+                    // legacy
+                    restoreUrl: null,
+                    restoreKey: null,
+                    aws: config.aws(),
+                    backupKey: config.backupKey()
+
                 }
             };
 

src/config.js

@@ -75,9 +75,7 @@ function initConfig() {
     data.fqdn = 'localhost';
 
     data.token = null;
-    data.mailServer = null;
     data.adminEmail = null;
-    data.mailDnsRecordIds = [ ];
     data.boxVersionsUrl = null;
     data.version = null;
     data.isCustomDomain = false;

src/dns/caas.js

@@ -13,7 +13,7 @@ exports = module.exports = {
 var assert = require('assert'),
     config = require('../config.js'),
     debug = require('debug')('box:dns/caas'),
-    SubdomainError = require('../subdomainerror.js'),
+    SubdomainError = require('../subdomains.js').SubdomainError,
     superagent = require('superagent'),
     util = require('util'),
     _ = require('underscore');

src/dns/route53.js

@@ -15,7 +15,7 @@ var assert = require('assert'),
     config = require('../config.js'),
     debug = require('debug')('box:dns/route53'),
     settings = require('../settings.js'),
-    SubdomainError = require('../subdomainerror.js'),
+    SubdomainError = require('../subdomains.js').SubdomainError,
     util = require('util'),
     _ = require('underscore');
 
@@ -100,8 +100,6 @@ function add(zoneName, subdomain, type, values, callback) {
                     return callback(new SubdomainError(SubdomainError.EXTERNAL_ERROR, error.message));
                 }
 
-                debug('addSubdomain: success. changeInfoId:%j', result);
-
                 callback(null, result.ChangeInfo.Id);
             });
         });
@@ -164,8 +162,6 @@ function del(zoneName, subdomain, type, values, callback) {
     assert(util.isArray(values));
     assert.strictEqual(typeof callback, 'function');
 
-    debug('add: %s for zone %s of type %s with values %j', subdomain, zoneName, type, values);
-
     getZoneByName(zoneName, function (error, zone) {
         if (error) return callback(error);
 

src/mailer.js

@@ -125,11 +125,14 @@ function checkDns() {
         }
 
         debug('checkDns: SPF check passed. commencing mail processing');
+        gDnsReady = true;
         processQueue();
     });
 }
 
 function processQueue() {
+    assert(gDnsReady);
+
     docker.getContainer('mail').inspect(function (error, data) {
         if (error) return console.error(error);
 

src/oauth2views/header.ejs

@@ -6,6 +6,8 @@
 
     <title> Cloudron Login </title>
 
+    <link href="/api/v1/cloudron/avatar" rel="icon" type="image/png">
+
     <!-- Custom Fonts -->
     <link href="//maxcdn.bootstrapcdn.com/font-awesome/4.3.0/css/font-awesome.min.css" rel="stylesheet" type="text/css">
     <link href="https://fonts.googleapis.com/css?family=Roboto:300" rel="stylesheet" type="text/css">

src/paths.js

@@ -28,7 +28,5 @@ exports = module.exports = {
     CLOUDRON_AVATAR_FILE: path.join(config.baseDir(), 'data/box/avatar.png'),
     CLOUDRON_DEFAULT_AVATAR_FILE: path.join(__dirname + '/../assets/avatar.png'),
 
-    FAVICON_FILE: path.join(__dirname + '/../assets/favicon.ico'),
-
     UPDATE_CHECKER_FILE: path.join(config.baseDir(), 'data/box/updatechecker.json')
 };

src/routes/settings.js

@@ -119,7 +119,7 @@ function setCertificate(req, res, next) {
     if (!req.body.key || typeof req.body.key !== 'string') return next(new HttpError(400, 'key must be a string'));
 
     settings.setCertificate(req.body.cert, req.body.key, function (error) {
-        if (error && error.reason === SettingsError.INVALID_CERT) return next(new HttpError(400, 'cert not applicable'));
+        if (error && error.reason === SettingsError.INVALID_CERT) return next(new HttpError(400, error.message));
         if (error) return next(new HttpError(500, error));
 
         next(new HttpSuccess(202, {}));
@@ -134,7 +134,7 @@ function setAdminCertificate(req, res, next) {
     if (!req.body.key || typeof req.body.key !== 'string') return next(new HttpError(400, 'key must be a string'));
 
     settings.setAdminCertificate(req.body.cert, req.body.key, function (error) {
-        if (error && error.reason === SettingsError.INVALID_CERT) return next(new HttpError(400, 'cert not applicable'));
+        if (error && error.reason === SettingsError.INVALID_CERT) return next(new HttpError(400, error.message));
         if (error) return next(new HttpError(500, error));
 
         next(new HttpSuccess(202, {}));

src/routes/test/settings-test.js

@@ -215,7 +215,7 @@ describe('Settings API', function () {
         it('set succeeds', function (done) {
             request.post(SERVER_URL + '/api/v1/settings/cloudron_avatar')
                    .query({ access_token: token })
-                   .attach('avatar', paths.FAVICON_FILE)
+                   .attach('avatar', paths.CLOUDRON_DEFAULT_AVATAR_FILE)
                    .end(function (err, res) {
                 expect(res.statusCode).to.equal(202);
                 done();
@@ -227,7 +227,7 @@ describe('Settings API', function () {
                    .query({ access_token: token })
                    .end(function (err, res) {
                 expect(res.statusCode).to.equal(200);
-                expect(res.body.toString()).to.eql(fs.readFileSync(paths.FAVICON_FILE, 'utf-8'));
+                expect(res.body.toString()).to.eql(fs.readFileSync(paths.CLOUDRON_DEFAULT_AVATAR_FILE, 'utf-8'));
                 done(err);
             });
         });

src/server.js

@@ -53,7 +53,6 @@ function initializeExpressSync() {
        .use(json)
        .use(urlencoded)
        .use(middleware.cookieParser())
-       .use(middleware.favicon(paths.FAVICON_FILE)) // used when serving oauth login page
        .use(middleware.cors({ origins: [ '*' ], allowCredentials: true }))
        .use(middleware.session({ secret: 'yellow is blue', resave: true, saveUninitialized: true, cookie: { path: '/', httpOnly: true, secure: false, maxAge: 600000 } }))
        .use(passport.initialize())

src/settings.js

@@ -290,6 +290,8 @@ function getAll(callback) {
     });
 }
 
+// note: https://tools.ietf.org/html/rfc4346#section-7.4.2 (certificate_list) requires that the
+// servers certificate appears first (and not the intermediate cert)
 function validateCertificate(cert, key, fqdn) {
     assert(cert === null || typeof cert === 'string');
     assert(key === null || typeof key === 'string');
@@ -303,7 +305,7 @@ function validateCertificate(cert, key, fqdn) {
     try {
         content = x509.parseCert(cert);
     } catch (e) {
-        return new Error('invalid cert');
+        return new Error('invalid cert: ' + e.message);
     }
 
     // check expiration
@@ -318,7 +320,7 @@ function validateCertificate(cert, key, fqdn) {
 
     // check domain
     var domains = content.altNames.concat(content.subject.commonName);
-    if (!domains.some(matchesDomain)) return new Error('cert is not valid for this domain');
+    if (!domains.some(matchesDomain)) return new Error(util.format('cert is not valid for this domain. Expecting %s in %j', fqdn, domains));
 
     // http://httpd.apache.org/docs/2.0/ssl/ssl_faq.html#verify
     var certModulus = safe.child_process.execSync('openssl x509 -noout -modulus', { encoding: 'utf8', input: cert });

src/storage/caas.js

@@ -11,54 +11,36 @@ exports = module.exports = {
 
 var assert = require('assert'),
     AWS = require('aws-sdk'),
-    config = require('./config.js'),
-    debug = require('debug')('box:aws'),
-    SubdomainError = require('./subdomainerror.js'),
+    config = require('../config.js'),
     superagent = require('superagent');
 
 function getBackupCredentials(callback) {
     assert.strictEqual(typeof callback, 'function');
+    assert(config.token());
 
-    // CaaS
-    if (config.token()) {
-        var url = config.apiServerOrigin() + '/api/v1/boxes/' + config.fqdn() + '/awscredentials';
-        superagent.post(url).query({ token: config.token() }).end(function (error, result) {
-            if (error) return callback(error);
-            if (result.statusCode !== 201) return callback(new Error(result.text));
-            if (!result.body || !result.body.credentials) return callback(new Error('Unexpected response'));
-
-            var credentials = {
-                accessKeyId: result.body.credentials.AccessKeyId,
-                secretAccessKey: result.body.credentials.SecretAccessKey,
-                sessionToken: result.body.credentials.SessionToken,
-                region: 'us-east-1'
-            };
-
-            if (config.aws().endpoint) credentials.endpoint = new AWS.Endpoint(config.aws().endpoint);
-
-            callback(null, credentials);
-        });
-    } else {
-        if (!config.aws().accessKeyId || !config.aws().secretAccessKey) return callback(new SubdomainError(SubdomainError.MISSING_CREDENTIALS));
+    var url = config.apiServerOrigin() + '/api/v1/boxes/' + config.fqdn() + '/awscredentials';
+    superagent.post(url).query({ token: config.token() }).end(function (error, result) {
+        if (error) return callback(error);
+        if (result.statusCode !== 201) return callback(new Error(result.text));
+        if (!result.body || !result.body.credentials) return callback(new Error('Unexpected response'));
 
         var credentials = {
-            accessKeyId: config.aws().accessKeyId,
-            secretAccessKey: config.aws().secretAccessKey,
+            accessKeyId: result.body.credentials.AccessKeyId,
+            secretAccessKey: result.body.credentials.SecretAccessKey,
+            sessionToken: result.body.credentials.SessionToken,
             region: 'us-east-1'
         };
 
         if (config.aws().endpoint) credentials.endpoint = new AWS.Endpoint(config.aws().endpoint);
 
         callback(null, credentials);
-    }
+    });
 }
 
 function getSignedUploadUrl(filename, callback) {
     assert.strictEqual(typeof filename, 'string');
     assert.strictEqual(typeof callback, 'function');
 
-    debug('getSignedUploadUrl: %s', filename);
-
     getBackupCredentials(function (error, credentials) {
         if (error) return callback(error);
 
@@ -80,8 +62,6 @@ function getSignedDownloadUrl(filename, callback) {
     assert.strictEqual(typeof filename, 'string');
     assert.strictEqual(typeof callback, 'function');
 
-    debug('getSignedDownloadUrl: %s', filename);
-
     getBackupCredentials(function (error, credentials) {
         if (error) return callback(error);
 

src/storage/s3.js

@@ -0,0 +1,91 @@
+/* jslint node:true */
+
+'use strict';
+
+exports = module.exports = {
+    getSignedUploadUrl: getSignedUploadUrl,
+    getSignedDownloadUrl: getSignedDownloadUrl,
+
+    copyObject: copyObject
+};
+
+var assert = require('assert'),
+    AWS = require('aws-sdk'),
+    config = require('../config.js');
+
+function getBackupCredentials(callback) {
+    assert.strictEqual(typeof callback, 'function');
+
+    if (!config.aws().accessKeyId || !config.aws().secretAccessKey) return callback(new Error('missing credentials'));
+
+    var credentials = {
+        accessKeyId: config.aws().accessKeyId,
+        secretAccessKey: config.aws().secretAccessKey,
+        region: 'us-east-1'
+    };
+
+    if (config.aws().endpoint) credentials.endpoint = new AWS.Endpoint(config.aws().endpoint);
+
+    callback(null, credentials);
+}
+
+function getSignedUploadUrl(filename, callback) {
+    assert.strictEqual(typeof filename, 'string');
+    assert.strictEqual(typeof callback, 'function');
+
+    getBackupCredentials(function (error, credentials) {
+        if (error) return callback(error);
+
+        var s3 = new AWS.S3(credentials);
+
+        var params = {
+            Bucket: config.aws().backupBucket,
+            Key: config.aws().backupPrefix + '/' + filename,
+            Expires: 60 * 30 /* 30 minutes */
+        };
+
+        var url = s3.getSignedUrl('putObject', params);
+
+        callback(null, { url : url, sessionToken: credentials.sessionToken });
+    });
+}
+
+function getSignedDownloadUrl(filename, callback) {
+    assert.strictEqual(typeof filename, 'string');
+    assert.strictEqual(typeof callback, 'function');
+
+    getBackupCredentials(function (error, credentials) {
+        if (error) return callback(error);
+
+        var s3 = new AWS.S3(credentials);
+
+        var params = {
+            Bucket: config.aws().backupBucket,
+            Key: config.aws().backupPrefix + '/' + filename,
+            Expires: 60 * 30 /* 30 minutes */
+        };
+
+        var url = s3.getSignedUrl('getObject', params);
+
+        callback(null, { url: url, sessionToken: credentials.sessionToken });
+    });
+}
+
+function copyObject(from, to, callback) {
+    assert.strictEqual(typeof from, 'string');
+    assert.strictEqual(typeof to, 'string');
+    assert.strictEqual(typeof callback, 'function');
+
+    getBackupCredentials(function (error, credentials) {
+        if (error) return callback(error);
+
+        var params = {
+            Bucket: config.aws().backupBucket, // target bucket
+            Key: config.aws().backupPrefix + '/' + to, // target file
+            CopySource: config.aws().backupBucket + '/' + config.aws().backupPrefix + '/' + from, // source
+        };
+
+        var s3 = new AWS.S3(credentials);
+        s3.copyObject(params, callback);
+    });
+}

src/subdomainerror.js

@@ -1,33 +0,0 @@
-/* jslint node:true */
-
-'use strict';
-
-var assert = require('assert'),
-    util = require('util');
-
-exports = module.exports = SubdomainError;
-
-function SubdomainError(reason, errorOrMessage) {
-    assert.strictEqual(typeof reason, 'string');
-    assert(errorOrMessage instanceof Error || typeof errorOrMessage === 'string' || typeof errorOrMessage === 'undefined');
-
-    Error.call(this);
-    Error.captureStackTrace(this, this.constructor);
-
-    this.name = this.constructor.name;
-    this.reason = reason;
-    if (typeof errorOrMessage === 'undefined') {
-        this.message = reason;
-    } else if (typeof errorOrMessage === 'string') {
-        this.message = errorOrMessage;
-    } else {
-        this.message = 'Internal error';
-        this.nestedError = errorOrMessage;
-    }
-}
-util.inherits(SubdomainError, Error);
-
-SubdomainError.NOT_FOUND = 'No such domain';
-SubdomainError.EXTERNAL_ERROR = 'External error';
-SubdomainError.STILL_BUSY = 'Still busy';
-SubdomainError.MISSING_CREDENTIALS = 'Missing credentials';

src/subdomains.js

@@ -2,21 +2,47 @@
 
 'use strict';
 
-var assert = require('assert'),
-    caas = require('./dns/caas.js'),
-    config = require('./config.js'),
-    route53 = require('./dns/route53.js'),
-    SubdomainError = require('./subdomainerror.js'),
-    util = require('util');
-
 module.exports = exports = {
     add: add,
     remove: remove,
     status: status,
     update: update, // unlike add, this fetches latest value, compares and adds if necessary. atomicity depends on backend
-    get: get
+    get: get,
+
+    SubdomainError: SubdomainError
 };
 
+var assert = require('assert'),
+    caas = require('./dns/caas.js'),
+    config = require('./config.js'),
+    route53 = require('./dns/route53.js'),
+    util = require('util');
+
+function SubdomainError(reason, errorOrMessage) {
+    assert.strictEqual(typeof reason, 'string');
+    assert(errorOrMessage instanceof Error || typeof errorOrMessage === 'string' || typeof errorOrMessage === 'undefined');
+
+    Error.call(this);
+    Error.captureStackTrace(this, this.constructor);
+
+    this.name = this.constructor.name;
+    this.reason = reason;
+    if (typeof errorOrMessage === 'undefined') {
+        this.message = reason;
+    } else if (typeof errorOrMessage === 'string') {
+        this.message = errorOrMessage;
+    } else {
+        this.message = 'Internal error';
+        this.nestedError = errorOrMessage;
+    }
+}
+util.inherits(SubdomainError, Error);
+
+SubdomainError.NOT_FOUND = 'No such domain';
+SubdomainError.EXTERNAL_ERROR = 'External error';
+SubdomainError.STILL_BUSY = 'Still busy';
+SubdomainError.MISSING_CREDENTIALS = 'Missing credentials';
+
 // choose which subdomain backend we use for test purpose we use route53
 function api() {
     return config.isCustomDomain() || config.TEST ? route53 : caas;

webadmin/src/index.html

@@ -147,6 +147,7 @@
                                 <li><a href="#/account"><i class="fa fa-user fa-fw"></i> Account</a></li>
                                 <li ng-show="user.admin"><a href="#/graphs"><i class="fa fa-bar-chart fa-fw"></i> Graphs</a></li>
                                 <li><a href="#/support"><i class="fa fa-comment fa-fw"></i> Support</a></li>
+                                <li ng-show="user.admin"><a href="#/certs"><i class="fa fa-certificate fa-fw"></i> DNS & Certs</a></li>
                                 <li ng-show="user.admin"><a href="#/settings"><i class="fa fa-wrench fa-fw"></i> Settings</a></li>
                                 <li class="divider"></li>
                                 <li><a href="" ng-click="logout($event)"><i class="fa fa-sign-out fa-fw"></i> Logout</a></li>

webadmin/src/js/index.js

@@ -31,6 +31,9 @@ app.config(['$routeProvider', function ($routeProvider) {
     }).when('/graphs', {
         controller: 'GraphsController',
         templateUrl: 'views/graphs.html'
+    }).when('/certs', {
+        controller: 'CertsController',
+        templateUrl: 'views/certs.html'
     }).when('/settings', {
         controller: 'SettingsController',
         templateUrl: 'views/settings.html'

webadmin/src/js/setup.js

@@ -150,8 +150,24 @@ app.service('Wizard', [ function () {
 app.controller('StepController', ['$scope', '$route', '$location', 'Wizard', function ($scope, $route, $location, Wizard) {
     $scope.wizard = Wizard;
 
-    $scope.next = function (page, bad) {
-        if (!bad) $location.path(page);
+    $scope.next = function (bad) {
+        if (bad) return;
+
+        var current = $location.path();
+        var next = '';
+
+        if (current === '/step1') {
+            next = '/step2';
+        } else if (current === '/step2') {
+            if (Wizard.dnsConfig.provider === 'caas') next = '/step4';
+            else next = '/step3';
+        } else if (current === '/step3') {
+            next = '/step4';
+        } else {
+            next = '/step1';
+        }
+
+        $location.path(next);
     };
 
     $scope.focusNext = function (elemId, bad) {

webadmin/src/views/certs.html

@@ -0,0 +1,125 @@
+<div style="max-width: 600px; margin: 0 auto;">
+    <div class="text-left">
+        <h1>DNS & Certs</h1>
+    </div>
+</div>
+
+<div style="max-width: 600px; margin: 0 auto;" ng-show="user.admin && config.isCustomDomain">
+    <div class="text-left">
+        <h3>DNS Credentials</h3>
+    </div>
+</div>
+
+<div class="card" style="margin-bottom: 15px;" ng-show="user.admin && config.isCustomDomain">
+    <div class="row">
+        <div class="col-md-12">
+            <p>Currently only Amazon <a href="https://aws.amazon.com/route53/">Route53</a> is supported. Let us know if you require a different DNS provider <a href="#/support">here</a>.</p>
+
+            <table width="100%">
+                <tr>
+                    <td class="text-muted" style="vertical-align: top;">Access Key Id</td>
+                    <td class="text-right" style="vertical-align: top; white-space: nowrap;">{{ dnsConfig.accessKeyId }}</td>
+                </tr>
+                <tr>
+                    <td class="text-muted" style="vertical-align: top;">Secret Access Key</td>
+                    <td class="text-right" style="vertical-align: top; white-space: nowrap;"><i>hidden</i></td>
+                </tr>
+                <tr>
+                    <td class="text-muted" style="vertical-align: top;"></td>
+                    <td class="text-right" style="vertical-align: top;"><span class="text-success" ng-show="dnsCredentials.success"><b>Done</b></span> &nbsp; &nbsp; <button class="btn btn-outline btn-xs btn-primary" ng-show="!dnsCredentials.formVisible" ng-click="showDnsCredentialsForm()">Change</button></td>
+                </tr>
+            </table>
+
+            <div class="collapse" id="collapseDnsCredentialsForm" data-toggle="false">
+                <p>The security credentials have to be valid for full Route53 access.</p>
+                <form name="dnsCredentialsForm" ng-submit="setDnsCredentials()">
+                    <fieldset>
+                        <div class="has-error text-center" ng-show="dnsCredentials.error">{{ dnsCredentials.error }}</div>
+
+                        <div class="form-group" ng-class="{ 'has-error': false }">
+                            <label class="control-label" for="dnsCredentialsAccessKeyId">Access Key Id</label>
+                            <input type="text" class="form-control" ng-model="dnsCredentials.accessKeyId" id="dnsCredentialsAccessKeyId" name="accessKeyId" ng-disabled="dnsCredentials.busy" ng-minlength="16" ng-maxlength="32" required>
+                        </div>
+                        <div class="form-group" ng-class="{ 'has-error': false }">
+                            <label class="control-label" for="dnsCredentialsSecretAccessKey">Secret Access Key</label>
+                            <input type="text" class="form-control" ng-model="dnsCredentials.secretAccessKey" id="dnsCredentialsSecretAccessKey" name="secretAccessKey" ng-disabled="dnsCredentials.busy" required>
+                        </div>
+
+                        <button type="submit" class="btn btn-outline btn-success pull-right" ng-disabled="dnsCredentialsForm.$invalid || busy"><i class="fa fa-spinner fa-pulse" ng-show="dnsCredentials.busy"></i> Save</button>
+                    </fieldset>
+                </form>
+            </div>
+        </div>
+    </div>
+ </div>
+
+<div style="max-width: 600px; margin: 0 auto;" ng-show="user.admin && config.isCustomDomain">
+    <div class="text-left">
+        <h3>SSL Certificates</h3>
+    </div>
+</div>
+
+<div class="card" style="margin-bottom: 15px;" ng-show="user.admin && config.isCustomDomain">
+    <div class="row">
+        <div class="col-md-12">
+            <form name="defaultCertForm" ng-submit="setDefaultCert()">
+                <fieldset>
+                    <label class="control-label" for="defaultCertInput">Fallback Certificate</label>
+                    <p>This certificate has to be wildcard certificates and will be used for all apps, which were not configured to use a specific certificate.</p>
+                    <div class="has-error text-center" ng-show="defaultCert.error">{{ defaultCert.error }}</div>
+                    <div class="text-success text-center" ng-show="defaultCert.success"><b>Upload successful</b></div>
+                    <div class="form-group" ng-class="{ 'has-error': (!defaultCert.cert.$dirty && defaultCert.error) }">
+                        <div class="input-group">
+                            <input type="file" id="defaultCertFileInput" style="display:none"/>
+                            <input type="text" class="form-control" placeholder="Certificate" ng-model="defaultCert.certificateFileName" id="defaultCertInput" name="cert" onclick="getElementById('defaultCertFileInput').click();" style="cursor: pointer;" ng-disabled="defaultCert.busy" required>
+                            <span class="input-group-addon">
+                                <i class="fa fa-upload" onclick="getElementById('defaultCertFileInput').click();"></i>
+                            </span>
+                        </div>
+                    </div>
+                    <div class="form-group" ng-class="{ 'has-error': (!defaultCert.key.$dirty && defaultCert.error) }">
+                        <div class="input-group">
+                            <input type="file" id="defaultKeyFileInput" style="display:none"/>
+                            <input type="text" class="form-control" placeholder="Key" ng-model="defaultCert.keyFileName" id="defaultKeyInput" name="key" onclick="getElementById('defaultKeyFileInput').click();" style="cursor: pointer;" ng-disabled="defaultCert.busy" required>
+                            <span class="input-group-addon">
+                                <i class="fa fa-upload" onclick="getElementById('defaultKeyFileInput').click();"></i>
+                            </span>
+                        </div>
+                    </div>
+                    <button type="submit" class="btn btn-outline btn-success pull-right" ng-disabled="defaultCertForm.$invalid || busy"><i class="fa fa-spinner fa-pulse" ng-show="defaultCert.busy"></i> Upload</button>
+                </fieldset>
+            </form>
+        </div>
+    </div>
+    <div class="row">
+        <div class="col-md-12">
+            <form name="adminCertForm" ng-submit="setAdminCert()">
+                <fieldset>
+                    <label class="control-label" for="adminCertInput">Settings Certificate</label>
+                    <p>This certificate will be used for this Settings application.</p>
+                    <div class="has-error text-center" ng-show="adminCert.error">{{ adminCert.error }}</div>
+                    <div class="text-success text-center" ng-show="adminCert.success"><b>Upload successful</b></div>
+                    <div class="form-group" ng-class="{ 'has-error': (!adminCert.cert.$dirty && adminCert.error) }">
+                        <div class="input-group">
+                            <input type="file" id="adminCertFileInput" style="display:none"/>
+                            <input type="text" class="form-control" placeholder="Certificate" ng-model="adminCert.certificateFileName" id="adminCertInput" name="cert" onclick="getElementById('adminCertFileInput').click();" style="cursor: pointer;" ng-disabled="adminCert.busy" required>
+                            <span class="input-group-addon">
+                                <i class="fa fa-upload" onclick="getElementById('adminCertFileInput').click();"></i>
+                            </span>
+                        </div>
+                    </div>
+                    <div class="form-group" ng-class="{ 'has-error': (!adminCert.key.$dirty && adminCert.error) }">
+                        <div class="input-group">
+                            <input type="file" id="adminKeyFileInput" style="display:none"/>
+                            <input type="text" class="form-control" placeholder="Key" ng-model="adminCert.keyFileName" id="adminKeyInput" name="key" onclick="getElementById('adminKeyFileInput').click();" style="cursor: pointer;" ng-disabled="adminCert.busy" required>
+                            <span class="input-group-addon">
+                                <i class="fa fa-upload" onclick="getElementById('adminKeyFileInput').click();"></i>
+                            </span>
+                        </div>
+                    </div>
+                    <button type="submit" class="btn btn-outline btn-success pull-right" ng-disabled="adminCertForm.$invalid || busy"><i class="fa fa-spinner fa-pulse" ng-show="adminCert.busy"></i> Upload</button>
+                </fieldset>
+            </form>
+        </div>
+    </div>
+</div>

webadmin/src/views/certs.js

@@ -0,0 +1,151 @@
+'use strict';
+
+angular.module('Application').controller('CertsController', ['$scope', '$location', 'Client', function ($scope, $location, Client) {
+    Client.onReady(function () { if (!Client.getUserInfo().admin) $location.path('/'); });
+
+    $scope.defaultCert = {
+        error: null,
+        success: false,
+        busy: false,
+        certificateFile: null,
+        certificateFileName: '',
+        keyFile: null,
+        keyFileName: ''
+    };
+
+    $scope.adminCert = {
+        error: null,
+        success: false,
+        busy: false,
+        certificateFile: null,
+        certificateFileName: '',
+        keyFile: null,
+        keyFileName: ''
+    };
+
+    $scope.dnsCredentials = {
+        error: null,
+        success: false,
+        busy: false,
+        formVisible: false,
+        accessKeyId: '',
+        secretAccessKey: '',
+        provider: 'route53'
+    };
+
+    function readFileLocally(obj, file, fileName) {
+        return function (event) {
+            $scope.$apply(function () {
+                obj[file] = null;
+                obj[fileName] = event.target.files[0].name;
+
+                var reader = new FileReader();
+                reader.onload = function (result) {
+                    if (!result.target || !result.target.result) return console.error('Unable to read local file');
+                    obj[file] = result.target.result;
+                };
+                reader.readAsText(event.target.files[0]);
+            });
+        };
+    }
+
+    document.getElementById('defaultCertFileInput').onchange = readFileLocally($scope.defaultCert, 'certificateFile', 'certificateFileName');
+    document.getElementById('defaultKeyFileInput').onchange = readFileLocally($scope.defaultCert, 'keyFile', 'keyFileName');
+    document.getElementById('adminCertFileInput').onchange = readFileLocally($scope.adminCert, 'certificateFile', 'certificateFileName');
+    document.getElementById('adminKeyFileInput').onchange = readFileLocally($scope.adminCert, 'keyFile', 'keyFileName');
+
+    $scope.setDefaultCert = function () {
+        $scope.defaultCert.busy = true;
+        $scope.defaultCert.error = null;
+        $scope.defaultCert.success = false;
+
+        Client.setCertificate($scope.defaultCert.certificateFile, $scope.defaultCert.keyFile, function (error) {
+            if (error) {
+                $scope.defaultCert.error = error.message;
+            } else {
+                $scope.defaultCert.success = true;
+                $scope.defaultCert.certificateFileName = '';
+                $scope.defaultCert.keyFileName = '';
+            }
+
+            $scope.defaultCert.busy = false;
+        });
+    };
+
+    $scope.setAdminCert = function () {
+        $scope.adminCert.busy = true;
+        $scope.adminCert.error = null;
+        $scope.adminCert.success = false;
+
+        Client.setAdminCertificate($scope.adminCert.certificateFile, $scope.adminCert.keyFile, function (error) {
+            if (error) {
+                $scope.adminCert.error = error.message;
+            } else {
+                $scope.adminCert.success = true;
+                $scope.adminCert.certificateFileName = '';
+                $scope.adminCert.keyFileName = '';
+            }
+
+            $scope.adminCert.busy = false;
+
+            // attempt to reload to make the browser get the new certs
+            window.location.reload(true);
+        });
+    };
+
+    $scope.setDnsCredentials = function () {
+        $scope.dnsCredentials.busy = true;
+        $scope.dnsCredentials.error = null;
+        $scope.dnsCredentials.success = false;
+
+        var data = {
+            provider: $scope.dnsCredentials.provider,
+            accessKeyId: $scope.dnsCredentials.accessKeyId,
+            secretAccessKey: $scope.dnsCredentials.secretAccessKey
+        };
+
+        Client.setDnsConfig(data, function (error) {
+            if (error) {
+                $scope.dnsCredentials.error = error.message;
+            } else {
+                $scope.dnsCredentials.success = true;
+
+                $scope.dnsConfig.accessKeyId = $scope.dnsCredentials.accessKeyId;
+                $scope.dnsConfig.secretAccessKey = $scope.dnsCredentials.secretAccessKey;
+
+                $scope.dnsCredentials.accessKeyId = '';
+                $scope.dnsCredentials.secretAccessKey = '';
+
+                $('#collapseDnsCredentialsForm').collapse('hide');
+                $scope.dnsCredentials.formVisible = false;
+
+                // attempt to reload to make the browser get the new certs
+                window.location.reload(true);
+            }
+
+            $scope.dnsCredentials.busy = false;
+        });
+    };
+
+    $scope.showDnsCredentialsForm = function () {
+        $scope.dnsCredentials.busy = false;
+        $scope.dnsCredentials.success = false;
+        $scope.dnsCredentials.error = null;
+        $scope.dnsCredentials.accessKeyId = '';
+        $scope.dnsCredentials.secretAccessKey = '';
+        $scope.dnsCredentialsForm.$setPristine();
+        $scope.dnsCredentialsForm.$setUntouched();
+
+        $scope.dnsCredentials.formVisible = true;
+        $('#collapseDnsCredentialsForm').collapse('show');
+        $('#dnsCredentialsAccessKeyId').focus();
+    };
+
+    Client.onReady(function () {
+        Client.getDnsConfig(function (error, result) {
+            if (error) return console.error(error);
+
+            $scope.dnsConfig = result;
+        });
+    });
+}]);

webadmin/src/views/settings.html

@@ -85,6 +85,34 @@
     </div>
 </div>
 
+<div style="max-width: 600px; margin: 0 auto;" ng-show="user.admin">
+    <div class="text-left">
+        <h3>About</h3>
+    </div>
+</div>
+
+<div class="card" style="margin-bottom: 15px;" ng-show="user.admin">
+    <div class="row">
+        <div class="col-xs-4" style="min-width: 150px;">
+            <div class="settings-avatar" ng-click="showChangeAvatar()" style="background-image: url('{{avatar.data || avatar.url}}');">
+                <div class="overlay"></div>
+            </div>
+        </div>
+        <div class="col-xs-8">
+            <table width="100%">
+                <tr>
+                    <td class="text-muted" style="vertical-align: top;">Model</td>
+                    <td class="text-right" style="vertical-align: top; white-space: nowrap;">{{ config.size }} - {{ config.region }}</td>
+                </tr>
+                <tr>
+                    <td class="text-muted" style="vertical-align: top;">Version</td>
+                    <td class="text-right" style="vertical-align: top; white-space: nowrap;">{{ config.version }}</td>
+                </tr>
+            </table>
+        </div>
+    </div>
+</div>
+
 <div style="max-width: 600px; margin: 0 auto;" ng-show="user.admin">
     <div class="text-left">
         <h3>Backups</h3>
@@ -115,154 +143,6 @@
     </div>
 </div>
 
-<div style="max-width: 600px; margin: 0 auto;" ng-show="user.admin">
-    <div class="text-left">
-        <h3>About</h3>
-    </div>
-</div>
-
-<div class="card" style="margin-bottom: 15px;" ng-show="user.admin">
-    <div class="row">
-        <div class="col-xs-4" style="min-width: 150px;">
-            <div class="settings-avatar" ng-click="showChangeAvatar()" style="background-image: url('{{avatar.data || avatar.url}}');">
-                <div class="overlay"></div>
-            </div>
-        </div>
-        <div class="col-xs-8">
-            <table width="100%">
-                <tr>
-                    <td class="text-muted" style="vertical-align: top;">Model</td>
-                    <td class="text-right" style="vertical-align: top; white-space: nowrap;">{{ config.size }} - {{ config.region }}</td>
-                </tr>
-                <tr>
-                    <td class="text-muted" style="vertical-align: top;">Version</td>
-                    <td class="text-right" style="vertical-align: top; white-space: nowrap;">{{ config.version }}</td>
-                </tr>
-            </table>
-        </div>
-    </div>
-</div>
-
-<div style="max-width: 600px; margin: 0 auto;" ng-show="user.admin && config.isCustomDomain">
-    <div class="text-left">
-        <h3>SSL Certificates</h3>
-    </div>
-</div>
-
-<div class="card" style="margin-bottom: 15px;" ng-show="user.admin && config.isCustomDomain">
-    <div class="row">
-        <div class="col-md-12">
-            <form name="defaultCertForm" ng-submit="setDefaultCert()">
-                <fieldset>
-                    <label class="control-label" for="defaultCertInput">Fallback Certificate</label>
-                    <p>This certificate has to be wildcard certificates and will be used for all apps, which were not configured to use a specific certificate.</p>
-                    <div class="has-error text-center" ng-show="defaultCert.error">{{ defaultCert.error }}</div>
-                    <div class="text-success text-center" ng-show="defaultCert.success"><b>Upload successful</b></div>
-                    <div class="form-group" ng-class="{ 'has-error': (!defaultCert.cert.$dirty && defaultCert.error) }">
-                        <div class="input-group">
-                            <input type="file" id="defaultCertFileInput" style="display:none"/>
-                            <input type="text" class="form-control" placeholder="Certificate" ng-model="defaultCert.certificateFileName" id="defaultCertInput" name="cert" onclick="getElementById('defaultCertFileInput').click();" style="cursor: pointer;" ng-disabled="defaultCert.busy" required>
-                            <span class="input-group-addon">
-                                <i class="fa fa-upload" onclick="getElementById('defaultCertFileInput').click();"></i>
-                            </span>
-                        </div>
-                    </div>
-                    <div class="form-group" ng-class="{ 'has-error': (!defaultCert.key.$dirty && defaultCert.error) }">
-                        <div class="input-group">
-                            <input type="file" id="defaultKeyFileInput" style="display:none"/>
-                            <input type="text" class="form-control" placeholder="Key" ng-model="defaultCert.keyFileName" id="defaultKeyInput" name="key" onclick="getElementById('defaultKeyFileInput').click();" style="cursor: pointer;" ng-disabled="defaultCert.busy" required>
-                            <span class="input-group-addon">
-                                <i class="fa fa-upload" onclick="getElementById('defaultKeyFileInput').click();"></i>
-                            </span>
-                        </div>
-                    </div>
-                    <button type="submit" class="btn btn-outline btn-success pull-right" ng-disabled="defaultCertForm.$invalid || busy"><i class="fa fa-spinner fa-pulse" ng-show="defaultCert.busy"></i> Upload</button>
-                </fieldset>
-            </form>
-        </div>
-    </div>
-    <div class="row">
-        <div class="col-md-12">
-            <form name="adminCertForm" ng-submit="setAdminCert()">
-                <fieldset>
-                    <label class="control-label" for="adminCertInput">Settings Certificate</label>
-                    <p>This certificate will be used for this Settings application.</p>
-                    <div class="has-error text-center" ng-show="adminCert.error">{{ adminCert.error }}</div>
-                    <div class="text-success text-center" ng-show="adminCert.success"><b>Upload successful</b></div>
-                    <div class="form-group" ng-class="{ 'has-error': (!adminCert.cert.$dirty && adminCert.error) }">
-                        <div class="input-group">
-                            <input type="file" id="adminCertFileInput" style="display:none"/>
-                            <input type="text" class="form-control" placeholder="Certificate" ng-model="adminCert.certificateFileName" id="adminCertInput" name="cert" onclick="getElementById('adminCertFileInput').click();" style="cursor: pointer;" ng-disabled="adminCert.busy" required>
-                            <span class="input-group-addon">
-                                <i class="fa fa-upload" onclick="getElementById('adminCertFileInput').click();"></i>
-                            </span>
-                        </div>
-                    </div>
-                    <div class="form-group" ng-class="{ 'has-error': (!adminCert.key.$dirty && adminCert.error) }">
-                        <div class="input-group">
-                            <input type="file" id="adminKeyFileInput" style="display:none"/>
-                            <input type="text" class="form-control" placeholder="Key" ng-model="adminCert.keyFileName" id="adminKeyInput" name="key" onclick="getElementById('adminKeyFileInput').click();" style="cursor: pointer;" ng-disabled="adminCert.busy" required>
-                            <span class="input-group-addon">
-                                <i class="fa fa-upload" onclick="getElementById('adminKeyFileInput').click();"></i>
-                            </span>
-                        </div>
-                    </div>
-                    <button type="submit" class="btn btn-outline btn-success pull-right" ng-disabled="adminCertForm.$invalid || busy"><i class="fa fa-spinner fa-pulse" ng-show="adminCert.busy"></i> Upload</button>
-                </fieldset>
-            </form>
-        </div>
-    </div>
-</div>
-
-<div style="max-width: 600px; margin: 0 auto;" ng-show="user.admin && config.isCustomDomain">
-    <div class="text-left">
-        <h3>DNS Credentials</h3>
-    </div>
-</div>
-
-<div class="card" style="margin-bottom: 15px;" ng-show="user.admin && config.isCustomDomain">
-    <div class="row">
-        <div class="col-md-12">
-            <p>Currently only Amazon <a href="https://aws.amazon.com/route53/">Route53</a> is supported. Let us know if you require a different DNS provider <a href="#/support">here</a>.</p>
-
-            <table width="100%">
-                <tr>
-                    <td class="text-muted" style="vertical-align: top;">Access Key Id</td>
-                    <td class="text-right" style="vertical-align: top; white-space: nowrap;">{{ dnsConfig.accessKeyId }}</td>
-                </tr>
-                <tr>
-                    <td class="text-muted" style="vertical-align: top;">Secret Access Key</td>
-                    <td class="text-right" style="vertical-align: top; white-space: nowrap;"><i>hidden</i></td>
-                </tr>
-                <tr>
-                    <td class="text-muted" style="vertical-align: top;"></td>
-                    <td class="text-right" style="vertical-align: top;"><span class="text-success" ng-show="dnsCredentials.success"><b>Done</b></span> &nbsp; &nbsp; <button class="btn btn-outline btn-xs btn-primary" ng-show="!dnsCredentials.formVisible" ng-click="showDnsCredentialsForm()">Change</button></td>
-                </tr>
-            </table>
-
-            <div class="collapse" id="collapseDnsCredentialsForm" data-toggle="false">
-                <p>The security credentials have to be valid for full Route53 access.</p>
-                <form name="dnsCredentialsForm" ng-submit="setDnsCredentials()">
-                    <fieldset>
-                        <div class="has-error text-center" ng-show="dnsCredentials.error">{{ dnsCredentials.error }}</div>
-
-                        <div class="form-group" ng-class="{ 'has-error': false }">
-                            <label class="control-label" for="dnsCredentialsAccessKeyId">Access Key Id</label>
-                            <input type="text" class="form-control" ng-model="dnsCredentials.accessKeyId" id="dnsCredentialsAccessKeyId" name="accessKeyId" ng-disabled="dnsCredentials.busy" ng-minlength="16" ng-maxlength="32" required>
-                        </div>
-                        <div class="form-group" ng-class="{ 'has-error': false }">
-                            <label class="control-label" for="dnsCredentialsSecretAccessKey">Secret Access Key</label>
-                            <input type="text" class="form-control" ng-model="dnsCredentials.secretAccessKey" id="dnsCredentialsSecretAccessKey" name="secretAccessKey" ng-disabled="dnsCredentials.busy" required>
-                        </div>
-
-                        <button type="submit" class="btn btn-outline btn-success pull-right" ng-disabled="dnsCredentialsForm.$invalid || busy"><i class="fa fa-spinner fa-pulse" ng-show="dnsCredentials.busy"></i> Save</button>
-                    </fieldset>
-                </form>
-            </div>
-        </div>
-    </div>
- </div>
-
 <div style="max-width: 600px; margin: 0 auto;" ng-show="user.admin">
     <div class="text-left">
         <h3>Developer Mode</h3>

webadmin/src/views/settings.js

@@ -84,124 +84,6 @@ angular.module('Application').controller('SettingsController', ['$scope', '$loca
         }]
     };
 
-    $scope.defaultCert = {
-        error: null,
-        success: false,
-        busy: false,
-        certificateFile: null,
-        certificateFileName: '',
-        keyFile: null,
-        keyFileName: ''
-    };
-
-    $scope.adminCert = {
-        error: null,
-        success: false,
-        busy: false,
-        certificateFile: null,
-        certificateFileName: '',
-        keyFile: null,
-        keyFileName: ''
-    };
-
-    $scope.dnsCredentials = {
-        error: null,
-        success: false,
-        busy: false,
-        formVisible: false,
-        accessKeyId: '',
-        secretAccessKey: '',
-        provider: 'route53'
-    };
-
-    function readFileLocally(obj, file, fileName) {
-        return function (event) {
-            $scope.$apply(function () {
-                obj[file] = null;
-                obj[fileName] = event.target.files[0].name;
-
-                var reader = new FileReader();
-                reader.onload = function (result) {
-                    if (!result.target || !result.target.result) return console.error('Unable to read local file');
-                    obj[file] = result.target.result;
-                };
-                reader.readAsText(event.target.files[0]);
-            });
-        };
-    }
-
-    document.getElementById('defaultCertFileInput').onchange = readFileLocally($scope.defaultCert, 'certificateFile', 'certificateFileName');
-    document.getElementById('defaultKeyFileInput').onchange = readFileLocally($scope.defaultCert, 'keyFile', 'keyFileName');
-    document.getElementById('adminCertFileInput').onchange = readFileLocally($scope.adminCert, 'certificateFile', 'certificateFileName');
-    document.getElementById('adminKeyFileInput').onchange = readFileLocally($scope.adminCert, 'keyFile', 'keyFileName');
-
-    $scope.setDefaultCert = function () {
-        $scope.defaultCert.busy = true;
-        $scope.defaultCert.error = null;
-        $scope.defaultCert.success = false;
-
-        Client.setCertificate($scope.defaultCert.certificateFile, $scope.defaultCert.keyFile, function (error) {
-            if (error) {
-                $scope.defaultCert.error = error.message;
-            } else {
-                $scope.defaultCert.success = true;
-                $scope.defaultCert.certificateFileName = '';
-                $scope.defaultCert.keyFileName = '';
-            }
-
-            $scope.defaultCert.busy = false;
-        });
-    };
-
-    $scope.setAdminCert = function () {
-        $scope.adminCert.busy = true;
-        $scope.adminCert.error = null;
-        $scope.adminCert.success = false;
-
-        Client.setAdminCertificate($scope.adminCert.certificateFile, $scope.adminCert.keyFile, function (error) {
-            if (error) {
-                $scope.adminCert.error = error.message;
-            } else {
-                $scope.adminCert.success = true;
-                $scope.adminCert.certificateFileName = '';
-                $scope.adminCert.keyFileName = '';
-            }
-
-            $scope.adminCert.busy = false;
-        });
-    };
-
-    $scope.setDnsCredentials = function () {
-        $scope.dnsCredentials.busy = true;
-        $scope.dnsCredentials.error = null;
-        $scope.dnsCredentials.success = false;
-
-        var data = {
-            provider: $scope.dnsCredentials.provider,
-            accessKeyId: $scope.dnsCredentials.accessKeyId,
-            secretAccessKey: $scope.dnsCredentials.secretAccessKey
-        };
-
-        Client.setDnsConfig(data, function (error) {
-            if (error) {
-                $scope.dnsCredentials.error = error.message;
-            } else {
-                $scope.dnsCredentials.success = true;
-
-                $scope.dnsConfig.accessKeyId = $scope.dnsCredentials.accessKeyId;
-                $scope.dnsConfig.secretAccessKey = $scope.dnsCredentials.secretAccessKey;
-
-                $scope.dnsCredentials.accessKeyId = '';
-                $scope.dnsCredentials.secretAccessKey = '';
-
-                $('#collapseDnsCredentialsForm').collapse('hide');
-                $scope.dnsCredentials.formVisible = false;
-            }
-
-            $scope.dnsCredentials.busy = false;
-        });
-    };
-
     $scope.setPreviewAvatar = function (avatar) {
         $scope.avatarChange.avatar = avatar;
     };
@@ -347,20 +229,6 @@ angular.module('Application').controller('SettingsController', ['$scope', '$loca
         });
     };
 
-    $scope.showDnsCredentialsForm = function () {
-        $scope.dnsCredentials.busy = false;
-        $scope.dnsCredentials.success = false;
-        $scope.dnsCredentials.error = null;
-        $scope.dnsCredentials.accessKeyId = '';
-        $scope.dnsCredentials.secretAccessKey = '';
-        $scope.dnsCredentialsForm.$setPristine();
-        $scope.dnsCredentialsForm.$setUntouched();
-
-        $scope.dnsCredentials.formVisible = true;
-        $('#collapseDnsCredentialsForm').collapse('show');
-        $('#dnsCredentialsAccessKeyId').focus();
-    };
-
     $scope.showChangeDeveloperMode = function () {
         developerModeChangeReset();
         $('#developerModeChangeModal').modal('show');
@@ -395,13 +263,7 @@ angular.module('Application').controller('SettingsController', ['$scope', '$loca
     Client.onReady(function () {
         fetchBackups();
 
-        $scope.avatar.url = '//my-' + $scope.config.fqdn + '/api/v1/cloudron/avatar';
-
-        Client.getDnsConfig(function (error, result) {
-            if (error) return console.error(error);
-
-            $scope.dnsConfig = result;
-        });
+        $scope.avatar.url = ($scope.config.isCustomDomain ? '//my.' : '//my-') + $scope.config.fqdn + '/api/v1/cloudron/avatar';
     });
 
     // setup all the dialog focus handling

webadmin/src/views/setup/step1.html

@@ -38,6 +38,6 @@
 
 <div class="row">
     <div class="col-md-12 text-center">
-        <a class="btn btn-primary" href="#/step2">Next</a>
+        <button class="btn btn-primary" ng-click="next()">Next</button>
     </div>
 </div>

webadmin/src/views/setup/step2.html

@@ -16,12 +16,12 @@
         </div>
         <div class="form-group" ng-class="{ 'has-error': setup_form.password.$dirty && setup_form.password.$invalid }">
             <!-- <label class="control-label" for="inputPassword">Password</label> -->
-            <input type="password" class="form-control" ng-model="wizard.password" id="inputPassword" name="password" placeholder="Password" ng-enter="next('/step3', setup_form.password.$invalid)" ng-maxlength="512" ng-minlength="5" required autocomplete="off">
+            <input type="password" class="form-control" ng-model="wizard.password" id="inputPassword" name="password" placeholder="Password" ng-enter="next(setup_form.password.$invalid)" ng-maxlength="512" ng-minlength="5" required autocomplete="off">
         </div>
     </div>
 </div>
 <div class="row">
     <div class="col-md-12 text-center">
-        <button class="btn btn-primary" ng-click="next('/step3', setup_form.username.$invalid || setup_form.password.$invalid)" ng-disabled="setup_form.username.$invalid || setup_form.password.$invalid">Done</button>
+        <button class="btn btn-primary" ng-click="next(setup_form.username.$invalid || setup_form.password.$invalid)" ng-disabled="setup_form.username.$invalid || setup_form.password.$invalid">Done</button>
     </div>
 </div>

webadmin/src/views/setup/step3.html

@@ -16,12 +16,12 @@
         </div>
         <div class="form-group" ng-class="{ 'has-error': setup_form.secretAccessKey.$dirty && setup_form.secretAccessKey.$invalid }">
             <!-- <label class="control-label" for="inputPassword">Password</label> -->
-            <input type="text" class="form-control" ng-model="wizard.dnsConfig.secretAccessKey" id="inputSecretAccessKey" name="secretAccessKey" placeholder="Secret Access Key" ng-enter="next('/step4', setup_form.secretAccessKey.$invalid)" ng-maxlength="512" ng-minlength="3" required autocomplete="off">
+            <input type="text" class="form-control" ng-model="wizard.dnsConfig.secretAccessKey" id="inputSecretAccessKey" name="secretAccessKey" placeholder="Secret Access Key" ng-enter="next(setup_form.secretAccessKey.$invalid)" ng-maxlength="512" ng-minlength="3" required autocomplete="off">
         </div>
     </div>
 </div>
 <div class="row">
     <div class="col-md-12 text-center">
-        <button class="btn btn-primary"  ng-click="next('/step4', setup_form.accessKeyId.$invalid || setup_form.secretAccessKey.$invalid)" ng-disabled="setup_form.accessKeyId.$invalid || setup_form.secretAccessKey.$invalid">Done</button>
+        <button class="btn btn-primary"  ng-click="next(setup_form.accessKeyId.$invalid || setup_form.secretAccessKey.$invalid)" ng-disabled="setup_form.accessKeyId.$invalid || setup_form.secretAccessKey.$invalid">Done</button>
     </div>
 </div>