diff --git a/src/frontend/js/app/nginx/dead/main.js b/src/frontend/js/app/nginx/dead/main.js
index b1739973..e41a0958 100644
--- a/src/frontend/js/app/nginx/dead/main.js
+++ b/src/frontend/js/app/nginx/dead/main.js
@@ -42,10 +42,11 @@ module.exports = Mn.View.extend({
}));
} else {
view.showChildView('list_region', new EmptyView({
- title: 'There are no 404 Hosts',
- subtitle: 'Why don\'t you create one?',
- link: 'Add 404 Host',
- action: function () {
+ title: 'There are no 404 Hosts',
+ subtitle: 'Why don\'t you create one?',
+ link: 'Add 404 Host',
+ btn_color: 'danger',
+ action: function () {
Controller.showNginxDeadForm();
}
}));
diff --git a/src/frontend/js/app/nginx/proxy/form.ejs b/src/frontend/js/app/nginx/proxy/form.ejs
new file mode 100644
index 00000000..f0e6bce5
--- /dev/null
+++ b/src/frontend/js/app/nginx/proxy/form.ejs
@@ -0,0 +1,34 @@
+
diff --git a/src/frontend/js/app/nginx/proxy/form.js b/src/frontend/js/app/nginx/proxy/form.js
new file mode 100644
index 00000000..67abf474
--- /dev/null
+++ b/src/frontend/js/app/nginx/proxy/form.js
@@ -0,0 +1,98 @@
+'use strict';
+
+const Mn = require('backbone.marionette');
+const template = require('./form.ejs');
+const Controller = require('../../controller');
+const Cache = require('../../cache');
+const Api = require('../../api');
+const App = require('../../main');
+const ProxyHostModel = require('../../../models/proxy-host');
+
+require('jquery-serializejson');
+require('jquery-mask-plugin');
+
+module.exports = Mn.View.extend({
+ template: template,
+ className: 'modal-dialog',
+
+ ui: {
+ form: 'form',
+ forward_ip: 'input[name="forward_ip"]',
+ buttons: '.modal-footer button',
+ cancel: 'button.cancel',
+ save: 'button.save',
+ error: '.secret-error'
+ },
+
+ events: {
+
+ 'click @ui.save': function (e) {
+ e.preventDefault();
+ return;
+
+ this.ui.error.hide();
+ let view = this;
+ let data = this.ui.form.serializeJSON();
+
+ // Manipulate
+ data.roles = [];
+ if ((this.model.get('id') === Cache.User.get('id') && this.model.isAdmin()) || (typeof data.is_admin !== 'undefined' && data.is_admin)) {
+ data.roles.push('admin');
+ delete data.is_admin;
+ }
+
+ data.is_disabled = typeof data.is_disabled !== 'undefined' ? !!data.is_disabled : false;
+ this.ui.buttons.prop('disabled', true).addClass('btn-disabled');
+ let method = Api.Users.create;
+
+ if (this.model.get('id')) {
+ // edit
+ method = Api.Users.update;
+ data.id = this.model.get('id');
+ }
+
+ method(data)
+ .then(result => {
+ if (result.id === Cache.User.get('id')) {
+ Cache.User.set(result);
+ }
+
+ if (view.model.get('id') !== Cache.User.get('id')) {
+ Controller.showUsers();
+ }
+
+ view.model.set(result);
+ App.UI.closeModal(function () {
+ if (method === Api.Users.create) {
+ // Show permissions dialog immediately
+ Controller.showUserPermissions(view.model);
+ }
+ });
+ })
+ .catch(err => {
+ this.ui.error.text(err.message).show();
+ this.ui.buttons.prop('disabled', false).removeClass('btn-disabled');
+ });
+ }
+ },
+
+ onRender: function () {
+ this.ui.forward_ip.mask('099.099.099.099', {
+ clearIfNotMatch: true,
+ placeholder: '000.000.000.000'
+ });
+ /*
+ this.ui.forward_ip.mask('099.099.099.099', {
+ reverse: true,
+ clearIfNotMatch: true,
+ placeholder: '000.000.000.000'
+ });
+ */
+ },
+
+ initialize: function (options) {
+ if (typeof options.model === 'undefined' || !options.model) {
+ this.model = new ProxyHostModel.Model();
+ }
+ }
+});
diff --git a/src/frontend/js/app/nginx/proxy/main.ejs b/src/frontend/js/app/nginx/proxy/main.ejs
index 7d8def8d..5968e3d6 100644
--- a/src/frontend/js/app/nginx/proxy/main.ejs
+++ b/src/frontend/js/app/nginx/proxy/main.ejs
@@ -1,8 +1,9 @@
+
diff --git a/src/frontend/js/app/nginx/proxy/main.js b/src/frontend/js/app/nginx/proxy/main.js
index 1101f4c8..16aa52f7 100644
--- a/src/frontend/js/app/nginx/proxy/main.js
+++ b/src/frontend/js/app/nginx/proxy/main.js
@@ -42,10 +42,11 @@ module.exports = Mn.View.extend({
}));
} else {
view.showChildView('list_region', new EmptyView({
- title: 'There are no Proxy Hosts',
- subtitle: 'Why don\'t you create one?',
- link: 'Add Proxy Host',
- action: function () {
+ title: 'There are no Proxy Hosts',
+ subtitle: 'Why don\'t you create one?',
+ link: 'Add Proxy Host',
+ btn_color: 'success',
+ action: function () {
Controller.showNginxProxyForm();
}
}));
diff --git a/src/frontend/js/app/nginx/redirection/main.ejs b/src/frontend/js/app/nginx/redirection/main.ejs
index 6e67537d..838f98e9 100644
--- a/src/frontend/js/app/nginx/redirection/main.ejs
+++ b/src/frontend/js/app/nginx/redirection/main.ejs
@@ -1,8 +1,9 @@
+
diff --git a/src/frontend/js/app/nginx/redirection/main.js b/src/frontend/js/app/nginx/redirection/main.js
index 4a0213ff..c2c60c67 100644
--- a/src/frontend/js/app/nginx/redirection/main.js
+++ b/src/frontend/js/app/nginx/redirection/main.js
@@ -42,10 +42,11 @@ module.exports = Mn.View.extend({
}));
} else {
view.showChildView('list_region', new EmptyView({
- title: 'There are no Redirection Hosts',
- subtitle: 'Why don\'t you create one?',
- link: 'Add Redirection Host',
- action: function () {
+ title: 'There are no Redirection Hosts',
+ subtitle: 'Why don\'t you create one?',
+ link: 'Add Redirection Host',
+ btn_color: 'yellow',
+ action: function () {
Controller.showNginxRedirectionForm();
}
}));
diff --git a/src/frontend/js/app/nginx/stream/main.ejs b/src/frontend/js/app/nginx/stream/main.ejs
index 202cd54b..c367f07a 100644
--- a/src/frontend/js/app/nginx/stream/main.ejs
+++ b/src/frontend/js/app/nginx/stream/main.ejs
@@ -1,8 +1,9 @@
+
diff --git a/src/frontend/js/app/nginx/stream/main.js b/src/frontend/js/app/nginx/stream/main.js
index fce7915d..2746274e 100644
--- a/src/frontend/js/app/nginx/stream/main.js
+++ b/src/frontend/js/app/nginx/stream/main.js
@@ -42,10 +42,11 @@ module.exports = Mn.View.extend({
}));
} else {
view.showChildView('list_region', new EmptyView({
- title: 'There are no Streams',
- subtitle: 'Why don\'t you create one?',
- link: 'Add Stream',
- action: function () {
+ title: 'There are no Streams',
+ subtitle: 'Why don\'t you create one?',
+ link: 'Add Stream',
+ btn_color: 'blue',
+ action: function () {
Controller.showNginxStreamForm();
}
}));
diff --git a/src/frontend/js/models/proxy-host.js b/src/frontend/js/models/proxy-host.js
index cba7f8ba..9748c75b 100644
--- a/src/frontend/js/models/proxy-host.js
+++ b/src/frontend/js/models/proxy-host.js
@@ -12,8 +12,8 @@ const model = Backbone.Model.extend({
owner: null,
domain_name: '',
forward_ip: '',
- forward_port: 0,
- access_list_id: 0,
+ forward_port: null,
+ access_list_id: null,
ssl_enabled: false,
ssl_provider: false,
ssl_forced: false,
diff --git a/src/frontend/scss/tabler-extra.scss b/src/frontend/scss/tabler-extra.scss
index 55089d1f..e5113483 100644
--- a/src/frontend/scss/tabler-extra.scss
+++ b/src/frontend/scss/tabler-extra.scss
@@ -1,4 +1,6 @@
$teal: #2bcbba;
+$yellow: #f1c40f;
+$blue: #467fcf;
/* For Card bodies where I don't want padding */
.card-body.no-padding {
@@ -25,6 +27,48 @@ $teal: #2bcbba;
border-color: $teal;
}
+/* Yellow Outline Buttons */
+.btn-outline-yellow {
+ color: $yellow;
+ background-color: transparent;
+ background-image: none;
+ border-color: $yellow;
+}
+
+.btn-outline-yellow:hover {
+ color: #fff;
+ background-color: $yellow;
+ border-color: $yellow;
+}
+
+.btn-outline-yellow:not(:disabled):not(.disabled):active, .btn-outline-yellow:not(:disabled):not(.disabled).active, .show > .btn-outline-yellow.dropdown-toggle {
+ color: #fff;
+ background-color: $yellow;
+ border-color: $yellow;
+}
+
+/* Blue Outline Buttons */
+.btn-outline-blue {
+ color: $blue;
+ background-color: transparent;
+ background-image: none;
+ border-color: $blue;
+}
+
+.btn-outline-blue:hover {
+ color: #fff;
+ background-color: $blue;
+ border-color: $blue;
+}
+
+.btn-outline-blue:not(:disabled):not(.disabled):active, .btn-outline-blue:not(:disabled):not(.disabled).active, .show > .btn-outline-blue.dropdown-toggle {
+ color: #fff;
+ background-color: $blue;
+ border-color: $blue;
+}
+
+/* dimmer */
+
.dimmer .loader {
margin-top: 50px;
}