From 45045a2ac16ba6ffb1625a6dda58d995d5e5eea2 Mon Sep 17 00:00:00 2001 From: =?UTF-8?q?David=20Sevilla=20Mart=C3=ADn?= Date: Sat, 16 Apr 2016 12:04:54 -0400 Subject: [PATCH] Added "Advanced" page on admin & SMTP settings Refs #258 --- js/admin/dist/app.js | 150 +++++++++++++++++++++++- js/admin/src/components/AdminNav.js | 7 ++ js/admin/src/components/AdvancedPage.js | 98 ++++++++++++++++ js/admin/src/initializers/routes.js | 4 +- less/admin/AdvancedPage.less | 31 +++++ less/admin/app.less | 1 + 6 files changed, 287 insertions(+), 4 deletions(-) create mode 100644 js/admin/src/components/AdvancedPage.js create mode 100644 less/admin/AdvancedPage.less diff --git a/js/admin/dist/app.js b/js/admin/dist/app.js index 37e2f47a6..7eeb68510 100644 --- a/js/admin/dist/app.js +++ b/js/admin/dist/app.js @@ -17293,6 +17293,13 @@ System.register('flarum/components/AdminNav', ['flarum/Component', 'flarum/compo description: app.translator.trans('core.admin.nav.extensions_text') })); + items.add('advanced', AdminLinkButton.component({ + href: app.route('advanced'), + icon: 'cog', + children: app.translator.trans('core.admin.nav.advanced_button'), + description: app.translator.trans('core.admin.nav.advanced_text') + })); + return items; } }]); @@ -17305,6 +17312,140 @@ System.register('flarum/components/AdminNav', ['flarum/Component', 'flarum/compo });; 'use strict'; +System.register('flarum/components/AdvancedPage', ['flarum/components/Page', 'flarum/components/FieldSet', 'flarum/components/Button', 'flarum/components/Alert', 'flarum/utils/saveSettings', 'flarum/utils/ItemList'], function (_export, _context) { + var Page, FieldSet, Button, Alert, saveSettings, ItemList, AdvancedPage; + return { + setters: [function (_flarumComponentsPage) { + Page = _flarumComponentsPage.default; + }, function (_flarumComponentsFieldSet) { + FieldSet = _flarumComponentsFieldSet.default; + }, function (_flarumComponentsButton) { + Button = _flarumComponentsButton.default; + }, function (_flarumComponentsAlert) { + Alert = _flarumComponentsAlert.default; + }, function (_flarumUtilsSaveSettings) { + saveSettings = _flarumUtilsSaveSettings.default; + }, function (_flarumUtilsItemList) { + ItemList = _flarumUtilsItemList.default; + }], + execute: function () { + AdvancedPage = function (_Page) { + babelHelpers.inherits(AdvancedPage, _Page); + + function AdvancedPage() { + babelHelpers.classCallCheck(this, AdvancedPage); + return babelHelpers.possibleConstructorReturn(this, Object.getPrototypeOf(AdvancedPage).apply(this, arguments)); + } + + babelHelpers.createClass(AdvancedPage, [{ + key: 'init', + value: function init() { + var _this2 = this; + + babelHelpers.get(Object.getPrototypeOf(AdvancedPage.prototype), 'init', this).call(this); + + this.loading = false; + + this.fields = ['mail_driver', 'mail_host', 'mail_from', 'mail_port', 'mail_username', 'mail_password', 'mail_encryption']; + this.values = {}; + + var settings = app.settings; + this.fields.forEach(function (key) { + return _this2.values[key] = m.prop(settings[key]); + }); + + this.localeOptions = {}; + var locales = app.locales; + for (var i in locales) { + this.localeOptions[i] = locales[i] + ' (' + i + ')'; + } + } + }, { + key: 'view', + value: function view() { + return m( + 'div', + { className: 'AdvancedPage' }, + m( + 'div', + { className: 'container' }, + m( + 'form', + { onsubmit: this.onsubmit.bind(this) }, + FieldSet.component({ + label: app.translator.trans('core.admin.advanced.mail_heading'), + className: 'AdvancedPage-MailSettings', + children: [m( + 'div', + { className: 'helpText' }, + app.translator.trans('core.admin.advanced.mail_text') + ), m( + 'div', + { className: 'AdvancedPage-mailSettings-input' }, + m('input', { className: 'FormControl', value: this.values.mail_driver() || '', oninput: m.withAttr('value', this.values.mail_driver), placeholder: app.translator.trans('core.admin.advanced.mail_driver') }), + m('input', { className: 'FormControl', value: this.values.mail_host() || '', oninput: m.withAttr('value', this.values.mail_host), placeholder: app.translator.trans('core.admin.advanced.mail_host') }), + m('input', { className: 'FormControl', value: this.values.mail_from() || '', oninput: m.withAttr('value', this.values.mail_from), placeholder: app.translator.trans('core.admin.advanced.mail_from') }), + m('input', { className: 'FormControl', value: this.values.mail_port() || '', oninput: m.withAttr('value', this.values.mail_port), placeholder: app.translator.trans('core.admin.advanced.mail_port') }), + m('input', { className: 'FormControl', value: this.values.mail_username() || '', oninput: m.withAttr('value', this.values.mail_username), placeholder: app.translator.trans('core.admin.advanced.mail_username') }), + m('input', { className: 'FormControl', value: this.values.mail_password() || '', oninput: m.withAttr('value', this.values.mail_password), placeholder: app.translator.trans('core.admin.advanced.mail_password') }), + m('input', { className: 'FormControl', value: this.values.mail_encryption() || '', oninput: m.withAttr('value', this.values.mail_encryption), placeholder: app.translator.trans('core.admin.advanced.mail_encryption') }) + )] + }), + Button.component({ + type: 'submit', + className: 'Button Button--primary', + children: app.translator.trans('core.admin.advanced.submit_button'), + loading: this.loading, + disabled: !this.changed() + }) + ) + ) + ); + } + }, { + key: 'changed', + value: function changed() { + var _this3 = this; + + return this.fields.some(function (key) { + return _this3.values[key]() !== app.settings[key]; + }); + } + }, { + key: 'onsubmit', + value: function onsubmit(e) { + var _this4 = this; + + e.preventDefault(); + + if (this.loading) return; + + this.loading = true; + app.alerts.dismiss(this.successAlert); + + var settings = {}; + + this.fields.forEach(function (key) { + return settings[key] = _this4.values[key](); + }); + + saveSettings(settings).then(function () { + app.alerts.show(_this4.successAlert = new Alert({ type: 'success', children: app.translator.trans('core.admin.basics.saved_message') })); + }).catch(function () {}).then(function () { + _this4.loading = false; + m.redraw(); + }); + } + }]); + return AdvancedPage; + }(Page); + + _export('default', AdvancedPage); + } + }; +});; +'use strict'; + System.register('flarum/components/Alert', ['flarum/Component', 'flarum/components/Button', 'flarum/helpers/listItems', 'flarum/utils/extract'], function (_export, _context) { var Component, Button, listItems, extract, Alert; return { @@ -20946,8 +21087,8 @@ System.register('flarum/initializers/preload', ['flarum/Session'], function (_ex });; 'use strict'; -System.register('flarum/initializers/routes', ['flarum/components/DashboardPage', 'flarum/components/BasicsPage', 'flarum/components/PermissionsPage', 'flarum/components/AppearancePage', 'flarum/components/ExtensionsPage'], function (_export, _context) { - var DashboardPage, BasicsPage, PermissionsPage, AppearancePage, ExtensionsPage; +System.register('flarum/initializers/routes', ['flarum/components/DashboardPage', 'flarum/components/BasicsPage', 'flarum/components/PermissionsPage', 'flarum/components/AppearancePage', 'flarum/components/ExtensionsPage', 'flarum/components/AdvancedPage'], function (_export, _context) { + var DashboardPage, BasicsPage, PermissionsPage, AppearancePage, ExtensionsPage, AdvancedPage; _export('default', function (app) { app.routes = { @@ -20955,7 +21096,8 @@ System.register('flarum/initializers/routes', ['flarum/components/DashboardPage' 'basics': { path: '/basics', component: BasicsPage.component() }, 'permissions': { path: '/permissions', component: PermissionsPage.component() }, 'appearance': { path: '/appearance', component: AppearancePage.component() }, - 'extensions': { path: '/extensions', component: ExtensionsPage.component() } + 'extensions': { path: '/extensions', component: ExtensionsPage.component() }, + 'advanced': { path: '/advanced', component: AdvancedPage.component() } }; }); @@ -20970,6 +21112,8 @@ System.register('flarum/initializers/routes', ['flarum/components/DashboardPage' AppearancePage = _flarumComponentsAppearancePage.default; }, function (_flarumComponentsExtensionsPage) { ExtensionsPage = _flarumComponentsExtensionsPage.default; + }, function (_flarumComponentsAdvancedPage) { + AdvancedPage = _flarumComponentsAdvancedPage.default; }], execute: function () {} }; diff --git a/js/admin/src/components/AdminNav.js b/js/admin/src/components/AdminNav.js index 240872467..ef2f54e78 100644 --- a/js/admin/src/components/AdminNav.js +++ b/js/admin/src/components/AdminNav.js @@ -67,6 +67,13 @@ export default class AdminNav extends Component { description: app.translator.trans('core.admin.nav.extensions_text') })); + items.add('advanced', AdminLinkButton.component({ + href: app.route('advanced'), + icon: 'cog', + children: app.translator.trans('core.admin.nav.advanced_button'), + description: app.translator.trans('core.admin.nav.advanced_text') + })) + return items; } } diff --git a/js/admin/src/components/AdvancedPage.js b/js/admin/src/components/AdvancedPage.js new file mode 100644 index 000000000..82567585f --- /dev/null +++ b/js/admin/src/components/AdvancedPage.js @@ -0,0 +1,98 @@ +import Page from 'flarum/components/Page'; +import FieldSet from 'flarum/components/FieldSet'; +import Button from 'flarum/components/Button'; +import Alert from 'flarum/components/Alert'; +import saveSettings from 'flarum/utils/saveSettings'; +import ItemList from 'flarum/utils/ItemList'; + +export default class AdvancedPage extends Page { + init() { + super.init(); + + this.loading = false; + + this.fields = [ + 'mail_driver', + 'mail_host', + 'mail_from', + 'mail_port', + 'mail_username', + 'mail_password', + 'mail_encryption' + ]; + this.values = {}; + + const settings = app.settings; + this.fields.forEach(key => this.values[key] = m.prop(settings[key])); + + this.localeOptions = {}; + const locales = app.locales; + for (const i in locales) { + this.localeOptions[i] = `${locales[i]} (${i})`; + } + } + + view() { + return ( +
+
+
+ {FieldSet.component({ + label: app.translator.trans('core.admin.advanced.mail_heading'), + className: 'AdvancedPage-MailSettings', + children: [ +
+ {app.translator.trans('core.admin.advanced.mail_text')} +
, +
+ + + + + + + +
+ ] + })} + + {Button.component({ + type: 'submit', + className: 'Button Button--primary', + children: app.translator.trans('core.admin.advanced.submit_button'), + loading: this.loading, + disabled: !this.changed() + })} +
+
+
+ ); + } + + changed() { + return this.fields.some(key => this.values[key]() !== app.settings[key]); + } + + onsubmit(e) { + e.preventDefault(); + + if (this.loading) return; + + this.loading = true; + app.alerts.dismiss(this.successAlert); + + const settings = {}; + + this.fields.forEach(key => settings[key] = this.values[key]()); + + saveSettings(settings) + .then(() => { + app.alerts.show(this.successAlert = new Alert({type: 'success', children: app.translator.trans('core.admin.basics.saved_message')})); + }) + .catch(() => {}) + .then(() => { + this.loading = false; + m.redraw(); + }); + } +} diff --git a/js/admin/src/initializers/routes.js b/js/admin/src/initializers/routes.js index 5a5a416ae..8d8400c1f 100644 --- a/js/admin/src/initializers/routes.js +++ b/js/admin/src/initializers/routes.js @@ -3,6 +3,7 @@ import BasicsPage from 'flarum/components/BasicsPage'; import PermissionsPage from 'flarum/components/PermissionsPage'; import AppearancePage from 'flarum/components/AppearancePage'; import ExtensionsPage from 'flarum/components/ExtensionsPage'; +import AdvancedPage from 'flarum/components/AdvancedPage'; /** * The `routes` initializer defines the admin app's routes. @@ -15,6 +16,7 @@ export default function(app) { 'basics': {path: '/basics', component: BasicsPage.component()}, 'permissions': {path: '/permissions', component: PermissionsPage.component()}, 'appearance': {path: '/appearance', component: AppearancePage.component()}, - 'extensions': {path: '/extensions', component: ExtensionsPage.component()} + 'extensions': {path: '/extensions', component: ExtensionsPage.component()}, + 'advanced': {path: '/advanced', component: AdvancedPage.component()} }; } diff --git a/less/admin/AdvancedPage.less b/less/admin/AdvancedPage.less new file mode 100644 index 000000000..896718dc5 --- /dev/null +++ b/less/admin/AdvancedPage.less @@ -0,0 +1,31 @@ +.AdvancedPage { + padding: 20px 0; + + @media @desktop-up { + .container { + max-width: 600px; + margin: 0; + } + } + + fieldset { + margin-bottom: 30px; + + > ul { + list-style: none; + margin: 0; + padding: 0; + } + } +} + +.AdvancedPage-mailSettings-input { + + .FormControl { + margin-bottom: 1px; + } + + :last-child { + margin-bottom: 0; + } +} diff --git a/less/admin/app.less b/less/admin/app.less index 021cb346d..977ecd475 100644 --- a/less/admin/app.less +++ b/less/admin/app.less @@ -7,3 +7,4 @@ @import "EditGroupModal.less"; @import "ExtensionsPage.less"; @import "AppearancePage.less"; +@import "AdvancedPage.less";