Merge branch 'feature/remove-bower'

.gitignore

@@ -2,12 +2,9 @@
 *.sublime-project
 *.sublime-workspace
 
-# Removes external libraries' files.
-material/lib
-
 # Removes some useless build files.
-material/build/lib.css
-material/build/sass.css
+material/dist/*
+!material/dist
 
 # Removes the user defined template.
 material/extra.html

CHANGELOG.md

@@ -4,10 +4,35 @@ All notable changes to this project will be documented in this file.
 The format is based on [Keep a Changelog](http://keepachangelog.com/)
 and this project adheres to [Semantic Versioning](http://semver.org/).
 
-## vX.X.X
+## v?.?.?
+Be careful, one important change comes with this release: the `build` folder is not anymore part of the code repository. So if you use to update the theme with `git pull`, you now need to do
+
+```bash
+$ git pull
+$ npm install
+$ gulp build
+```
+
+This will install build tools and process files. I'll now attach ready-to-use built theme to each release, similarly to what is done for Shaarli.
+
+**Known issue:** the build process outputs scary errors due to new version of *uncss* not understanding properly some links containing RainTPL markup. This doesn't prevent it from working properly so you can ignore.
+
+### Changed
+- Processed JS and CSS files are not anymore in code repository.
+- Reorganisation of directories in order to keep `/material` directory clean.
+- Updated dependencies.
+- Updated Gulp to v4.
+
+### Removed
+- Bower. Front-end dependencies are now also retrieved with NPM.
+
+
+## [v0.10.2-patch.2](https://github.com/kalvn/Shaarli-Material/releases/tag/v0.10.2-patch.2) - 2018-11-06
 ### Fixed
 - HTML class added in the wrong place.
 - RainTPL escaping in linklist page.
+- Open Graph description containing html tags.
+
 
 ## [v0.10.2](https://github.com/kalvn/Shaarli-Material/releases/tag/v0.10.2) - 2018-11-04
 ### Added
@@ -19,6 +44,7 @@ and this project adheres to [Semantic Versioning](http://semver.org/).
 - Thumbnails on link list and daily pages
 - Daily previous link not disabled properly when on oldest day
 
+
 ## [v0.9.5](https://github.com/kalvn/Shaarli-Material/releases/tag/v0.9.5) - 2018-02-08
 ### Changed
 - Optimizes bookmarklet popup size and enables scrollbars

README.md

@@ -87,26 +87,30 @@ This theme uses a few Javascript libraries.
 - [awesomplete](http://leaverou.github.io/awesomplete/)
 - [blazy](http://dinbror.dk/blazy/)
 - [Sortable](http://rubaxa.github.io/Sortable/)
+- [Salvattore](https://salvattore.js.org/)
 
 
 ## Demo
 A read-only demo is available on my personal Shaarli : [https://links.kalvn.net](https://links.kalvn.net)
 
 
 ## Develop and debug
-To tweak this theme, you'll need to install Javascript and CSS libraries. To do this, install bower and run this command from inside the `material` folder:
+To tweak this theme, you'll need to install dependencies and to build JavaScript and CSS libraries. To do this, install [Node.js and NPM](https://nodejs.org) and run this from the root folder:
 
-```shell
-bower install
+```bash
+$ npm install
+$ gulp
 ```
 
-Then, if you want to compile those files via Gulp, first adapt the `gulp.js` file to your needs. Then, install Gulp and nodejs if it's not done already and run the following command from the root folder:
 
-```shell
-npm install
-gulp
+## Build for production
+
+```bash
+$ npm install
+$ gulp build
 ```
 
+
 ------------------------------------------------------------------------------
 
 You can download Shaarli via the Github project page: https://github.com/shaarli/Shaarli

gulpfile.js

@@ -8,12 +8,13 @@ var gulp = require("gulp"),
     autoprefixer  = require('gulp-autoprefixer'),
     plumber = require('gulp-plumber'),
     uglify = require('gulp-uglify'),
-    uncss = require('gulp-uncss'),
-    copy = require('gulp-copy'),
     replace = require('gulp-replace'),
     addsrc = require('gulp-add-src'),
     merge = require('merge-stream'),
     sass = require('gulp-sass');
+var postcss = require('gulp-postcss');
+var uncss = require('postcss-uncss');
+var del = require('del');
 
 var onError = function(err){
     console.log('ERROR: ' + err.toString());
@@ -23,28 +24,31 @@ var onError = function(err){
 /*****************/
 /*** Variables ***/
 /*****************/
-var ROOT = 'material/';
-var BUILD_FOLDER = ROOT + 'build';
+var DIR_ROOT = './';
+var DIR_SRC = DIR_ROOT + 'src/';
+var DIR_THEME = DIR_ROOT + 'material/';
+var DIR_LIB = DIR_ROOT + 'node_modules/';
+var DIR_DIST = DIR_THEME + 'dist/';
 
-var SCSS_SELECTOR = ROOT + 'scss/**/*.scss';
+var SCSS_SELECTOR = DIR_SRC + 'scss/**/*.scss';
 var CSS_LIB = [
-    ROOT + 'lib/bootstrap/dist/css/bootstrap.min.css'
+    DIR_LIB + 'bootstrap/dist/css/bootstrap.min.css'
 ];
 var CSS_LIB_NO_UNCSS = [
-    ROOT + 'lib/awesomplete/awesomplete.css'
+    DIR_LIB + 'awesomplete/awesomplete.css'
 ];
 
