diff --git a/webadmin/src/index.html b/webadmin/src/index.html index 587f7922d..73ad0da60 100644 --- a/webadmin/src/index.html +++ b/webadmin/src/index.html @@ -180,6 +180,7 @@
  • API Access
  • Domain & Certs
  • Graphs
    • +
  • Email
  • Settings
  • Support
    • diff --git a/webadmin/src/js/index.js b/webadmin/src/js/index.js index c7ffab137..a1c044042 100644 --- a/webadmin/src/js/index.js +++ b/webadmin/src/js/index.js @@ -46,6 +46,9 @@ app.config(['$routeProvider', function ($routeProvider) { }).when('/certs', { controller: 'CertsController', templateUrl: 'views/certs.html' + }).when('/email', { + controller: 'EmailController', + templateUrl: 'views/email.html' }).when('/settings', { controller: 'SettingsController', templateUrl: 'views/settings.html' diff --git a/webadmin/src/js/main.js b/webadmin/src/js/main.js index d5e112b54..90f741259 100644 --- a/webadmin/src/js/main.js +++ b/webadmin/src/js/main.js @@ -91,7 +91,7 @@ angular.module('Application').controller('MainController', ['$scope', '$route', if (!result.dns.spf.status || !result.dns.dkim.status || !result.dns.ptr.status || !result.outboundPort25.status) { var actionScope = $scope.$new(true); - actionScope.action = '/#/settings'; + actionScope.action = '/#/email'; Client.notify('DNS Configuration', 'Please setup all required DNS records to guarantee correct mail delivery', false, 'info', actionScope); } diff --git a/webadmin/src/views/email.html b/webadmin/src/views/email.html new file mode 100644 index 000000000..7da5dbf98 --- /dev/null +++ b/webadmin/src/views/email.html @@ -0,0 +1,115 @@ + + + + +
    + +
    +
    +

    Email

    +
    +
    + +
    +
    +

    IMAP and SMTP Server

    +
    +
    + +
    +
    +
    + Cloudron has a built-in email server that allows users to send and receive email for your domain. + The User manual has information on how to setup email clients. +
    +
    +
    +
    +
    + +
    +
    + This feature requires the Cloudron to be on custom domain. +
    +
    +
    + +
    +
    +

    DNS Records

    +
    +
    + +
    +
    +
    + Set the following DNS records to guarantee email delivery: + +

    + +
    +
    +
    +

    +   + {{ record.name }} record + +

    +
    +
    +

    Domain: {{ expectedDnsRecords[record.value].domain }}

    +

    Record type: {{ expectedDnsRecords[record.value].type }}

    +

    Expected value: {{ expectedDnsRecords[record.value].expected }}

    +

    Current value: {{ expectedDnsRecords[record.value].value ? expectedDnsRecords[record.value].value : '[not set]' }}

    +
    +
    +
    +
    +
    + +
    +
    +

    +   + + Outbound SMTP (Port 25) + + +

    +
    +
    +

    {{ outboundPort25.value }}

    +
    +
    +
    +
    +
    +
    +
    + + +

    diff --git a/webadmin/src/views/email.js b/webadmin/src/views/email.js new file mode 100644 index 000000000..942386a55 --- /dev/null +++ b/webadmin/src/views/email.js @@ -0,0 +1,118 @@ +'use strict'; + +angular.module('Application').controller('EmailController', ['$scope', '$location', '$rootScope', 'Client', 'AppStore', function ($scope, $location, $rootScope, Client, AppStore) { + Client.onReady(function () { if (!Client.getUserInfo().admin) $location.path('/'); }); + + $scope.client = Client; + $scope.user = Client.getUserInfo(); + $scope.config = Client.getConfig(); + $scope.dnsConfig = {}; + $scope.outboundPort25 = {}; + $scope.expectedDnsRecords = {}; + $scope.expectedDnsRecordsTypes = [ + { name: 'MX', value: 'mx' }, + { name: 'DKIM', value: 'dkim' }, + { name: 'SPF', value: 'spf' }, + { name: 'DMARC', value: 'dmarc' }, + { name: 'PTR', value: 'ptr' } + ]; + $scope.mailConfig = null; + + $scope.showView = function (view) { + // wait for dialog to be fully closed to avoid modal behavior breakage when moving to a different view already + $('.modal').on('hidden.bs.modal', function () { + $('.modal').off('hidden.bs.modal'); + $location.path(view); + }); + + $('.modal').modal('hide'); + }; + + $scope.email = { + refreshBusy: false, + + toggle: function () { + if ($scope.mailConfig.enabled) return $scope.email.disable(); + + // show warning first + $('#enableEmailModal').modal('show'); + }, + + enable: function () { + $('#enableEmailModal').modal('hide'); + + Client.setMailConfig({ enabled: true }, function (error) { + if (error) return console.error(error); + + $scope.mailConfig.enabled = true; + }); + }, + + disable: function () { + Client.setMailConfig({ enabled: false }, function (error) { + if (error) return console.error(error); + + $scope.mailConfig.enabled = false; + }); + }, + + refresh: function () { + $scope.email.refreshBusy = true; + + showExpectedDnsRecords(function (error) { + if (error) console.error(error); + + $scope.email.refreshBusy = false; + }); + } + }; + + function getMailConfig() { + Client.getMailConfig(function (error, mailConfig) { + if (error) return console.error(error); + + $scope.mailConfig = mailConfig; + + showExpectedDnsRecords(); + }); + } + + function getDnsConfig() { + Client.getDnsConfig(function (error, dnsConfig) { + if (error) return console.error(error); + + $scope.dnsConfig = dnsConfig; + }); + } + + function showExpectedDnsRecords(callback) { + callback = callback || function (error) { if (error) console.error(error); }; + + Client.getEmailStatus(function (error, result) { + if (error) return callback(error); + + $scope.expectedDnsRecords = result.dns; + $scope.outboundPort25 = result.outboundPort25; + + // open the record details if they are not correct + for (var type in $scope.expectedDnsRecords) { + if (!$scope.expectedDnsRecords[type].status) { + $('#collapse_dns_' + type).collapse('show'); + } + } + + if (!$scope.outboundPort25.status) { + $('#collapse_dns_port').collapse('show'); + } + + callback(null); + }); + } + + Client.onReady(function () { + getMailConfig(); + getDnsConfig(); + }); + + $('.modal-backdrop').remove(); +}]); diff --git a/webadmin/src/views/settings.html b/webadmin/src/views/settings.html index d0e2fec6d..4aeebb12b 100644 --- a/webadmin/src/views/settings.html +++ b/webadmin/src/views/settings.html @@ -221,6 +221,23 @@ + + +
    @@ -303,75 +320,6 @@
    -
    -
    -

    Email

    -
    -
    - -
    -
    -
    - Cloudron has a built-in email server that allows users to send and receive email for your domain. - The User manual has information on how to setup email clients. -
    -
    -
    -
    -
    - -
    -
    - This feature requires the Cloudron to be on custom domain. -
    -
    -
    -
    -
    - Set the following DNS records to guarantee email delivery: - -

    - -
    -
    -
    -

    -   - {{ record.name }} record - -

    -
    -
    -

    Domain: {{ expectedDnsRecords[record.value].domain }}

    -

    Record type: {{ expectedDnsRecords[record.value].type }}

    -

    Expected value: {{ expectedDnsRecords[record.value].expected }}

    -

    Current value: {{ expectedDnsRecords[record.value].value ? expectedDnsRecords[record.value].value : '[not set]' }}

    -
    -
    -
    -
    -
    - -
    -
    -

    -   - - Outbound SMTP (Port 25) - - -

    -
    -
    -

    {{ outboundPort25.value }}

    -
    -
    -
    -
    -
    -
    -
    -

    Backups

    diff --git a/webadmin/src/views/settings.js b/webadmin/src/views/settings.js index 24a1a445d..4b651aaed 100644 --- a/webadmin/src/views/settings.js +++ b/webadmin/src/views/settings.js @@ -7,20 +7,8 @@ angular.module('Application').controller('SettingsController', ['$scope', '$loca $scope.user = Client.getUserInfo(); $scope.config = Client.getConfig(); $scope.backupConfig = {}; - $scope.dnsConfig = {}; - $scope.outboundPort25 = {}; - $scope.expectedDnsRecords = {}; - $scope.expectedDnsRecordsTypes = [ - { name: 'MX', value: 'mx' }, - { name: 'DKIM', value: 'dkim' }, - { name: 'SPF', value: 'spf' }, - { name: 'DMARC', value: 'dmarc' }, - { name: 'PTR', value: 'ptr' } - ]; $scope.appstoreConfig = {}; - $scope.mailConfig = null; - $scope.lastBackup = null; $scope.backups = []; @@ -303,45 +291,6 @@ angular.module('Application').controller('SettingsController', ['$scope', '$loca } }; - $scope.email = { - refreshBusy: false, - - toggle: function () { - if ($scope.mailConfig.enabled) return $scope.email.disable(); - - // show warning first - $('#enableEmailModal').modal('show'); - }, - - enable: function () { - $('#enableEmailModal').modal('hide'); - - Client.setMailConfig({ enabled: true }, function (error) { - if (error) return console.error(error); - - $scope.mailConfig.enabled = true; - }); - }, - - disable: function () { - Client.setMailConfig({ enabled: false }, function (error) { - if (error) return console.error(error); - - $scope.mailConfig.enabled = false; - }); - }, - - refresh: function () { - $scope.email.refreshBusy = true; - - showExpectedDnsRecords(function (error) { - if (error) console.error(error); - - $scope.email.refreshBusy = false; - }); - } - }; - $scope.s3like = function (provider) { return provider === 's3' || provider === 'minio'; }; @@ -526,16 +475,6 @@ angular.module('Application').controller('SettingsController', ['$scope', '$loca }); } - function getMailConfig() { - Client.getMailConfig(function (error, mailConfig) { - if (error) return console.error(error); - - $scope.mailConfig = mailConfig; - - showExpectedDnsRecords(); - }); - } - function getBackupConfig() { Client.getBackupConfig(function (error, backupConfig) { if (error) return console.error(error); @@ -552,14 +491,6 @@ angular.module('Application').controller('SettingsController', ['$scope', '$loca }); } - function getDnsConfig() { - Client.getDnsConfig(function (error, dnsConfig) { - if (error) return console.error(error); - - $scope.dnsConfig = dnsConfig; - }); - } - function getAutoupdatePattern() { Client.getAutoupdatePattern(function (error, result) { if (error) return console.error(error); @@ -569,30 +500,6 @@ angular.module('Application').controller('SettingsController', ['$scope', '$loca }); } - function showExpectedDnsRecords(callback) { - callback = callback || function (error) { if (error) console.error(error); }; - - Client.getEmailStatus(function (error, result) { - if (error) return callback(error); - - $scope.expectedDnsRecords = result.dns; - $scope.outboundPort25 = result.outboundPort25; - - // open the record details if they are not correct - for (var type in $scope.expectedDnsRecords) { - if (!$scope.expectedDnsRecords[type].status) { - $('#collapse_dns_' + type).collapse('show'); - } - } - - if (!$scope.outboundPort25.status) { - $('#collapse_dns_port').collapse('show'); - } - - callback(null); - }); - } - function getPlans() { AppStore.getSizes(function (error, result) { if (error) return console.error(error); @@ -688,9 +595,7 @@ angular.module('Application').controller('SettingsController', ['$scope', '$loca Client.onReady(function () { fetchBackups(); - getMailConfig(); getBackupConfig(); - getDnsConfig(); getAutoupdatePattern(); if ($scope.config.provider === 'caas') {