mirror of
https://github.com/schlagmichdoch/PairDrop.git
synced 2025-04-22 15:56:17 -04:00
Lots of small improvements, websockets fallback
This commit is contained in:
Robin Linus
parent
e5eab64c6b
commit
22be7c5cb9
35 changed files with 2672 additions and 916 deletions
408
gulpfile.js
408
gulpfile.js
|
|
@ -1,5 +1,3 @@
|
|||
|
||||
|
||||
'use strict';
|
||||
|
||||
// Include Gulp & tools we'll use
|
||||
|
|
@ -17,175 +15,185 @@ var historyApiFallback = require('connect-history-api-fallback');
|
|||
var packageJson = require('./package.json');
|
||||
var crypto = require('crypto');
|
||||
var ensureFiles = require('./tasks/ensure-files.js');
|
||||
var inlinesource = require('gulp-inline-source');
|
||||
|
||||
// var ghPages = require('gulp-gh-pages');
|
||||
|
||||
var AUTOPREFIXER_BROWSERS = [
|
||||
'ie >= 10',
|
||||
'ie_mob >= 10',
|
||||
'ff >= 30',
|
||||
'chrome >= 34',
|
||||
'safari >= 7',
|
||||
'opera >= 23',
|
||||
'ios >= 7',
|
||||
'android >= 4.4',
|
||||
'bb >= 10'
|
||||
'ie >= 10',
|
||||
'ie_mob >= 10',
|
||||
'ff >= 30',
|
||||
'chrome >= 34',
|
||||
'safari >= 7',
|
||||
'opera >= 23',
|
||||
'ios >= 7',
|
||||
'android >= 4.4',
|
||||
'bb >= 10'
|
||||
];
|
||||
|
||||
var DIST = 'dist';
|
||||
|
||||
var dist = function(subpath) {
|
||||
return !subpath ? DIST : path.join(DIST, subpath);
|
||||
return !subpath ? DIST : path.join(DIST, subpath);
|
||||
};
|
||||
|
||||
var styleTask = function(stylesPath, srcs) {
|
||||
return gulp.src(srcs.map(function(src) {
|
||||
return path.join('app', stylesPath, src);
|
||||
}))
|
||||
.pipe($.changed(stylesPath, {extension: '.css'}))
|
||||
.pipe($.autoprefixer(AUTOPREFIXER_BROWSERS))
|
||||
.pipe(gulp.dest('.tmp/' + stylesPath))
|
||||
.pipe($.minifyCss())
|
||||
.pipe(gulp.dest(dist(stylesPath)))
|
||||
.pipe($.size({title: stylesPath}));
|
||||
return gulp.src(srcs.map(function(src) {
|
||||
return path.join('app', stylesPath, src);
|
||||
}))
|
||||
.pipe($.changed(stylesPath, {
|
||||
extension: '.css'
|
||||
}))
|
||||
.pipe($.autoprefixer(AUTOPREFIXER_BROWSERS))
|
||||
.pipe(gulp.dest('.tmp/' + stylesPath))
|
||||
.pipe($.minifyCss())
|
||||
.pipe(gulp.dest(dist(stylesPath)))
|
||||
.pipe($.size({
|
||||
title: stylesPath
|
||||
}));
|
||||
};
|
||||
|
||||
var imageOptimizeTask = function(src, dest) {
|
||||
return gulp.src(src)
|
||||
.pipe($.imagemin({
|
||||
progressive: true,
|
||||
interlaced: true
|
||||
}))
|
||||
.pipe(gulp.dest(dest))
|
||||
.pipe($.size({title: 'images'}));
|
||||
return gulp.src(src)
|
||||
.pipe($.imagemin({
|
||||
progressive: true,
|
||||
interlaced: true
|
||||
}))
|
||||
.pipe(gulp.dest(dest))
|
||||
.pipe($.size({
|
||||
title: 'images'
|
||||
}));
|
||||
};
|
||||
|
||||
var optimizeHtmlTask = function(src, dest) {
|
||||
var assets = $.useref.assets({
|
||||
searchPath: ['.tmp', 'app']
|
||||
});
|
||||
var assets = $.useref.assets({
|
||||
searchPath: ['.tmp', 'app']
|
||||
});
|
||||
|
||||
return gulp.src(src)
|
||||
.pipe(assets)
|
||||
// Concatenate and minify JavaScript
|
||||
.pipe($.if('*.js', $.uglify({
|
||||
preserveComments: 'some'
|
||||
})))
|
||||
// Concatenate and minify styles
|
||||
// In case you are still using useref build blocks
|
||||
.pipe($.if('*.css', $.minifyCss()))
|
||||
.pipe(assets.restore())
|
||||
.pipe($.useref())
|
||||
// Minify any HTML
|
||||
.pipe($.if('*.html', $.minifyHtml({
|
||||
quotes: true,
|
||||
empty: true,
|
||||
spare: true
|
||||
})))
|
||||
// Output files
|
||||
.pipe(gulp.dest(dest))
|
||||
.pipe($.size({
|
||||
title: 'html'
|
||||
}));
|
||||
return gulp.src(src)
|
||||
.pipe(assets)
|
||||
// Concatenate and minify JavaScript
|
||||
.pipe($.if('*.js', $.uglify({
|
||||
preserveComments: 'some'
|
||||
})))
|
||||
// Concatenate and minify styles
|
||||
// In case you are still using useref build blocks
|
||||
.pipe($.if('*.css', $.minifyCss()))
|
||||
.pipe(assets.restore())
|
||||
.pipe($.useref())
|
||||
// Minify any HTML
|
||||
.pipe($.if('*.html', $.minifyHtml({
|
||||
quotes: true,
|
||||
empty: true,
|
||||
spare: true
|
||||
})))
|
||||
.pipe($.if('*.html', inlinesource()))
|
||||
// Output files
|
||||
.pipe(gulp.dest(dest))
|
||||
.pipe($.size({
|
||||
title: 'html'
|
||||
}));
|
||||
};
|
||||
|
||||
// Compile and automatically prefix stylesheets
|
||||
gulp.task('styles', function() {
|
||||
return styleTask('styles', ['**/*.css']);
|
||||
return styleTask('styles', ['**/*.css']);
|
||||
});
|
||||
|
||||
gulp.task('elements', function() {
|
||||
return styleTask('elements', ['**/*.css']);
|
||||
return styleTask('elements', ['**/*.css']);
|
||||
});
|
||||
|
||||
// Ensure that we are not missing required files for the project
|
||||
// "dot" files are specifically tricky due to them being hidden on
|
||||
// some systems.
|
||||
gulp.task('ensureFiles', function(cb) {
|
||||
var requiredFiles = ['.jscsrc', '.jshintrc', '.bowerrc'];
|
||||
var requiredFiles = ['.jscsrc', '.jshintrc', '.bowerrc'];
|
||||
|
||||
ensureFiles(requiredFiles.map(function(p) {
|
||||
return path.join(__dirname, p);
|
||||
}), cb);
|
||||
ensureFiles(requiredFiles.map(function(p) {
|
||||
return path.join(__dirname, p);
|
||||
}), cb);
|
||||
});
|
||||
|
||||
// Lint JavaScript
|
||||
gulp.task('lint', ['ensureFiles'], function() {
|
||||
return gulp.src([
|
||||
'app/scripts/**/*.js',
|
||||
'app/elements/**/*.js',
|
||||
'app/elements/**/*.html',
|
||||
'gulpfile.js'
|
||||
])
|
||||
.pipe(reload({
|
||||
stream: true,
|
||||
once: true
|
||||
}))
|
||||
return gulp.src([
|
||||
'app/scripts/**/*.js',
|
||||
'app/elements/**/*.js',
|
||||
'app/elements/**/*.html',
|
||||
'gulpfile.js'
|
||||
])
|
||||
.pipe(reload({
|
||||
stream: true,
|
||||
once: true
|
||||
}))
|
||||
|
||||
// JSCS has not yet a extract option
|
||||
.pipe($.if('*.html', $.htmlExtract()))
|
||||
.pipe($.jshint())
|
||||
.pipe($.jscs())
|
||||
.pipe($.jscsStylish.combineWithHintResults())
|
||||
.pipe($.jshint.reporter('jshint-stylish'))
|
||||
.pipe($.if(!browserSync.active, $.jshint.reporter('fail')));
|
||||
// JSCS has not yet a extract option
|
||||
.pipe($.if('*.html', $.htmlExtract()))
|
||||
.pipe($.jshint())
|
||||
.pipe($.jscs())
|
||||
.pipe($.jscsStylish.combineWithHintResults())
|
||||
.pipe($.jshint.reporter('jshint-stylish'))
|
||||
.pipe($.if(!browserSync.active, $.jshint.reporter('fail')));
|
||||
});
|
||||
|
||||
// Optimize images
|
||||
gulp.task('images', function() {
|
||||
return imageOptimizeTask('app/images/**/*', dist('images'));
|
||||
return imageOptimizeTask('app/images/**/*', dist('images'));
|
||||
});
|
||||
|
||||
// Copy all files at the root level (app)
|
||||
gulp.task('copy', function() {
|
||||
var app = gulp.src([
|
||||
'app/*',
|
||||
'!app/test',
|
||||
'!app/elements',
|
||||
'!app/bower_components',
|
||||
'!app/cache-config.json'
|
||||
], {
|
||||
dot: true
|
||||
}).pipe(gulp.dest(dist()));
|
||||
var app = gulp.src([
|
||||
'app/*',
|
||||
'!app/test',
|
||||
'!app/elements',
|
||||
'!app/bower_components',
|
||||
'!app/cache-config.json'
|
||||
], {
|
||||
dot: true
|
||||
}).pipe(gulp.dest(dist()));
|
||||
|
||||
// Copy over only the bower_components we need
|
||||
// These are things which cannot be vulcanized
|
||||
var bower = gulp.src([
|
||||
'app/bower_components/{webcomponentsjs,platinum-sw,sw-toolbox,promise-polyfill}/**/*'
|
||||
]).pipe(gulp.dest(dist('bower_components')));
|
||||
// Copy over only the bower_components we need
|
||||
// These are things which cannot be vulcanized
|
||||
var bower = gulp.src([
|
||||
'app/bower_components/{webcomponentsjs,platinum-sw,sw-toolbox,promise-polyfill}/**/*'
|
||||
]).pipe(gulp.dest(dist('bower_components')));
|
||||
|
||||
return merge(app, bower)
|
||||
.pipe($.size({
|
||||
title: 'copy'
|
||||
}));
|
||||
return merge(app, bower)
|
||||
.pipe($.size({
|
||||
title: 'copy'
|
||||
}));
|
||||
});
|
||||
|
||||
// Copy web fonts to dist
|
||||
gulp.task('fonts', function() {
|
||||
return gulp.src(['app/fonts/**'])
|
||||
.pipe(gulp.dest(dist('fonts')))
|
||||
.pipe($.size({
|
||||
title: 'fonts'
|
||||
}));
|
||||
return gulp.src(['app/fonts/**'])
|
||||
.pipe(gulp.dest(dist('fonts')))
|
||||
.pipe($.size({
|
||||
title: 'fonts'
|
||||
}));
|
||||
});
|
||||
|
||||
// Scan your HTML for assets & optimize them
|
||||
gulp.task('html', function() {
|
||||
return optimizeHtmlTask(
|
||||
['app/**/*.html', '!app/{elements,test,bower_components}/**/*.html'],
|
||||
dist());
|
||||
return optimizeHtmlTask(
|
||||
['app/**/*.html', '!app/{elements,test,bower_components}/**/*.html'],
|
||||
dist());
|
||||
});
|
||||
|
||||
// Vulcanize granular configuration
|
||||
gulp.task('vulcanize', function() {
|
||||
return gulp.src('app/elements/elements.html')
|
||||
.pipe($.vulcanize({
|
||||
stripComments: true,
|
||||
inlineCss: true,
|
||||
inlineScripts: true
|
||||
}))
|
||||
.pipe(gulp.dest(dist('elements')))
|
||||
.pipe($.size({title: 'vulcanize'}));
|
||||
return gulp.src('app/elements/elements.html')
|
||||
.pipe($.vulcanize({
|
||||
stripComments: true,
|
||||
inlineCss: true,
|
||||
inlineScripts: true
|
||||
}))
|
||||
.pipe(gulp.dest(dist('elements')))
|
||||
.pipe($.size({
|
||||
title: 'vulcanize'
|
||||
}));
|
||||
});
|
||||
|
||||
// Generate config data for the <sw-precache-cache> element.
|
||||
|
|
@ -196,121 +204,123 @@ gulp.task('vulcanize', function() {
|
|||
// See https://github.com/PolymerElements/polymer-starter-kit#enable-service-worker-support
|
||||
// for more context.
|
||||
gulp.task('cache-config', function(callback) {
|
||||
var dir = dist();
|
||||
var config = {
|
||||
cacheId: packageJson.name || path.basename(__dirname),
|
||||
disabled: false
|
||||
};
|
||||
var dir = dist();
|
||||
var config = {
|
||||
cacheId: packageJson.name || path.basename(__dirname),
|
||||
disabled: false
|
||||
};
|
||||
|
||||
glob([
|
||||
'index.html',
|
||||
'./',
|
||||
'bower_components/webcomponentsjs/webcomponents-lite.min.js',
|
||||
'{elements,scripts,styles}/**/*.*'],
|
||||
{cwd: dir}, function(error, files) {
|
||||
if (error) {
|
||||
callback(error);
|
||||
} else {
|
||||
config.precache = files;
|
||||
glob([
|
||||
'index.html',
|
||||
'./',
|
||||
'bower_components/webcomponentsjs/webcomponents-lite.min.js',
|
||||
'{elements,scripts,styles}/**/*.*'
|
||||
], {
|
||||
cwd: dir
|
||||
}, function(error, files) {
|
||||
if (error) {
|
||||
callback(error);
|
||||
} else {
|
||||
config.precache = files;
|
||||
|
||||
var md5 = crypto.createHash('md5');
|
||||
md5.update(JSON.stringify(config.precache));
|
||||
config.precacheFingerprint = md5.digest('hex');
|
||||
var md5 = crypto.createHash('md5');
|
||||
md5.update(JSON.stringify(config.precache));
|
||||
config.precacheFingerprint = md5.digest('hex');
|
||||
|
||||
var configPath = path.join(dir, 'cache-config.json');
|
||||
fs.writeFile(configPath, JSON.stringify(config), callback);
|
||||
}
|
||||
});
|
||||
var configPath = path.join(dir, 'cache-config.json');
|
||||
fs.writeFile(configPath, JSON.stringify(config), callback);
|
||||
}
|
||||
});
|
||||
});
|
||||
|
||||
// Clean output directory
|
||||
gulp.task('clean', function() {
|
||||
return del(['.tmp', dist()]);
|
||||
return del(['.tmp', dist()]);
|
||||
});
|
||||
|
||||
// Watch files for changes & reload
|
||||
gulp.task('serve', [ 'styles', 'elements', 'images'], function() {
|
||||
browserSync({
|
||||
port: 5000,
|
||||
notify: false,
|
||||
logPrefix: 'PSK',
|
||||
snippetOptions: {
|
||||
rule: {
|
||||
match: '<span id="browser-sync-binding"></span>',
|
||||
fn: function(snippet) {
|
||||
return snippet;
|
||||
gulp.task('serve', ['styles', 'elements', 'images'], function() {
|
||||
browserSync({
|
||||
port: 5000,
|
||||
notify: false,
|
||||
logPrefix: 'PSK',
|
||||
ghostMode: false,
|
||||
snippetOptions: {
|
||||
rule: {
|
||||
match: '<span id="browser-sync-binding"></span>',
|
||||
fn: function(snippet) {
|
||||
return snippet;
|
||||
}
|
||||
}
|
||||
},
|
||||
// Run as an https by uncommenting 'https: true'
|
||||
// Note: this uses an unsigned certificate which on first access
|
||||
// will present a certificate warning in the browser.
|
||||
// https: true,
|
||||
server: {
|
||||
baseDir: ['.tmp', 'app'],
|
||||
middleware: [historyApiFallback()]
|
||||
}
|
||||
}
|
||||
},
|
||||
// Run as an https by uncommenting 'https: true'
|
||||
// Note: this uses an unsigned certificate which on first access
|
||||
// will present a certificate warning in the browser.
|
||||
// https: true,
|
||||
server: {
|
||||
baseDir: ['.tmp', 'app'],
|
||||
middleware: [historyApiFallback()]
|
||||
}
|
||||
});
|
||||
});
|
||||
|
||||
gulp.watch(['app/**/*.html'], reload);
|
||||
gulp.watch(['app/styles/**/*.css'], ['styles', reload]);
|
||||
gulp.watch(['app/elements/**/*.css'], ['elements', reload]);
|
||||
gulp.watch(['app/{scripts,elements}/**/{*.js,*.html}'], ['lint']);
|
||||
gulp.watch(['app/images/**/*'], reload);
|
||||
gulp.watch(['app/**/*.html'], reload);
|
||||
gulp.watch(['app/styles/**/*.css'], ['styles', reload]);
|
||||
gulp.watch(['app/elements/**/*.css'], ['elements', reload]);
|
||||
gulp.watch(['app/{scripts,elements}/**/{*.js,*.html}'], ['lint']);
|
||||
gulp.watch(['app/images/**/*'], reload);
|
||||
});
|
||||
|
||||
// Build and serve the output from the dist build
|
||||
gulp.task('serve:dist', ['default'], function() {
|
||||
browserSync({
|
||||
port: 5001,
|
||||
notify: false,
|
||||
logPrefix: 'PSK',
|
||||
snippetOptions: {
|
||||
rule: {
|
||||
match: '<span id="browser-sync-binding"></span>',
|
||||
fn: function(snippet) {
|
||||
return snippet;
|
||||
}
|
||||
}
|
||||
},
|
||||
// Run as an https by uncommenting 'https: true'
|
||||
// Note: this uses an unsigned certificate which on first access
|
||||
// will present a certificate warning in the browser.
|
||||
// https: true,
|
||||
server: dist(),
|
||||
middleware: [historyApiFallback()]
|
||||
});
|
||||
browserSync({
|
||||
port: 5001,
|
||||
notify: false,
|
||||
logPrefix: 'PSK',
|
||||
snippetOptions: {
|
||||
rule: {
|
||||
match: '<span id="browser-sync-binding"></span>',
|
||||
fn: function(snippet) {
|
||||
return snippet;
|
||||
}
|
||||
}
|
||||
},
|
||||
// Run as an https by uncommenting 'https: true'
|
||||
// Note: this uses an unsigned certificate which on first access
|
||||
// will present a certificate warning in the browser.
|
||||
// https: true,
|
||||
server: dist(),
|
||||
middleware: [historyApiFallback()]
|
||||
});
|
||||
});
|
||||
|
||||
// Build production files, the default task
|
||||
gulp.task('default', ['clean'], function(cb) {
|
||||
// Uncomment 'cache-config' if you are going to use service workers.
|
||||
runSequence(
|
||||
['copy', 'styles'],
|
||||
'elements',
|
||||
['lint', 'images', 'fonts', 'html'],
|
||||
'vulcanize', // 'cache-config',
|
||||
cb);
|
||||
// Uncomment 'cache-config' if you are going to use service workers.
|
||||
runSequence(
|
||||
['copy', 'styles'],
|
||||
'elements', ['images', 'fonts', 'html'], //'lint',
|
||||
'vulcanize', 'cache-config',
|
||||
cb);
|
||||
});
|
||||
|
||||
// Build then deploy to GitHub pages gh-pages branch
|
||||
gulp.task('build-deploy-gh-pages', function(cb) {
|
||||
runSequence(
|
||||
'default',
|
||||
'deploy-gh-pages',
|
||||
cb);
|
||||
runSequence(
|
||||
'default',
|
||||
'deploy-gh-pages',
|
||||
cb);
|
||||
});
|
||||
|
||||
// Deploy to GitHub pages gh-pages branch
|
||||
gulp.task('deploy-gh-pages', function() {
|
||||
return gulp.src(dist('**/*'))
|
||||
// Check if running task from Travis CI, if so run using GH_TOKEN
|
||||
// otherwise run using ghPages defaults.
|
||||
.pipe($.if(process.env.TRAVIS === 'true', $.ghPages({
|
||||
remoteUrl: 'https://$GH_TOKEN@github.com/polymerelements/polymer-starter-kit.git',
|
||||
silent: true,
|
||||
branch: 'gh-pages'
|
||||
}), $.ghPages()));
|
||||
return gulp.src(dist('**/*'))
|
||||
// Check if running task from Travis CI, if so run using GH_TOKEN
|
||||
// otherwise run using ghPages defaults.
|
||||
.pipe($.if(process.env.TRAVIS === 'true', $.ghPages({
|
||||
remoteUrl: 'https://$GH_TOKEN@github.com/polymerelements/polymer-starter-kit.git',
|
||||
silent: true,
|
||||
branch: 'gh-pages'
|
||||
}), $.ghPages()));
|
||||
});
|
||||
|
||||
// Load tasks for web-component-tester
|
||||
|
|
@ -319,5 +329,5 @@ require('web-component-tester').gulp.init(gulp);
|
|||
|
||||
// Load custom tasks from the `tasks` directory
|
||||
try {
|
||||
require('require-dir')('tasks');
|
||||
require('require-dir')('tasks');
|
||||
} catch (err) {}
|
||||
|
|
|
|||
Loading…
Add table
Add a link
Reference in a new issue