Better webpack chunking

Added default HTTPs site.

Jenkinsfile

@@ -27,10 +27,10 @@ pipeline {
           steps {
             ansiColor('xterm') {
               // Codebase
-              sh 'docker run --rm -v $(pwd):/app -w /app $BASE_IMAGE_NAME yarn --registry=$NPM_REGISTRY install'
+              sh 'docker run --rm -v $(pwd):/app -w /app $BASE_IMAGE_NAME yarn install'
               sh 'docker run --rm -v $(pwd):/app -w /app $BASE_IMAGE_NAME npm run-script build'
               sh 'rm -rf node_modules'
-              sh 'docker run --rm -v $(pwd):/app -w /app $BASE_IMAGE_NAME yarn --registry=$NPM_REGISTRY install --prod'
+              sh 'docker run --rm -v $(pwd):/app -w /app $BASE_IMAGE_NAME yarn install --prod'
               sh 'docker run --rm -v $(pwd):/data $DOCKER_CI_TOOLS node-prune'
 
               // Docker Build
@@ -70,10 +70,10 @@ pipeline {
           steps {
             ansiColor('xterm') {
               // Codebase
-              sh 'docker run --rm -v $(pwd):/app -w /app $BASE_IMAGE_NAME-armhf yarn --registry=$NPM_REGISTRY install'
+              sh 'docker run --rm -v $(pwd):/app -w /app $BASE_IMAGE_NAME-armhf yarn install'
               sh 'docker run --rm -v $(pwd):/app -w /app $BASE_IMAGE_NAME-armhf npm run-script build'
               sh 'rm -rf node_modules'
-              sh 'docker run --rm -v $(pwd):/app -w /app $BASE_IMAGE_NAME-armhf yarn --registry=$NPM_REGISTRY install --prod'
+              sh 'docker run --rm -v $(pwd):/app -w /app $BASE_IMAGE_NAME-armhf yarn install --prod'
 
               // Docker Build
               sh 'docker build --pull --no-cache --squash --compress -t $TEMP_IMAGE_NAME_ARM -f Dockerfile.armhf .'

package.json

@@ -1,6 +1,6 @@
 {
   "name": "nginx-proxy-manager",
-  "version": "2.0.3",
+  "version": "2.0.4",
   "description": "A beautiful interface for creating Nginx endpoints",
   "main": "src/backend/index.js",
   "devDependencies": {
@@ -30,8 +30,8 @@
     "style-loader": "^0.22.1",
     "tabler-ui": "git+https://github.com/tabler/tabler.git",
     "underscore": "^1.8.3",
-    "webpack": "^4.12.0",
-    "webpack-cli": "^3.0.8",
+    "webpack": "^4.25.1",
+    "webpack-cli": "^3.1.2",
     "webpack-visualizer-plugin": "^0.1.11"
   },
   "dependencies": {

rootfs/etc/nginx/conf.d/default.conf

@@ -36,3 +36,17 @@ server {
     root /var/www/html;
   }
 }
+
+# Default 443 Host
+server {
+  listen 443 ssl default;
+  server_name localhost;
+
+  access_log /data/logs/default.log proxy;
+
+  ssl_certificate /data/nginx/dummycert.pem;
+  ssl_certificate_key /data/nginx/dummykey.pem;
+  include conf.d/include/ssl-ciphers.conf;
+
+  return 444;
+}

rootfs/etc/nginx/conf.d/include/proxy.conf

@@ -1,6 +1,6 @@
 add_header       X-Served-By $host;
 proxy_set_header Host $host;
 proxy_set_header X-Forwarded-Scheme $scheme;
-proxy_set_header X-Forwarded-Protocol $scheme;
-proxy_set_header X-Forwarded-For $remote_addr;
+proxy_set_header X-Forwarded-Proto  $scheme;
+proxy_set_header X-Forwarded-For    $remote_addr;
 proxy_pass       http://$server:$port;

rootfs/etc/nginx/conf.d/include/resolvers.conf

@@ -0,0 +1 @@
+# Intentionally blank

rootfs/etc/nginx/nginx.conf

@@ -51,6 +51,10 @@ http {
 
   access_log /data/logs/default.log proxy;
 
+  # Dynamically generated resolvers file
+  include /etc/nginx/conf.d/include/resolvers.conf;
+
+  # Files generated by NPM
   include /etc/nginx/conf.d/*.conf;
   include /data/nginx/proxy_host/*.conf;
   include /data/nginx/redirection_host/*.conf;
@@ -59,6 +63,7 @@ http {
 }
 
 stream {
+    # Files generated by NPM
     include /data/nginx/stream/*.conf;
 }
 

rootfs/etc/services.d/nginx/run

@@ -1,5 +1,6 @@
 #!/usr/bin/with-contenv bash
 
+# Create required folders
 mkdir -p /tmp/nginx/body \
   /var/log/nginx \
   /data/nginx \
@@ -12,9 +13,30 @@ mkdir -p /tmp/nginx/body \
   /data/nginx/dead_host \
   /data/nginx/temp \
   /var/lib/nginx/cache/public \
-  /var/lib/nginx/cache/private
+  /var/lib/nginx/cache/private \
+  /var/cache/nginx/proxy_temp
 
-touch /var/log/nginx/error.log && chmod 777 /var/log/nginx/error.log
+touch /var/log/nginx/error.log && chmod 777 /var/log/nginx/error.log && chmod -R 777 /var/cache/nginx
 chown root /tmp/nginx
 
+# Dynamically generate resolvers file
+echo resolver $(awk 'BEGIN{ORS=" "} $1=="nameserver" {print $2}' /etc/resolv.conf) ";" > /etc/nginx/conf.d/include/resolvers.conf
+
+# Generate dummy self-signed certificate.
+if [ ! -f /data/nginx/dummycert.pem ] || [ ! -f /data/nginx/dummykey.pem ]
+then
+  echo "Generating dummy SSL certificate..."
+  openssl req \
+    -new \
+    -newkey rsa:2048 \
+    -days 3650 \
+    -nodes \
+    -x509 \
+    -subj '/O=Nginx Proxy Manager/OU=Dummy Certificate/CN=localhost' \
+    -keyout /data/nginx/dummykey.pem \
+    -out /data/nginx/dummycert.pem
+  echo "Complete"
+fi
+
+# Run
 exec nginx

src/backend/importer.js

@@ -354,7 +354,7 @@ module.exports = function () {
             .insertAndFetch({
                 owner_user_id:   1,
                 domain_names:    [host.hostname],
-                forward_ip:      host.forward_server,
+                forward_host:    host.forward_server,
                 forward_port:    host.forward_port,
                 access_list_id:  access_list_id,
                 certificate_id:  certificate_id,

src/backend/migrations/20181019052346_forward_host.js

@@ -0,0 +1,36 @@
+'use strict';
+
+const migrate_name = 'forward_host';
+const logger       = require('../logger').migrate;
+
+/**
+ * Migrate
+ *
+ * @see http://knexjs.org/#Schema
+ *
+ * @param   {Object}  knex
+ * @param   {Promise} Promise
+ * @returns {Promise}
+ */
+exports.up = function (knex/*, Promise*/) {
+    logger.info('[' + migrate_name + '] Migrating Up...');
+
+    return knex.schema.table('proxy_host', function (proxy_host) {
+        proxy_host.renameColumn('forward_ip', 'forward_host');
+    })
+        .then(() => {
+            logger.info('[' + migrate_name + '] proxy_host Table altered');
+        });
+};
+
+/**
+ * Undo Migrate
+ *
+ * @param   {Object}  knex
+ * @param   {Promise} Promise
+ * @returns {Promise}
+ */
+exports.down = function (knex, Promise) {
+    logger.warn('[' + migrate_name + '] You can\'t migrate down this one.');
+    return Promise.resolve(true);
+};

src/backend/schema/endpoints/proxy-hosts.json

@@ -18,9 +18,10 @@
     "domain_names": {
       "$ref": "../definitions.json#/definitions/domain_names"
     },
-    "forward_ip": {
+    "forward_host": {
       "type": "string",
-      "format": "ipv4"
+      "minLength": 1,
+      "maxLength": 50
     },
     "forward_port": {
       "type": "integer",
@@ -67,8 +68,8 @@
     "domain_names": {
       "$ref": "#/definitions/domain_names"
     },
-    "forward_ip": {
-      "$ref": "#/definitions/forward_ip"
+    "forward_host": {
+      "$ref": "#/definitions/forward_host"
     },
     "forward_port": {
       "$ref": "#/definitions/forward_port"
@@ -131,15 +132,15 @@
         "additionalProperties": false,
         "required": [
           "domain_names",
-          "forward_ip",
+          "forward_host",
           "forward_port"
         ],
         "properties": {
           "domain_names": {
             "$ref": "#/definitions/domain_names"
           },
-          "forward_ip": {
-            "$ref": "#/definitions/forward_ip"
+          "forward_host": {
+            "$ref": "#/definitions/forward_host"
           },
           "forward_port": {
             "$ref": "#/definitions/forward_port"
@@ -193,8 +194,8 @@
           "domain_names": {
             "$ref": "#/definitions/domain_names"
           },
-          "forward_ip": {
-            "$ref": "#/definitions/forward_ip"
+          "forward_host": {
+            "$ref": "#/definitions/forward_host"
           },
           "forward_port": {
             "$ref": "#/definitions/forward_port"

src/backend/templates/proxy_host.conf

@@ -1,7 +1,7 @@
 {% include "_header_comment.conf" %}
 
 server {
-  set $server {{ forward_ip }};
+  set $server "{{ forward_host }}";
   set $port   {{ forward_port }};
 
 {% include "_listen.conf" %}

src/backend/views/index.ejs

@@ -5,5 +5,5 @@
     <span class="loader"></span>
 </div>
 
-<script type="text/javascript" src="/js/main.js?v=<%= version %>"></script>
+<script type="text/javascript" src="/js/main.bundle.js?v=<%= version %>"></script>
 <%- include partials/footer.ejs %>

src/backend/views/login.ejs

@@ -5,5 +5,5 @@
     <span class="loader"></span>
 </div>
 
-<script type="text/javascript" src="/js/login.js?v=<%= version %>"></script>
+<script type="text/javascript" src="/js/main.bundle.js?v=<%= version %>"></script>
 <%- include partials/footer.ejs %>

src/frontend/js/app/nginx/dead/list/item.ejs

@@ -6,9 +6,15 @@
 <td>
     <div>
         <% domain_names.map(function(host) {
-            %>
-            <span class="tag"><%- host %></span>
-            <%
+            if (host.indexOf('*') === -1) {
+                %>
+                <span class="tag host-link hover-red" rel="http<%- certificate_id ? 's' : '' %>://<%- host %>"><%- host %></span>
+                <%
+            } else {
+                %>
+                <span class="tag"><%- host %></span>
+                <%
+            }
         });
         %>
     </div>

src/frontend/js/app/nginx/dead/list/item.js

@@ -9,8 +9,9 @@ module.exports = Mn.View.extend({
     tagName:  'tr',
 
     ui: {
-        edit:   'a.edit',
-        delete: 'a.delete'
+        edit:      'a.edit',
+        delete:    'a.delete',
+        host_link: '.host-link'
     },
 
     events: {
@@ -22,6 +23,12 @@ module.exports = Mn.View.extend({
         'click @ui.delete': function (e) {
             e.preventDefault();
             App.Controller.showNginxDeadDeleteConfirm(this.model);
+        },
+
+        'click @ui.host_link': function (e) {
+            e.preventDefault();
+            let win = window.open($(e.currentTarget).attr('rel'), '_blank');
+            win.focus();
         }
     },
 

src/frontend/js/app/nginx/proxy/form.ejs

@@ -22,8 +22,8 @@
                         </div>
                         <div class="col-sm-8 col-md-8">
                             <div class="form-group">
-                                <label class="form-label"><%- i18n('proxy-hosts', 'forward-ip') %><span class="form-required">*</span></label>
-                                <input type="text" name="forward_ip" class="form-control text-monospace" placeholder="000.000.000.000" value="<%- forward_ip %>" autocomplete="off" maxlength="15" required>
+                                <label class="form-label"><%- i18n('proxy-hosts', 'forward-host') %><span class="form-required">*</span></label>
+                                <input type="text" name="forward_host" class="form-control text-monospace" placeholder="" value="<%- forward_host %>" autocomplete="off" maxlength="50" required>
                             </div>
                         </div>
                         <div class="col-sm-4 col-md-4">

src/frontend/js/app/nginx/proxy/form.js

@@ -9,7 +9,6 @@ const accessListItemTemplate = require('./access-list-item.ejs');
 const Helpers                = require('../../../lib/helpers');
 
 require('jquery-serializejson');
-require('jquery-mask-plugin');
 require('selectize');
 
 module.exports = Mn.View.extend({
@@ -19,7 +18,7 @@ module.exports = Mn.View.extend({
     ui: {
         form:               'form',
         domain_names:       'input[name="domain_names"]',
-        forward_ip:         'input[name="forward_ip"]',
+        forward_host:       'input[name="forward_host"]',
         buttons:            '.modal-footer button',
         cancel:             'button.cancel',
         save:               'button.save',
@@ -123,12 +122,6 @@ module.exports = Mn.View.extend({
     onRender: function () {
         let view = this;
 
-        // IP Address
-        this.ui.forward_ip.mask('099.099.099.099', {
-            clearIfNotMatch: true,
-            placeholder:     '000.000.000.000'
-        });
-
         // Domain names
         this.ui.domain_names.selectize({
             delimiter:    ',',

src/frontend/js/app/nginx/proxy/list/item.ejs

@@ -6,9 +6,15 @@
 <td>
     <div>
         <% domain_names.map(function(host) {
-            %>
-            <span class="tag"><%- host %></span>
-            <%
+            if (host.indexOf('*') === -1) {
+                %>
+                <span class="tag host-link hover-green" rel="http<%- certificate_id ? 's' : '' %>://<%- host %>"><%- host %></span>
+                <%
+            } else {
+                %>
+                <span class="tag"><%- host %></span>
+                <%
+            }
         });
         %>
     </div>
@@ -17,7 +23,7 @@
     </div>
 </td>
 <td>
-    <div class="text-monospace"><%- forward_ip %>:<%- forward_port %></div>
+    <div class="text-monospace"><%- forward_host %>:<%- forward_port %></div>
 </td>
 <td>
     <div><%- certificate && certificate_id ? i18n('ssl', certificate.provider) : i18n('ssl', 'none') %></div>

src/frontend/js/app/nginx/proxy/list/item.js

@@ -9,8 +9,9 @@ module.exports = Mn.View.extend({
     tagName:  'tr',
 
     ui: {
-        edit:   'a.edit',
-        delete: 'a.delete'
+        edit:      'a.edit',
+        delete:    'a.delete',
+        host_link: '.host-link'
     },
 
     events: {
@@ -22,6 +23,12 @@ module.exports = Mn.View.extend({
         'click @ui.delete': function (e) {
             e.preventDefault();
             App.Controller.showNginxProxyDeleteConfirm(this.model);
+        },
+
+        'click @ui.host_link': function (e) {
+            e.preventDefault();
+            let win = window.open($(e.currentTarget).attr('rel'), '_blank');
+            win.focus();
         }
     },
 

src/frontend/js/app/nginx/redirection/list/item.ejs

@@ -6,9 +6,15 @@
 <td>
     <div>
         <% domain_names.map(function(host) {
-            %>
-            <span class="tag"><%- host %></span>
-            <%
+            if (host.indexOf('*') === -1) {
+                %>
+                <span class="tag host-link hover-yellow" rel="http<%- certificate_id ? 's' : '' %>://<%- host %>"><%- host %></span>
+                <%
+            } else {
+                %>
+                <span class="tag"><%- host %></span>
+                <%
+            }
         });
         %>
     </div>

src/frontend/js/app/nginx/redirection/list/item.js

@@ -9,8 +9,9 @@ module.exports = Mn.View.extend({
     tagName:  'tr',
 
     ui: {
-        edit:   'a.edit',
-        delete: 'a.delete'
+        edit:      'a.edit',
+        delete:    'a.delete',
+        host_link: '.host-link'
     },
 
     events: {
@@ -22,6 +23,12 @@ module.exports = Mn.View.extend({
         'click @ui.delete': function (e) {
             e.preventDefault();
             App.Controller.showNginxRedirectionDeleteConfirm(this.model);
+        },
+
+        'click @ui.host_link': function (e) {
+            e.preventDefault();
+            let win = window.open($(e.currentTarget).attr('rel'), '_blank');
+            win.focus();
         }
     },
 

src/frontend/js/i18n/messages.json

@@ -92,7 +92,7 @@
       "empty": "There are no Proxy Hosts",
       "add": "Add Proxy Host",
       "form-title": "{id, select, undefined{New} other{Edit}} Proxy Host",
-      "forward-ip": "Forward IP",
+      "forward-host": "Forward Hostname / IP",
       "forward-port": "Forward Port",
       "delete": "Delete Proxy Host",
       "delete-confirm": "Are you sure you want to delete the Proxy host for: <strong>{domains}</strong>?",

src/frontend/js/models/proxy-host.js

@@ -11,7 +11,7 @@ const model = Backbone.Model.extend({
             created_on:              null,
             modified_on:             null,
             domain_names:            [],
-            forward_ip:              '',
+            forward_host:            '',
             forward_port:            null,
             access_list_id:          0,
             certificate_id:          0,

src/frontend/scss/tabler-extra.scss

@@ -3,6 +3,18 @@ $yellow: #f1c40f;
 $blue: #467fcf;
 $pink: #f66d9b;
 
+.tag.hover-green:hover, .tag.hover-green:active, .tag.hover-green:focus {
+    background-color: #5eba00;
+    cursor: pointer;
+    color: #fff;
+}
+
+.tag.hover-red:hover, .tag.hover-red:active, .tag.hover-red:focus {
+    background-color: #cd201f;
+    cursor: pointer;
+    color: #fff;
+}
+
 /* For Card bodies where I don't want padding */
 .card-body.no-padding {
     padding: 0;
@@ -28,6 +40,12 @@ $pink: #f66d9b;
     border-color: $teal;
 }
 
+.tag.hover-teal:hover, .tag.hover-teal:active, .tag.hover-teal:focus {
+    background-color: $teal;
+    color: #fff;
+    cursor: pointer;
+}
+
 /* Yellow Outline Buttons */
 .btn-outline-yellow {
     color: $yellow;
@@ -48,6 +66,12 @@ $pink: #f66d9b;
     border-color: $yellow;
 }
 
+.tag.hover-yellow:hover, .tag.hover-yellow:active, .tag.hover-yellow:focus {
+    background-color: $yellow;
+    cursor: pointer;
+    color: #fff;
+}
+
 /* Blue Outline Buttons */
 .btn-outline-blue {
     color: $blue;
@@ -68,6 +92,12 @@ $pink: #f66d9b;
     border-color: $blue;
 }
 
+.tag.hover-blue:hover, .tag.hover-blue:active, .tag.hover-blue:focus {
+    background-color: $blue;
+    cursor: pointer;
+    color: #fff;
+}
+
 /* Pink Outline Buttons */
 .btn-outline-pink {
     color: $pink;
@@ -88,6 +118,11 @@ $pink: #f66d9b;
     border-color: $pink;
 }
 
+.tag.hover-pink:hover, .tag.hover-pink:active, .tag.hover-pink:focus {
+    background-color: $pink;
+    cursor: pointer;
+}
+
 /* dimmer */
 
 .dimmer .loader {

webpack.config.js

@@ -10,9 +10,10 @@ module.exports = {
         login: './src/frontend/js/login.js'
     },
     output:    {
-        path:       path.resolve(__dirname, 'dist'),
-        filename:   'js/[name].js',
-        publicPath: '/'
+        path:          path.resolve(__dirname, 'dist'),
+        filename:      'js/[name].bundle.js',
+        chunkFilename: 'js/[name].bundle.[id].js',
+        publicPath:    '/'
     },
     resolve:   {
         alias: {
@@ -108,41 +109,6 @@ module.exports = {
             to:      'images',
             toType:  'dir',
             context: '/app'
-        }]),
-        new webpack.optimize.LimitChunkCountPlugin({
-            maxChunks:    1, // Must be greater than or equal to one
-            minChunkSize: 999999999
-        })
-    ],
-    /*
-    optimization: {
-        splitChunks: {
-            chunks (chunk) {
-                // exclude `my-excluded-chunk`
-                return false;
-            },
-            minSize:     999999999,
-            minChunks:   1,
-            name:        true,
-            cacheGroups: {
-                vendors: {
-                    test:     /[\\/]node_modules[\\/]/,
-                    priority: -10
-                },
-                default: {
-                    minChunks:          2,
-                    priority:           -20,
-                    reuseExistingChunk: true
-                }
-            }
-        }
-    },
-    */
-    devServer: {
-        contentBase:      path.join(__dirname, 'dist'),
-        compress:         true,
-        port:             8080,
-        disableHostCheck: true,
-        host:             '0.0.0.0'
-    }
+        }])
+    ]
 };