-var JS_SELECTOR = ROOT + 'src/*.js'
+var JS_SELECTOR = DIR_SRC + 'js/*.js'
 var JS_LIB = [
-    ROOT + 'lib/jquery/dist/jquery.min.js',
-    ROOT + 'lib/awesomplete/awesomplete.min.js',
-    ROOT + 'lib/blazy/blazy.min.js',
-    ROOT + 'lib/moment/min/moment.min.js',
-    ROOT + 'lib/Sortable/Sortable.min.js',
-    ROOT + 'lib/salvattore/dist/salvattore.min.js'
+    DIR_LIB + 'jquery/dist/jquery.min.js',
+    DIR_LIB + 'awesomplete/awesomplete.min.js',
+    DIR_LIB + 'blazy/blazy.min.js',
+    DIR_LIB + 'moment/min/moment.min.js',
+    DIR_LIB + 'sortablejs/Sortable.min.js',
+    DIR_LIB + 'salvattore/dist/salvattore.min.js'
 ];
 
-var BOOTSTRAP_FONTS = ROOT + 'lib/bootstrap/dist/fonts/*';
+var BOOTSTRAP_FONTS = DIR_LIB + 'bootstrap/dist/fonts/*';
 
 /*************/
 /*** Tasks ***/
@@ -58,34 +62,40 @@ gulp.task('js', function(){
         .pipe(concat('scripts.js'))
         .pipe(uglify())
         .pipe(rename('scripts.min.js'))
-        .pipe(gulp.dest(BUILD_FOLDER));
+        .pipe(gulp.dest(DIR_DIST));
 });
 
 gulp.task('sass', function(){
-    return gulp.src(ROOT + 'scss/styles.scss')
+    return gulp.src(DIR_SRC + 'scss/styles.scss')
         .pipe(plumber({
             errorHandler: onError
         }))
         .pipe(sass())
         .pipe(concat('sass.css'))
-        .pipe(gulp.dest(BUILD_FOLDER));
+        .pipe(gulp.dest(DIR_DIST));
 });
 
 gulp.task('csslib', function(){
+    var plugins = [
+        uncss({
+            html: [DIR_THEME + '*.html']
+        }),
+    ];
     return gulp.src(CSS_LIB)
+        .pipe(plumber({
+            errorHandler: onError
+        }))
         .pipe(concat('lib.css'))
         .pipe(replace(/\.\.\/fonts\//g, 'fonts/'))
-        .pipe(uncss({
-            html: [ROOT + '/*.html']
-        }))
+        .pipe(postcss(plugins))
         .pipe(addsrc.append(CSS_LIB_NO_UNCSS))
         .pipe(concat('lib.css'))
-        .pipe(gulp.dest(BUILD_FOLDER));
+        .pipe(gulp.dest(DIR_DIST));
 });
 
 // Merge css from sass and lib.
-gulp.task('css', ['sass', 'csslib'], function(){
-    return gulp.src([BUILD_FOLDER + '/lib.css', BUILD_FOLDER + '/sass.css'])
+gulp.task('css', gulp.series('sass', 'csslib', function(){
+    return gulp.src([DIR_DIST + '/lib.css', DIR_DIST + '/sass.css'])
         .pipe(plumber({
             errorHandler: onError
         }))
@@ -96,27 +106,43 @@ gulp.task('css', ['sass', 'csslib'], function(){
         }))
         .pipe(minifyCSS())
         .pipe(rename('styles.min.css'))
-        .pipe(gulp.dest(BUILD_FOLDER));
+        .pipe(gulp.dest(DIR_DIST));
+}));
+
+gulp.task('assets', function () {
+    return gulp.src(DIR_SRC + 'assets/**/*')
+        .pipe(plumber({
+            errorHandler: onError
+        }))
+        .pipe(gulp.dest(DIR_DIST));
 });
 
-gulp.task('static', function(){
+gulp.task('static', gulp.series('assets', function(){
     return gulp.src(BOOTSTRAP_FONTS)
         .pipe(plumber({
             errorHandler: onError
         }))
-        .pipe(copy(BUILD_FOLDER + '/fonts/', {prefix: 5}));
+        .pipe(gulp.dest(DIR_DIST + 'fonts/'));
+}));
+
+gulp.task('clean', function(){
+    return del([
+        DIR_DIST + 'lib.css', 
+        DIR_DIST + 'sass.css'
+  ]);
 });
 
 
 /*****************/
 /*** Watchlist ***/
 /*****************/
 gulp.task('watch', function() {
-    gulp.watch(JS_SELECTOR, ['js']);
-    gulp.watch(SCSS_SELECTOR, ['css']);
+    gulp.watch(JS_SELECTOR).on('change', gulp.series('js'));
+    gulp.watch(SCSS_SELECTOR).on('change', gulp.series('css'));
 });
 
 /************************/
 /*** Boot instruction ***/
 /************************/
-gulp.task('default', ['watch', 'css', 'js', 'static']);
+gulp.task('default', gulp.parallel('watch', 'css', 'js', 'static'));
+gulp.task('build', gulp.series(gulp.parallel('css', 'js', 'static'), 'clean'));

material/404.html

@@ -5,7 +5,7 @@
 {include="page.header"}
 <div class="container">
     <div class="text-center">
-        <img src="images/sad_star.png" alt="Nothing found">
+        <img src="dist/img/sad_star.png" alt="Nothing found">
     </div>
     <div class="nothing-found">Sorry... We found nothing here. That's a <strong>404</strong>.</div>
     <p class="text-center">{$error_message}</p>