Add dynamic dns settings

src/views/settings.html

@@ -324,4 +324,33 @@
       </div>
   </div>
 
+  <div class="text-left">
+    <h3>Dynamic DNS</h3>
+  </div>
+
+  <div class="card" style="margin-bottom: 15px;">
+    <div class="row">
+      <div class="col-md-12">
+        <p>
+          This feature will keep all your DNS records in sync with a changing IP address.
+          It is useful when Cloudron runs in a network with a frequently changing public IP address like a home connection.
+        </p>
+        <p class="text-danger" ng-show="dyndnsConfigure.error"><br/>{{ dyndnsConfigure.error }}</p>
+        <label class="control-label">
+          <input type="checkbox" ng-model="dyndnsConfigure.enabled" name="dynamicDns" ng-disabled="dyndnsConfigure.busy"/>&nbsp; Use Dynamic DNS
+        </label>
+      </div>
+    </div>
+
+    <div class="row">
+      <div class="col-md-6">
+        <span class="text-success text-bold" ng-show="dyndnsConfigure.success">Saved</span>
+      </div>
+
+      <div class="col-md-6 text-right">
+        <button class="btn btn-outline btn-primary pull-right" ng-click="dyndnsConfigure.submit()" ng-disabled="dyndnsConfigure.currentState === dyndnsConfigure.enabled"><i class="fa fa-circle-o-notch fa-spin" ng-show="dyndnsConfigure.busy"></i>  Save</button>
+      </div>
+    </div>
+  </div>
+
 </div>

src/views/settings.js

@@ -287,6 +287,37 @@ angular.module('Application').controller('SettingsController', ['$scope', '$loca
         }
     };
 
+    $scope.dyndnsConfigure = {
+        busy: false,
+        success: false,
+        error: '',
+        currentState: false,
+        enabled: false,
+
+        refresh: function () {
+            Client.getDynamicDnsConfig(function (error, enabled) {
+                if (error) return console.error(error);
+
+                $scope.dyndnsConfigure.currentState = enabled;
+                $scope.dyndnsConfigure.enabled = enabled;
+            });
+        },
+
+        submit: function () {
+            $scope.dyndnsConfigure.busy = true;
+            $scope.dyndnsConfigure.success = false;
+            $scope.dyndnsConfigure.error = '';
+
+            Client.setDynamicDnsConfig($scope.dyndnsConfigure.enabled, function (error) {
+                if (error) $scope.dyndnsConfigure.error = error.message;
+                else $scope.dyndnsConfigure.currentState = $scope.dyndnsConfigure.enabled;
+
+                $scope.dyndnsConfigure.busy = false;
+                $scope.dyndnsConfigure.success = true;
+            });
+        }
+    };
+
     function getAutoupdatePattern() {
         Client.getAppAutoupdatePattern(function (error, result) {
             if (error) return console.error(error);
@@ -418,6 +449,8 @@ angular.module('Application').controller('SettingsController', ['$scope', '$loca
                 $scope.currency = caasConfig.currency === 'eur' ? '€' : '$';
             });
         } else if (!$scope.config.managed) {
+            $scope.dyndnsConfigure.refresh();
+
             Client.getAppstoreConfig(function (error, appstoreConfig) {
                 if (error) return console.error(error);
                 if (!appstoreConfig.token) return;