Add advanced settings to setupdns

src/js/setupdns.js

@@ -3,7 +3,7 @@
 /* global tld */
 
 // 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) {
@@ -19,12 +19,13 @@ app.controller('SetupDNSController', ['$scope', '$http', '$timeout', 'Client', f
     $scope.provider = '';
     $scope.showDNSSetup = false;
     $scope.instanceId = '';
-    $scope.explicitZone = search.zone || '';
     $scope.isDomain = false;
     $scope.isSubdomain = false;
-    $scope.tlsConfig = {
-        provider: search.env === 'dev' ? 'letsencrypt-staging' : 'letsencrypt-prod'
-    };
+    $scope.tlsProvider = [
+        { name: 'Let\'s Encrypt Prod', value: 'letsencrypt-prod' },
+        { name: 'Let\'s Encrypt Staging', value: 'letsencrypt-staging' },
+        { name: 'Self-Signed', value: 'fallback' },
+    ];
 
     // If we migrate the api origin we have to poll the new location
     if (search.admin_fqdn) Client.apiOrigin = 'https://' + search.admin_fqdn;
@@ -58,6 +59,7 @@ app.controller('SetupDNSController', ['$scope', '$http', '$timeout', 'Client', f
     $scope.dnsCredentials = {
         error: null,
         busy: false,
+        advancedVisible: false,
         domain: '',
         accessKeyId: '',
         secretAccessKey: '',
@@ -70,7 +72,11 @@ app.controller('SetupDNSController', ['$scope', '$http', '$timeout', 'Client', f
         godaddyApiSecret: '',
         nameComUsername: '',
         nameComToken: '',
-        provider: 'route53'
+        provider: 'route53',
+        zoneName: '',
+        tlsConfig: {
+            provider: 'letsencrypt-prod'
+        }
     };
 
     function readFileLocally(obj, file, fileName) {
@@ -143,7 +149,7 @@ app.controller('SetupDNSController', ['$scope', '$http', '$timeout', 'Client', f
             data.token = $scope.dnsCredentials.nameComToken;
         }
 
-        Client.setupDnsConfig($scope.dnsCredentials.domain, $scope.explicitZone, provider, data, $scope.tlsConfig, function (error) {
+        Client.setupDnsConfig($scope.dnsCredentials.domain, $scope.dnsCredentials.zoneName, provider, data, $scope.dnsCredentials.tlsConfig, function (error) {
             if (error && error.statusCode === 403) {
                 $scope.dnsCredentials.busy = false;
                 $scope.error = 'Wrong instance id provided.';

src/setupdns.html

@@ -30,6 +30,9 @@
     <!-- Angular directives for tldjs -->
     <script type="text/javascript" src="/3rdparty/js/tld.js"></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"></script>
+
     <!-- Setup Application -->
     <script type="text/javascript" src="/js/setupdns.js"></script>
 
@@ -55,7 +58,7 @@
                             <div class="col-md-10 col-md-offset-1 text-center">
                                 <h1>Cloudron Setup</h1>
                                 <h3>Provide a domain for your Cloudron</h3>
-                                <p>Apps will be installed on subdomains of this domain.</p>
+                                <p>Apps will be installed on subdomains of this domain</p>
                                 <div class="form-group" style="margin-bottom: 0;" ng-class="{ 'has-error': dnsCredentialsForm.domain.$dirty && dnsCredentialsForm.domain.$invalid }">
                                     <input type="text" class="form-control" ng-model="dnsCredentials.domain" name="domain" placeholder="example.com" required autofocus ng-disabled="dnsCredentials.busy">
                                 </div>
@@ -161,6 +164,23 @@
                                 <p>&nbsp;<span ng-show="error" class="text-danger">{{ error }}</span></p>
                             </div>
                         </div>
+
+                        <a href="" ng-click="dnsCredentials.advancedVisible = true" ng-hide="dnsCredentials.advancedVisible">Advanced settings...</a>
+                        <div class="row" uib-collapse="!dnsCredentials.advancedVisible">
+                            <div class="col-md-10 col-md-offset-1 text-center" class="form-group">>
+                                <h4>Zone Name</h4>
+                                <input type="text" class="form-control" ng-model="dnsCredentials.zoneName" name="zoneName" placeholder="example.com" ng-disabled="dnsCredentials.busy">
+                            </div>
+
+                            <div class="col-md-10 col-md-offset-1 text-center" class="form-group">
+                                <h4>Certificate Provider</h4>
+                                <select class="form-control" ng-model="dnsCredentials.tlsConfig.provider" ng-options="a.value as a.name for a in tlsProvider"></select>
+                            </div>
+                        </div>
+
+                        <br/>
+                        <br/>
+
                         <div class="row">
                             <div class="col-md-12 text-center">
                                 <button type="submit" class="btn btn-primary" ng-disabled="dnsCredentialsForm.$invalid"/><i class="fa fa-circle-o-notch fa-spin" ng-show="dnsCredentials.busy"></i> Next</button>

src/views/domains.html

@@ -124,7 +124,7 @@
               </div>
 
               <div class="form-group">
-                <label class="control-label">TLS provider</label>
+                <label class="control-label">Certificate Provider</label>
                 <select class="form-control" ng-model="domainConfigure.tlsConfig.provider" ng-options="a.value as a.name for a in tlsProvider"></select>
               </div>