From fc21e3f87cdadf92a3d56e12e7e59e2c584398a5 Mon Sep 17 00:00:00 2001 From: =?UTF-8?q?Szekeres=20Ba=CC=81lint?= Date: Sun, 18 Feb 2018 14:02:11 +0100 Subject: [PATCH] major refactor --- .travis.yml | 2 +- README.md | 5 +- public/assets/css/app.css | 54 +++- public/assets/js/app.js | 150 ++++++++++- public/assets/js/masonry.pkgd.min.js | 9 + public/index.html | 235 ++++++++++-------- public/templates/_general.conf.html | 44 ---- public/templates/_php.conf.html | 9 - public/templates/commands.html | 10 + public/templates/conf/_general.conf.html | 52 ++++ .../{ => conf}/_letsencrypt.conf.html | 0 public/templates/conf/_php.conf.html | 14 ++ .../{ => conf}/_php_fastcgi.conf.html | 0 public/templates/{ => conf}/_ssl.conf.html | 0 .../templates/{ => conf}/_wordpress.conf.html | 2 +- public/templates/conf/example.com.conf.html | 168 +++++++++++++ public/templates/{ => conf}/nginx.conf.html | 24 +- public/templates/example.com.conf.html | 167 ------------- 18 files changed, 592 insertions(+), 353 deletions(-) create mode 100644 public/assets/js/masonry.pkgd.min.js delete mode 100644 public/templates/_general.conf.html delete mode 100644 public/templates/_php.conf.html create mode 100644 public/templates/commands.html create mode 100644 public/templates/conf/_general.conf.html rename public/templates/{ => conf}/_letsencrypt.conf.html (100%) create mode 100644 public/templates/conf/_php.conf.html rename public/templates/{ => conf}/_php_fastcgi.conf.html (100%) rename public/templates/{ => conf}/_ssl.conf.html (100%) rename public/templates/{ => conf}/_wordpress.conf.html (96%) create mode 100644 public/templates/conf/example.com.conf.html rename public/templates/{ => conf}/nginx.conf.html (59%) delete mode 100644 public/templates/example.com.conf.html diff --git a/.travis.yml b/.travis.yml index 800d1ba..ba7faaf 100644 --- a/.travis.yml +++ b/.travis.yml @@ -13,4 +13,4 @@ deploy: on: branch: master provider: script - script: ssh -q -l root nginxconfig.io "sudo -u www-data -H sh -c 'cd /var/www/nginxconfig.io; git pull origin master'" + script: ssh -q -l root nginxconfig.io "sudo -u www-data -H sh -c 'cd /var/www/nginxconfig.io; git reset --hard && git pull origin master && sed -i -e \"s/COMMIT_HASH/$BITBUCKET_COMMIT/\" public/index.html'" diff --git a/README.md b/README.md index 123beb6..fa14276 100644 --- a/README.md +++ b/README.md @@ -3,7 +3,7 @@ Online nginx configuration generator. ## Features -* HTTPS (with [Let's Encrypt](https://letsencrypt.org), [Mozilla SSL Configuration Generator](https://mozilla.github.io/server-side-tls/ssl-config-generator/)) +* HTTPS (with [Let's Encrypt](https://letsencrypt.org) or custom certificate, [Mozilla SSL Configuration Generator](https://mozilla.github.io/server-side-tls/ssl-config-generator/)) * HTTP2 * CDN * www / non-www @@ -25,7 +25,7 @@ Online nginx configuration generator. * *[Vue.js](https://stackoverflow.com/questions/47655869/how-to-use-vue-js-with-nginx)* * *[Ember.js](https://discuss.emberjs.com/t/how-to-serve-all-routes-on-a-production-server-exactly/6372)* * … -* unified (`nginx.conf`) / separated file structure (ideal for multi-domain environment) +* unified (`nginx.conf`) / modularized file structure (ideal for multi-domain environment) * security headers * `worker_processes` * `user` @@ -46,3 +46,4 @@ Online nginx configuration generator. * [clipboard.js](https://clipboardjs.com) - Copy generated config to clipboard * [ngclipboard](http://sachinchoolur.github.io/ngclipboard/) - AngularJS directive for clipboard.js * [Angular Tooltips](https://720kb.github.io/angular-tooltips/) - helper tooltips +* [Masonry](https://masonry.desandro.com) - files grid layout diff --git a/public/assets/css/app.css b/public/assets/css/app.css index d06a49a..e4bded5 100644 --- a/public/assets/css/app.css +++ b/public/assets/css/app.css @@ -19,6 +19,12 @@ body { display: none; } +.clipboard-success { + font-size: 0.8rem; + color: #28a745; + font-weight: 700; +} + /* @@ -96,16 +102,45 @@ main .options .card + .card { margin-top: 1rem; } -main .options .card .card-body .form-label { +main .options .card .form-label { margin-bottom: 0.15rem; margin-left: 0.15rem; } -main .options .card .card-body .form-group { +main .options .card .form-group { margin-bottom: 0.5rem; } -main .options .card .card-body .form-group:last-child { +main .options .card .form-subgroup { + margin-left: 5px; + border-left: 2px solid #ced4da; + padding-left: 11px; +} + +main .options .card .form-control[type="text"]:placeholder-shown, +main .options .card .form-control[type="email"]:placeholder-shown { + background-color: #f8f8f8; +} + +main .options .card .form-control.domain:placeholder-shown { + /*background-color: #f8d7da;*/ + /*background-color: #dedeff;*/ + border-color: #3131ff; +} + +main .options .card .form-control.domain::placeholder { + color: #000; +} + +main .options .card .form-check-label { + cursor: pointer; + -webkit-user-select: none; + -moz-user-select: none; + -ms-user-select: none; + user-select: none; +} + +main .options .card .form-group:last-child { margin-bottom: 0; } @@ -119,15 +154,8 @@ main .file .btn-clipboard { vertical-align: text-bottom; } -main .file .clipboard-success { - font-size: 0.8rem; - color: #28a745; - font-weight: 700; -} - main .file .code, main .commands { - padding: 0.5rem; overflow-x: auto; font-size: 0.75rem; line-height: 1.25; @@ -136,11 +164,9 @@ main .commands { main .commands { margin-bottom: 1rem; - padding-top: 0.25rem; - padding-bottom: 0.25rem; } -main .file .code.source { +main .file .code.source.hidden { display: none; } @@ -152,6 +178,8 @@ main .commands pre { main .file .code pre code, main .commands pre code { + display: block; + padding: 0.6rem; -moz-tab-size: 4; tab-size: 4; overflow: visible; diff --git a/public/assets/js/app.js b/public/assets/js/app.js index 78db6ff..9692d50 100644 --- a/public/assets/js/app.js +++ b/public/assets/js/app.js @@ -10,6 +10,19 @@ return repeatedString; }; + + + var masonry = new Masonry('main .files .grid', { + itemSelector: '.grid-item', + columnWidth: '.grid-sizer', + percentPosition: true, + initLayout: false, + stagger: 0, + transitionDuration: '0.6s' + }); + + + angular .module('NginxConfigIoApp', ['ngclipboard', '720kb.tooltips']) .config(function NginxCongigIoConfig($locationProvider) { @@ -22,17 +35,25 @@ // PRIVATE VARIABLES // /////////////////////// var data = { - domain: 'example.com', - path: '/var/www/example.com', + domain: '', + path: '', document_root: '/public', + https: false, http2: true, - email: 'hello@example.com', - cdn: false, + + cert_type: 'letsencrypt', + email: '', + ssl_certificate: '', + ssl_certificate_key:'', + non_www: true, + cdn: false, + + index_html: false, + php: '7.2', index_php: true, - index_html: false, wordpress: false, file_structure: 'unified', @@ -64,6 +85,9 @@ $scope.dataInit = false; $scope.isDirty = false; + $scope.sslCertificateChanged = false; + $scope.sslCertificateKeyChanged = false; + $scope.extensions = { assets: 'css(\\.map)?|js(\\.map)?', fonts: 'ttf|ttc|otf|eot|woff|woff2', @@ -79,9 +103,38 @@ $scope.clipboardCopy = undefined; + ///////////////////// // SCOPE FUNCTIONS // ///////////////////// + $scope.domain = function() { + return $scope.data.domain ? $scope.data.domain : 'example.com'; + }; + + $scope.sslCertificate = function() { + if ($scope.isLetsEncrypt()) { + return '/etc/letsencrypt/live/' + $scope.domain() + '/fullchain.pem' + } + + if ($scope.data.ssl_certificate) { + return $scope.data.ssl_certificate; + } + + return '/etc/nginx/ssl/' + $scope.domain() + '.crt'; + }; + + $scope.sslCertificateKey = function() { + if ($scope.isLetsEncrypt()) { + return '/etc/letsencrypt/live/' + $scope.domain() + '/privkey.pem' + } + + if ($scope.data.ssl_certificate_key) { + return $scope.data.ssl_certificate_key; + } + + return '/etc/nginx/ssl/' + $scope.domain() + '.key'; + }; + $scope.refreshHighlighting = function() { var sourceCodes = document.querySelectorAll('main .file .code.source'); @@ -93,6 +146,10 @@ if (_sourceCode.nextSibling.children.length && _sourceCode.nextSibling.children[0].children.length) { hljs.highlightBlock(_sourceCode.nextSibling.children[0].children[0]); } + _sourceCode.classList.add('hidden'); + + masonry.reloadItems(); + masonry.layout(); }, 0, true, sourceCode); } }; @@ -101,6 +158,10 @@ var hashData = $location.search(); for (var key in hashData) { + if (hashData[key] === 'false') { + hashData[key] = false; + } + if ($scope.data[key] !== undefined && typeof $scope.data[key] === typeof hashData[key]) { $scope.isDirty = true; $scope.data[key] = hashData[key]; @@ -154,6 +215,85 @@ + /////////////////////////// + // SCOPE QUERY FUNCTIONS // + /////////////////////////// + $scope.isUnified = function() { + return $scope.data.file_structure === 'unified'; + }; + + $scope.isModularized = function() { + return !$scope.isUnified(); + }; + + $scope.isHTTPS = function() { + return $scope.data.https; + }; + + $scope.isHTTP2 = function() { + return $scope.isHTTPS() && $scope.data.http2; + }; + + $scope.isLetsEncrypt = function() { + return $scope.isHTTPS() && $scope.data.cert_type === 'letsencrypt'; + }; + + $scope.isCustomCert = function() { + return $scope.isHTTPS() && $scope.data.cert_type === 'custom'; + }; + + $scope.isNonWWW = function() { + return $scope.data.non_www; + }; + + $scope.isWWW = function() { + return !$scope.isNonWWW(); + }; + + $scope.isCDN = function() { + return $scope.isWWW() && $scope.data.cdn; + }; + + $scope.isIndexHtml = function() { + return $scope.data.index_html; + }; + + $scope.isPHP = function() { + return $scope.data.php !== 'off'; + }; + + $scope.isIndexPhp = function() { + return $scope.isPHP() && $scope.data.index_php; + }; + + $scope.isWordPress = function() { + return $scope.isPHP() && $scope.data.wordpress; + }; + + $scope.isAccessLog = function() { + return $scope.data.access_log; + }; + + $scope.isGzip = function() { + return $scope.data.gzip; + }; + + $scope.isServerTokens = function() { + return $scope.data.server_tokens; + }; + + $scope.isLogNotFound = function() { + return $scope.data.log_not_found; + }; + + $scope.isLimitReq = function() { + return $scope.data.limit_req; + }; + + + + + ////////////////// // SCOPE EVENTS // ////////////////// diff --git a/public/assets/js/masonry.pkgd.min.js b/public/assets/js/masonry.pkgd.min.js new file mode 100644 index 0000000..d7f84ef --- /dev/null +++ b/public/assets/js/masonry.pkgd.min.js @@ -0,0 +1,9 @@ +/*! + * Masonry PACKAGED v4.2.1 + * Cascading grid layout library + * https://masonry.desandro.com + * MIT License + * by David DeSandro + */ + +!function(t,e){"function"==typeof define&&define.amd?define("jquery-bridget/jquery-bridget",["jquery"],function(i){return e(t,i)}):"object"==typeof module&&module.exports?module.exports=e(t,require("jquery")):t.jQueryBridget=e(t,t.jQuery)}(window,function(t,e){"use strict";function i(i,r,a){function h(t,e,n){var o,r="$()."+i+'("'+e+'")';return t.each(function(t,h){var u=a.data(h,i);if(!u)return void s(i+" not initialized. Cannot call methods, i.e. "+r);var d=u[e];if(!d||"_"==e.charAt(0))return void s(r+" is not a valid method");var l=d.apply(u,n);o=void 0===o?l:o}),void 0!==o?o:t}function u(t,e){t.each(function(t,n){var o=a.data(n,i);o?(o.option(e),o._init()):(o=new r(n,e),a.data(n,i,o))})}a=a||e||t.jQuery,a&&(r.prototype.option||(r.prototype.option=function(t){a.isPlainObject(t)&&(this.options=a.extend(!0,this.options,t))}),a.fn[i]=function(t){if("string"==typeof t){var e=o.call(arguments,1);return h(this,t,e)}return u(this,t),this},n(a))}function n(t){!t||t&&t.bridget||(t.bridget=i)}var o=Array.prototype.slice,r=t.console,s="undefined"==typeof r?function(){}:function(t){r.error(t)};return n(e||t.jQuery),i}),function(t,e){"function"==typeof define&&define.amd?define("ev-emitter/ev-emitter",e):"object"==typeof module&&module.exports?module.exports=e():t.EvEmitter=e()}("undefined"!=typeof window?window:this,function(){function t(){}var e=t.prototype;return e.on=function(t,e){if(t&&e){var i=this._events=this._events||{},n=i[t]=i[t]||[];return-1==n.indexOf(e)&&n.push(e),this}},e.once=function(t,e){if(t&&e){this.on(t,e);var i=this._onceEvents=this._onceEvents||{},n=i[t]=i[t]||{};return n[e]=!0,this}},e.off=function(t,e){var i=this._events&&this._events[t];if(i&&i.length){var n=i.indexOf(e);return-1!=n&&i.splice(n,1),this}},e.emitEvent=function(t,e){var i=this._events&&this._events[t];if(i&&i.length){i=i.slice(0),e=e||[];for(var n=this._onceEvents&&this._onceEvents[t],o=0;oe;e++){var i=h[e];t[i]=0}return t}function n(t){var e=getComputedStyle(t);return e||a("Style returned "+e+". Are you running this code in a hidden iframe on Firefox? See http://bit.ly/getsizebug1"),e}function o(){if(!d){d=!0;var e=document.createElement("div");e.style.width="200px",e.style.padding="1px 2px 3px 4px",e.style.borderStyle="solid",e.style.borderWidth="1px 2px 3px 4px",e.style.boxSizing="border-box";var i=document.body||document.documentElement;i.appendChild(e);var o=n(e);r.isBoxSizeOuter=s=200==t(o.width),i.removeChild(e)}}function r(e){if(o(),"string"==typeof e&&(e=document.querySelector(e)),e&&"object"==typeof e&&e.nodeType){var r=n(e);if("none"==r.display)return i();var a={};a.width=e.offsetWidth,a.height=e.offsetHeight;for(var d=a.isBorderBox="border-box"==r.boxSizing,l=0;u>l;l++){var c=h[l],f=r[c],m=parseFloat(f);a[c]=isNaN(m)?0:m}var p=a.paddingLeft+a.paddingRight,g=a.paddingTop+a.paddingBottom,y=a.marginLeft+a.marginRight,v=a.marginTop+a.marginBottom,_=a.borderLeftWidth+a.borderRightWidth,z=a.borderTopWidth+a.borderBottomWidth,E=d&&s,b=t(r.width);b!==!1&&(a.width=b+(E?0:p+_));var x=t(r.height);return x!==!1&&(a.height=x+(E?0:g+z)),a.innerWidth=a.width-(p+_),a.innerHeight=a.height-(g+z),a.outerWidth=a.width+y,a.outerHeight=a.height+v,a}}var s,a="undefined"==typeof console?e:function(t){console.error(t)},h=["paddingLeft","paddingRight","paddingTop","paddingBottom","marginLeft","marginRight","marginTop","marginBottom","borderLeftWidth","borderRightWidth","borderTopWidth","borderBottomWidth"],u=h.length,d=!1;return r}),function(t,e){"use strict";"function"==typeof define&&define.amd?define("desandro-matches-selector/matches-selector",e):"object"==typeof module&&module.exports?module.exports=e():t.matchesSelector=e()}(window,function(){"use strict";var t=function(){var t=window.Element.prototype;if(t.matches)return"matches";if(t.matchesSelector)return"matchesSelector";for(var e=["webkit","moz","ms","o"],i=0;is?"round":"floor";r=Math[a](r),this.cols=Math.max(r,1)},n.getContainerWidth=function(){var t=this._getOption("fitWidth"),i=t?this.element.parentNode:this.element,n=e(i);this.containerWidth=n&&n.innerWidth},n._getItemLayoutPosition=function(t){t.getSize();var e=t.size.outerWidth%this.columnWidth,i=e&&1>e?"round":"ceil",n=Math[i](t.size.outerWidth/this.columnWidth);n=Math.min(n,this.cols);for(var o=this.options.horizontalOrder?"_getHorizontalColPosition":"_getTopColPosition",r=this[o](n,t),s={x:this.columnWidth*r.col,y:r.y},a=r.y+t.size.outerHeight,h=n+r.col,u=r.col;h>u;u++)this.colYs[u]=a;return s},n._getTopColPosition=function(t){var e=this._getTopColGroup(t),i=Math.min.apply(Math,e);return{col:e.indexOf(i),y:i}},n._getTopColGroup=function(t){if(2>t)return this.colYs;for(var e=[],i=this.cols+1-t,n=0;i>n;n++)e[n]=this._getColGroupY(n,t);return e},n._getColGroupY=function(t,e){if(2>e)return this.colYs[t];var i=this.colYs.slice(t,t+e);return Math.max.apply(Math,i)},n._getHorizontalColPosition=function(t,e){var i=this.horizontalColIndex%this.cols,n=t>1&&i+t>this.cols;i=n?0:i;var o=e.size.outerWidth&&e.size.outerHeight;return this.horizontalColIndex=o?i+t:this.horizontalColIndex,{col:i,y:this._getColGroupY(i,t)}},n._manageStamp=function(t){var i=e(t),n=this._getElementOffset(t),o=this._getOption("originLeft"),r=o?n.left:n.right,s=r+i.outerWidth,a=Math.floor(r/this.columnWidth);a=Math.max(0,a);var h=Math.floor(s/this.columnWidth);h-=s%this.columnWidth?0:1,h=Math.min(this.cols-1,h);for(var u=this._getOption("originTop"),d=(u?n.top:n.bottom)+i.outerHeight,l=a;h>=l;l++)this.colYs[l]=Math.max(d,this.colYs[l])},n._getContainerSize=function(){this.maxY=Math.max.apply(Math,this.colYs);var t={height:this.maxY};return this._getOption("fitWidth")&&(t.width=this._getContainerFitWidth()),t},n._getContainerFitWidth=function(){for(var t=0,e=this.cols;--e&&0===this.colYs[e];)t++;return(this.cols-t)*this.columnWidth-this.gutter},n.needsResizeLayout=function(){var t=this.containerWidth;return this.getContainerWidth(),t!=this.containerWidth},i}); \ No newline at end of file diff --git a/public/index.html b/public/index.html index 323fb1a..f92515d 100644 --- a/public/index.html +++ b/public/index.html @@ -5,37 +5,24 @@ - - - - - + + + + + nginxconfig.io - + - +
-
-
-
-
-
Copy to clipboard
-
- -
-
Reset
-
-
-
-
@@ -43,6 +30,7 @@
+
▾ advertisement ▾
(window.adsbygoogle = window.adsbygoogle || []).push({}); -
⌃ advertisement ⌃
- +
- +
-
- - -
-
- - -
-
- - -
-
- - -
+
+
+ + +
+
+
+ + +
+
+
+ + +
+
+
+
+ + +
+
+
+ + +
+
+
+
+
+ + +
+
+
+ + +
+
+
+
+ + +
+
+
@@ -121,15 +146,16 @@ +
-
+
-
+
- -
@@ -249,99 +275,107 @@
- -
-
-
-
-
# HTTPS: create Diffie-Hellman keys
-openssl dhparam -dsaparam -out /etc/nginx/dhparam.pem 2048
-
-# HTTPS: create ACME-challenge common directory
-sudo -u {{ data.user }} sh -c "mkdir -p /var/www/_letsencrypt"
-
-# HTTPS: certbot (obtain certificates)
-certbot certonly --webroot -d {{ data.domain }} -d www.{{ data.domain }} -d cdn.{{ data.domain }} --email {{ data.email }} -w /var/www/_letsencrypt -n --agree-tos --force-renewal
+
+
+
+
+ +
+ +
Copied!
+
+
+
-
+
+
+
+
+
+
+
+
+
+
+
/etc/nginx/nginx.conf Copied!
-
+
-
- /etc/nginx/sites-enabled/{{ data.domain }}.conf +
+ /etc/nginx/sites-enabled/{{ domain() }}.conf Copied!
-
+
-
+
/etc/nginx/_ssl.conf Copied!
-
+
-
+
/etc/nginx/_letsencrypt.conf Copied!
-
+
-
+
/etc/nginx/_general.conf Copied!
-
+
-
+
/etc/nginx/_php.conf Copied!
-
+
-
+
/etc/nginx/_php_fastcgi.conf Copied!
-
+
-
+
/etc/nginx/_wordpress.conf Copied!
-
+
@@ -349,6 +383,7 @@
@@ -364,7 +398,7 @@