From 4e3232e57a1b8afde5aa71fb3b1bfd70fcf6ff92 Mon Sep 17 00:00:00 2001 From: MichiK <6341204+der-michik@users.noreply.github.com> Date: Tue, 4 Dec 2018 21:03:32 +0100 Subject: [PATCH 1/9] Replace datepicker and remove datepicker inline JS --- includes/sys_form.php | 15 +-------------- package.json | 3 ++- resources/assets/js/forms.js | 33 +++++++++++++++++++++++++++++++++ resources/assets/js/vendor.js | 7 +++---- 4 files changed, 39 insertions(+), 19 deletions(-) diff --git a/includes/sys_form.php b/includes/sys_form.php index b5a957c0..3c31f43e 100644 --- a/includes/sys_form.php +++ b/includes/sys_form.php @@ -72,23 +72,10 @@ function form_date($name, $label, $value, $start_date = '', $end_date = '') $shortLocale = substr($locale, 0, 2); return form_element($label, ' -
+
' . '' . glyph('th') . '
- ', $dom_id); } diff --git a/package.json b/package.json index 3c6dbca1..7a6191a5 100644 --- a/package.json +++ b/package.json @@ -14,11 +14,12 @@ }, "dependencies": { "bootstrap": "^3.3.7", - "bootstrap-datepicker": "^1.7.1", "chart.js": "^1.0.2", + "eonasdan-bootstrap-datetimepicker": "^4.17.47", "jquery": "^3.3.1", "jquery-ui": "^1.11.2", "moment": "^2.8.2", + "moment-timezone": "^0.4.0", "select2": "^4.0.6-rc.1", "select2-bootstrap-theme": "0.1.0-beta.10" }, diff --git a/resources/assets/js/forms.js b/resources/assets/js/forms.js index 13e42d26..f1581907 100644 --- a/resources/assets/js/forms.js +++ b/resources/assets/js/forms.js @@ -92,3 +92,36 @@ $(function () { return ($(window).height() - 50) + 'px'; }).css('overflow-y', 'scroll'); }); + +/* + * Add a datepicker to all date input fields. + */ +$(function () { + $('.input-group.date').each(function () { + var elem = $(this); + var opts = { + minDate: '', + maxDate: '', + locale: 'en', + format: 'YYYY-MM-DD', + widgetPositioning: {horizontal: 'auto', vertical: 'bottom'} + }; + $.extend(opts, elem.data()); + if (opts.minDate.length === 0) { + delete opts.minDate; + } + if (opts.maxDate.length === 0) { + delete opts.maxDate; + } + elem.children('input').attr('type', 'text'); + elem.children().on('click', function (ev) { + ev.stopImmediatePropagation(); + if (elem.data('DateTimePicker') === undefined) { + elem.datetimepicker(opts); + elem.data('DateTimePicker').show(); + } else { + elem.data('DateTimePicker').toggle(); + } + }); + }); +}); diff --git a/resources/assets/js/vendor.js b/resources/assets/js/vendor.js index f9cddad6..07561fdf 100644 --- a/resources/assets/js/vendor.js +++ b/resources/assets/js/vendor.js @@ -1,12 +1,11 @@ window.$ = window.jQuery = require('jquery'); require('imports-loader?define=>false!jquery-ui'); require('bootstrap'); -require('imports-loader?define=>false&exports=>false!bootstrap-datepicker'); -require('bootstrap-datepicker/js/locales/bootstrap-datepicker.de'); -require('bootstrap-datepicker/dist/css/bootstrap-datepicker3.min.css'); -require('imports-loader?this=>window!chart.js'); require('imports-loader?this=>window&define=>false&exports=>false!moment'); require('imports-loader?this=>window&define=>false&exports=>false!moment/locale/de'); +require('imports-loader?define=>false&exports=>false!eonasdan-bootstrap-datetimepicker'); +require('eonasdan-bootstrap-datetimepicker/build/css/bootstrap-datetimepicker.min.css'); +require('imports-loader?this=>window!chart.js'); require('./forms'); require('./sticky-headers'); require('./moment-countdown'); From ed5ee3235e5f377e9485fc0f65d6fe6571a91d2a Mon Sep 17 00:00:00 2001 From: MichiK <6341204+der-michik@users.noreply.github.com> Date: Wed, 5 Dec 2018 18:43:51 +0100 Subject: [PATCH 2/9] Add timepickers in shifts view --- includes/pages/user_shifts.php | 4 +++ resources/assets/js/forms.js | 42 ++++++++++++++++++++++++++ resources/views/pages/user-shifts.html | 21 +++---------- 3 files changed, 50 insertions(+), 17 deletions(-) diff --git a/includes/pages/user_shifts.php b/includes/pages/user_shifts.php index 942b8849..7156212a 100644 --- a/includes/pages/user_shifts.php +++ b/includes/pages/user_shifts.php @@ -176,6 +176,9 @@ function view_user_shifts() $days = load_days(); $rooms = load_rooms(); $types = load_types(); + $locale = $session->get('locale'); + $shortLocale = substr($locale, 0, 2); + if (!$session->has('shifts-filter')) { $room_ids = [ @@ -253,6 +256,7 @@ function view_user_shifts() ), ] ), + 'short_locale' => $shortLocale, 'filled_select' => make_select($filled, $shiftsFilter->getFilled(), 'filled', __('Occupancy')), 'task_notice' => '1' diff --git a/resources/assets/js/forms.js b/resources/assets/js/forms.js index f1581907..3f2014d0 100644 --- a/resources/assets/js/forms.js +++ b/resources/assets/js/forms.js @@ -125,3 +125,45 @@ $(function () { }); }); }); + +/* + * Add a timepicker to all time input fields. + */ +$(function () { + $('.input-group.time').each(function () { + var elem = $(this); + var opts = { + locale: 'en', + format: 'HH:mm', + widgetPositioning: {horizontal: 'auto', vertical: 'bottom'} + }; + $.extend(opts, elem.data()); + elem.children('input').attr('type', 'text'); + elem.datetimepicker(opts); + elem.children('input').on('click', function (ev) { + ev.stopImmediatePropagation(); + elem.data('DateTimePicker').toggle(); + }); + }); +}); + +/* + * Button to set current time in time input fields. + */ +$(function () { + $('.input-group.time').each(function () { + var elem = $(this); + elem.find('button').on('click', function () { + var input = elem.children('input').first(); + input.val(moment().format('HH:mm')); + var day_selector = $('#' + input.attr('id').replace('time', 'day')); + var days = day_selector.children('option'); + days.each(function (i) { + if ($(days[i]).val() === moment().format('YYYY-MM-DD')) { + day_selector.val($(days[i]).val()); + return false; + } + }); + }); + }); +}); diff --git a/resources/views/pages/user-shifts.html b/resources/views/pages/user-shifts.html index 3b75ac7f..f467c6fd 100644 --- a/resources/views/pages/user-shifts.html +++ b/resources/views/pages/user-shifts.html @@ -1,16 +1,3 @@ - -
@@ -18,11 +5,11 @@

%title%

%start_select%
-
+
-
@@ -31,11 +18,11 @@ –
%end_select%
-
+
-
From 44e33eb2de2f9c9672b4b8e8804728dfa6fff5ab Mon Sep 17 00:00:00 2001 From: MichiK <6341204+der-michik@users.noreply.github.com> Date: Thu, 6 Dec 2018 22:45:40 +0100 Subject: [PATCH 3/9] Some small JS fixes for eslint compliance --- resources/assets/js/forms.js | 10 ++++++---- 1 file changed, 6 insertions(+), 4 deletions(-) diff --git a/resources/assets/js/forms.js b/resources/assets/js/forms.js index 3f2014d0..24f94cf3 100644 --- a/resources/assets/js/forms.js +++ b/resources/assets/js/forms.js @@ -1,3 +1,5 @@ +const moment = require('moment'); + /** * Sets all checkboxes to the wanted state * @@ -116,7 +118,7 @@ $(function () { elem.children('input').attr('type', 'text'); elem.children().on('click', function (ev) { ev.stopImmediatePropagation(); - if (elem.data('DateTimePicker') === undefined) { + if (typeof elem.data('DateTimePicker') === "undefined") { elem.datetimepicker(opts); elem.data('DateTimePicker').show(); } else { @@ -156,11 +158,11 @@ $(function () { elem.find('button').on('click', function () { var input = elem.children('input').first(); input.val(moment().format('HH:mm')); - var day_selector = $('#' + input.attr('id').replace('time', 'day')); - var days = day_selector.children('option'); + var daySelector = $('#' + input.attr('id').replace('time', 'day')); + var days = daySelector.children('option'); days.each(function (i) { if ($(days[i]).val() === moment().format('YYYY-MM-DD')) { - day_selector.val($(days[i]).val()); + daySelector.val($(days[i]).val()); return false; } }); From d69f36dde165dc3d2bbb4ecc9ba6e61d1e7c6c68 Mon Sep 17 00:00:00 2001 From: marudor Date: Tue, 27 Nov 2018 21:45:04 +0100 Subject: [PATCH 4/9] modernize Stuff --- .babelrc | 6 +++--- package.json | 22 ++++++++++++---------- webpack.config.js | 27 ++++++++++++++++++++------- 3 files changed, 35 insertions(+), 20 deletions(-) diff --git a/.babelrc b/.babelrc index 84b2eaa5..2359bbe0 100644 --- a/.babelrc +++ b/.babelrc @@ -1,5 +1,5 @@ { - "presets": [["env", { + "presets": [["@babel/preset-env", { "targets": { "chrome": 45, "firefox": 42, @@ -8,8 +8,8 @@ "edge": 12, "iOS": 9 }, - "loose": true, - "useBuiltIns": true + "loose": false, + "useBuiltIns": "entry" }] ], "plugins": [ diff --git a/package.json b/package.json index 7a6191a5..dbf9777a 100644 --- a/package.json +++ b/package.json @@ -13,9 +13,9 @@ "build:watch": "webpack --watch" }, "dependencies": { - "bootstrap": "^3.3.7", - "chart.js": "^1.0.2", + "bootstrap": "^3", "eonasdan-bootstrap-datetimepicker": "^4.17.47", + "chart.js": "^1", "jquery": "^3.3.1", "jquery-ui": "^1.11.2", "moment": "^2.8.2", @@ -24,19 +24,21 @@ "select2-bootstrap-theme": "0.1.0-beta.10" }, "devDependencies": { - "babel-core": "^6.26.0", - "babel-loader": "^7.1.2", - "babel-preset-env": "^1.6.1", - "css-loader": "^0.28.7", - "extract-text-webpack-plugin": "^3.0.2", - "file-loader": "^1.1.6", + "@babel/core": "^7.1.6", + "@babel/preset-env": "^7.1.6", + "babel-loader": "^8.0.4", + "css-loader": "^1.0.1", + "file-loader": "^2.0.0", "imports-loader": "^0.8.0", "less": "^3.0.2", "less-loader": "^4.0.5", + "mini-css-extract-plugin": "^0.4.5", "mkdirp": "^0.5.1", "npm-run-all": "^4.1.3", + "optimize-css-assets-webpack-plugin": "^5.0.1", "rimraf": "^2.6.2", - "style-loader": "^0.21.0", - "webpack": "^3" + "style-loader": "^0.23.1", + "webpack": "^4.26.1", + "webpack-cli": "^3.1.2" } } diff --git a/webpack.config.js b/webpack.config.js index 010a9667..8f1021fe 100644 --- a/webpack.config.js +++ b/webpack.config.js @@ -1,6 +1,7 @@ const path = require('path'); const webpack = require('webpack'); -const ExtractTextPlugin = require('extract-text-webpack-plugin'); +const MiniCssExtractPlugin = require('mini-css-extract-plugin'); +const OptimizeCSSAssetsPlugin = require('optimize-css-assets-webpack-plugin'); const nodeEnv = (process.env.NODE_ENV || 'development').trim(); // eslint-disable-next-line @@ -14,7 +15,10 @@ const plugins = [ NODE_ENV: JSON.stringify(nodeEnv), }, }), - new ExtractTextPlugin('[name].css'), + new MiniCssExtractPlugin({ + filename: '[name].css', + chunkFilename: '[id]-[hash].css', + }), ]; @@ -24,6 +28,7 @@ for (let i = 0; i < 8; i++) { } module.exports = { + mode: __DEV__ ? 'development' : 'production', context: __dirname, resolve: { extensions: ['.js', '.jsx'], @@ -37,6 +42,9 @@ module.exports = { filename: '[name].js', publicPath: '', }, + optimization: { + minimizer: __DEV__ ? [] : [new OptimizeCSSAssetsPlugin({})], + }, module: { rules: [ { @@ -47,11 +55,16 @@ module.exports = { }, { test: /\.(eot|ttf|otf|svg|woff2?)(\?.*)?$/, loader: 'file-loader' }, { test: /\.json$/, loader: 'json-loader' }, - { test: /\.css$/, loader: 'style-loader!css-loader' }, - { test: /\.less$/, use: ExtractTextPlugin.extract({ - fallback: 'style-loader', - use: 'css-loader!less-loader' - })} + { + test: /\.(less|css)$/, + use: [ + { + loader: __DEV__ ? 'style-loader' : MiniCssExtractPlugin.loader, + }, + { loader: 'css-loader', options: { importLoaders: 1 } }, + { loader: 'less-loader' }, + ] + } ], }, plugins, From aedad457e9ef3c17971d7606ff98d928ccd9d0a3 Mon Sep 17 00:00:00 2001 From: marudor Date: Tue, 4 Dec 2018 12:53:55 +0100 Subject: [PATCH 5/9] Update devDeps to not include event-stream --- package.json | 8 ++++---- 1 file changed, 4 insertions(+), 4 deletions(-) diff --git a/package.json b/package.json index dbf9777a..991f5ea6 100644 --- a/package.json +++ b/package.json @@ -24,13 +24,13 @@ "select2-bootstrap-theme": "0.1.0-beta.10" }, "devDependencies": { - "@babel/core": "^7.1.6", - "@babel/preset-env": "^7.1.6", + "@babel/core": "^7.2.0", + "@babel/preset-env": "^7.2.0", "babel-loader": "^8.0.4", "css-loader": "^1.0.1", "file-loader": "^2.0.0", "imports-loader": "^0.8.0", - "less": "^3.0.2", + "less": "^3.9.0", "less-loader": "^4.0.5", "mini-css-extract-plugin": "^0.4.5", "mkdirp": "^0.5.1", @@ -38,7 +38,7 @@ "optimize-css-assets-webpack-plugin": "^5.0.1", "rimraf": "^2.6.2", "style-loader": "^0.23.1", - "webpack": "^4.26.1", + "webpack": "^4.27.0", "webpack-cli": "^3.1.2" } } From e3fa19b71eed1e5ae7a5025318deda51538b1c8a Mon Sep 17 00:00:00 2001 From: Igor Scheller Date: Mon, 3 Dec 2018 20:47:56 +0100 Subject: [PATCH 6/9] styling 35c3: Lighten the font color --- resources/assets/themes/theme7.less | 6 +++--- 1 file changed, 3 insertions(+), 3 deletions(-) diff --git a/resources/assets/themes/theme7.less b/resources/assets/themes/theme7.less index 57e4ac1f..90093e1c 100644 --- a/resources/assets/themes/theme7.less +++ b/resources/assets/themes/theme7.less @@ -43,8 +43,8 @@ THE SOFTWARE. @gray-darker: #000; @gray-dark: #000; @gray: #4d4d4c; // BEBOOT -@gray-light: #4d4d4c; -@gray-lighter: #4d4d4c; +@gray-light: @gray; +@gray-lighter: lighten(@gray, 15%); @brand-primary: #0084b0; // FRESH @brand-success: #00a356; // HOPE @@ -60,7 +60,7 @@ THE SOFTWARE. //** Background color for ``. @body-bg: #000; //** Global text color on ``. -@text-color: @gray; +@text-color: @gray-lighter; //** Global textual link color. @link-color: @brand-primary; From 6a261656479f59a546ddfd6f6f0bfa582c644856 Mon Sep 17 00:00:00 2001 From: MichiK <6341204+der-michik@users.noreply.github.com> Date: Tue, 4 Dec 2018 02:27:10 +0100 Subject: [PATCH 7/9] Improve Docker build caching First install the dependencies, then copy the files from the build context into the image. This allows for more caching during rebuilds when files change and rebuilds are much faster. --- contrib/Dockerfile | 6 +++--- contrib/nginx/Dockerfile | 2 +- 2 files changed, 4 insertions(+), 4 deletions(-) diff --git a/contrib/Dockerfile b/contrib/Dockerfile index 64158104..71bd0aa5 100644 --- a/contrib/Dockerfile +++ b/contrib/Dockerfile @@ -35,10 +35,10 @@ RUN rm -f /app/import/* /app/config/config.php # Build the PHP container FROM php:7-fpm-alpine WORKDIR /var/www -COPY --from=data /app/ /var/www RUN apk add --no-cache icu-dev gettext-dev && \ - docker-php-ext-install intl gettext pdo_mysql && \ - chown -R www-data:www-data /var/www/import/ /var/www/storage/ && \ + docker-php-ext-install intl gettext pdo_mysql +COPY --from=data /app/ /var/www +RUN chown -R www-data:www-data /var/www/import/ /var/www/storage/ && \ rm -r /var/www/html ENV TRUSTED_PROXIES 10.0.0.0/8,::ffff:10.0.0.0/8,\ diff --git a/contrib/nginx/Dockerfile b/contrib/nginx/Dockerfile index e838d368..609792c0 100644 --- a/contrib/nginx/Dockerfile +++ b/contrib/nginx/Dockerfile @@ -1,8 +1,8 @@ FROM node:8-alpine as themes WORKDIR /app +RUN apk add --no-cache yarn COPY resources/assets/ /app/resources/assets COPY .babelrc package.json webpack.config.js /app/ -RUN apk add --no-cache yarn RUN yarn install RUN yarn build From 356001b5ad568baf9948a9c64febb5ac274f65d0 Mon Sep 17 00:00:00 2001 From: MichiK <6341204+der-michik@users.noreply.github.com> Date: Tue, 4 Dec 2018 03:23:37 +0100 Subject: [PATCH 8/9] Swap yarn install and copy assets as well --- contrib/nginx/Dockerfile | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/contrib/nginx/Dockerfile b/contrib/nginx/Dockerfile index 609792c0..74907326 100644 --- a/contrib/nginx/Dockerfile +++ b/contrib/nginx/Dockerfile @@ -1,9 +1,9 @@ FROM node:8-alpine as themes WORKDIR /app RUN apk add --no-cache yarn -COPY resources/assets/ /app/resources/assets COPY .babelrc package.json webpack.config.js /app/ RUN yarn install +COPY resources/assets/ /app/resources/assets RUN yarn build FROM nginx:alpine From 851e75c465cffcfae1d1d76cd8310e629e03a0e5 Mon Sep 17 00:00:00 2001 From: MichiK <6341204+der-michik@users.noreply.github.com> Date: Tue, 4 Dec 2018 19:30:09 +0100 Subject: [PATCH 9/9] Set project name for docker-compose --- contrib/.env | 1 + 1 file changed, 1 insertion(+) create mode 100644 contrib/.env diff --git a/contrib/.env b/contrib/.env new file mode 100644 index 00000000..5f8d43b8 --- /dev/null +++ b/contrib/.env @@ -0,0 +1 @@ +COMPOSE_PROJECT_NAME="engelsystem"