cinco/glitch-images
1
0
Fork 0
Code Issues Pull Requests Releases Wiki Activity

Merge pull request #20 from snorpey/npm-scripts

Browse Source 
add npm script support
This commit is contained in:
georg fischer 2016-08-30 21:50:26 +02:00 committed by GitHub
commit f77b131ee9
4 changed files with 92 additions and 59 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

80
build/Gruntfile.js → Gruntfile.js
View File

@ -10,9 +10,9 @@ module.exports = function( grunt ) {
options: { options: {
name: 'lib/almond', name: 'lib/almond',
include: 'glitcher', include: 'glitcher',
baseUrl: '../scripts/', baseUrl: 'scripts/',
mainConfigFile: '../scripts/glitcher.js', mainConfigFile: 'scripts/glitcher.js',
out: '../production/glitcher.min.js', out: 'production/glitcher.min.js',
wrap: true wrap: true
} }
} }
@ -22,7 +22,7 @@ module.exports = function( grunt ) {
cssmin: { cssmin: {
production: { production: {
files: { files: {
'../production/glitcher.min.css': [ '../styles/glitcher.css' ] 'production/glitcher.min.css': [ 'styles/glitcher.css' ]
} }
} }
}, },
@ -37,14 +37,14 @@ module.exports = function( grunt ) {
}, },
files: [ { files: [ {
expand: true, expand: true,
cwd: '../', cwd: './',
src: 'images/icon/*.svg', src: 'images/icon/*.svg',
dest: '../production/' dest: 'production/'
}, { }, {
expand: true, expand: true,
cwd: '../', cwd: './',
src: 'images/logos/*.svg', src: 'images/logos/*.svg',
dest: '../production/' dest: 'production/'
} ] } ]
} }
}, },
@ -68,17 +68,17 @@ module.exports = function( grunt ) {
}, },
production: { production: {
files: [ files: [
{ src: '../serviceworker.js', dest: '../production/serviceworker.min.js' }, { src: 'serviceworker.js', dest: 'production/serviceworker.min.js' },
{ src: '../scripts/workers/glitchworker.js', dest: '../production/glitchworker.min.js' }, { src: 'scripts/workers/glitchworker.js', dest: 'production/glitchworker.min.js' },
{ src: [ { src: [
'../scripts/lib/localforage.nopromises.js', 'scripts/lib/localforage.nopromises.js',
'../scripts/lib/md5.js', 'scripts/lib/md5.js',
'../scripts/workers/storageworker.js' 'scripts/workers/storageworker.js'
], dest: '../production/storageworker.min.js' }, ], dest: 'production/storageworker.min.js' },
{ src: [ { src: [
'../scripts/lib/localforage.nopromises.js', 'scripts/lib/localforage.nopromises.js',
'../scripts/workers/settingsworker.js' 'scripts/workers/settingsworker.js'
], dest: '../production/settingsworker.min.js' } ], dest: 'production/settingsworker.min.js' }
] ]
} }
}, },
@ -88,39 +88,39 @@ module.exports = function( grunt ) {
productionTextBasedFiles: { productionTextBasedFiles: {
options: { processContent: updateContent }, options: { processContent: updateContent },
files: [ files: [
{ src: '../index.html', dest: '../production/index.html' }, { src: 'index.html', dest: 'production/index.html' },
{ src: '../manifest.json', dest: '../production/manifest.json' }, { src: 'manifest.json', dest: 'production/manifest.json' },
{ src: '../.gitignore', dest: '../production/.gitignore' }, { src: '.gitignore', dest: 'production/.gitignore' },
{ src: '../LICENSE', dest: '../production/LICENSE' }, { src: 'LICENSE', dest: 'production/LICENSE' },
{ {
expand: true, expand: true,
cwd: '../', cwd: './',
src: [ 'lang/*.json' ], src: [ 'lang/*.json' ],
dest: '../production/' dest: 'production/'
}, },
// copying these files 'in place' to apply updateContent function // copying these files 'in place' to apply updateContent function
// that updates some of the paths in the minified files // that updates some of the paths in the minified files
{ src: '../production/glitcher.min.js', dest: '../production/glitcher.min.js' }, { src: 'production/glitcher.min.js', dest: 'production/glitcher.min.js' },
{ src: '../production/serviceworker.min.js', dest: '../production/serviceworker.min.js' }, { src: 'production/serviceworker.min.js', dest: 'production/serviceworker.min.js' },
{ src: '../production/storageworker.min.js', dest: '../production/storageworker.min.js' }, { src: 'production/storageworker.min.js', dest: 'production/storageworker.min.js' },
{ src: '../production/settingsworker.min.js', dest: '../production/settingsworker.min.js' }, { src: 'production/settingsworker.min.js', dest: 'production/settingsworker.min.js' },
{ src: '../production/glitcher.min.css', dest: '../production/glitcher.min.css' } { src: 'production/glitcher.min.css', dest: 'production/glitcher.min.css' }
] ]
}, },
productionBinaryFiles: { productionBinaryFiles: {
files: [ { files: [ {
expand: true, expand: true,
cwd: '../', cwd: './',
src: [ 'images/*.jpg' ], src: [ 'images/*.jpg' ],
dest: '../production/' dest: 'production/'
}, { }, {
expand: true, expand: true,
cwd: '../', cwd: './',
src: [ 'images/logos/*.png' ], src: [ 'images/logos/*.png' ],
dest: '../production/' dest: 'production/'
}, },
{ src: '../favicon.ico', dest: '../production/favicon.ico' } ] { src: 'favicon.ico', dest: 'production/favicon.ico' } ]
} }
}, },
@ -151,7 +151,7 @@ module.exports = function( grunt ) {
removeScriptTypeAttributes: true removeScriptTypeAttributes: true
}, },
files: [ { files: [ {
src: '../production/index.html', dest: '../production/index.html' src: 'production/index.html', dest: 'production/index.html'
} ] } ]
} }
}, },
@ -159,7 +159,7 @@ module.exports = function( grunt ) {
// replace javscript and css paths when copying files // replace javscript and css paths when copying files
function updateContent ( content, path ) { function updateContent ( content, path ) {
if ( path === '../index.html' ) { if ( path === 'index.html' ) {
content = content content = content
.replace( 'styles/glitcher.css', 'glitcher.min.css' ) .replace( 'styles/glitcher.css', 'glitcher.min.css' )
.replace( 'scripts/lib/require.js', 'glitcher.min.js' ) .replace( 'scripts/lib/require.js', 'glitcher.min.js' )
@ -167,14 +167,14 @@ module.exports = function( grunt ) {
.replace( "scriptEl.setAttribute( 'data-main', 'scripts/glitcher.js' );", '' ); .replace( "scriptEl.setAttribute( 'data-main', 'scripts/glitcher.js' );", '' );
} }
if ( path === '../production/glitcher.min.js' ) { if ( path === 'production/glitcher.min.js' ) {
content = content content = content
.replace( 'scripts/workers/glitchworker.js', 'glitchworker.min.js' ) .replace( 'scripts/workers/glitchworker.js', 'glitchworker.min.js' )
.replace( 'scripts/workers/storageworker.js', 'storageworker.min.js' ) .replace( 'scripts/workers/storageworker.js', 'storageworker.min.js' )
.replace( 'scripts/workers/settingsworker.js', 'settingsworker.min.js' ); .replace( 'scripts/workers/settingsworker.js', 'settingsworker.min.js' );
} }
if ( path === '../production/serviceworker.min.js' ) { if ( path === 'production/serviceworker.min.js' ) {
content = content content = content
.replace( /v\d+(.?\d*)+::/g, 'b' + Date.now() + '::' ) // 'v1.0.1::'' -> 'b{timestamp}' .replace( /v\d+(.?\d*)+::/g, 'b' + Date.now() + '::' ) // 'v1.0.1::'' -> 'b{timestamp}'
.replace( 'styles/glitcher.css', 'glitcher.min.css' ) .replace( 'styles/glitcher.css', 'glitcher.min.css' )
@ -184,15 +184,15 @@ module.exports = function( grunt ) {
.replace( 'scripts/workers/settingsworker.js', 'settingsworker.min.js' ); .replace( 'scripts/workers/settingsworker.js', 'settingsworker.min.js' );
} }
if ( path === '../production/storageworker.min.js' || '../production/settingsworker.min.js' ) { if ( path === 'production/storageworker.min.js' || 'production/settingsworker.min.js' ) {
content = content.replace( /,importScripts\(.*\),/, ',' ); // replaces importScripts content = content.replace( /,importScripts\(.*\),/, ',' ); // replaces importScripts
} }
if ( path === '../production/glitcher.min.css' ) { if ( path === 'production/glitcher.min.css' ) {
content = content.replace( /\.\.\/images\//gi, 'images/' ); // replaces importScripts content = content.replace( /\.\.\/images\//gi, 'images/' ); // replaces importScripts
} }
if ( path === '../manifest.json' ) { if ( path === 'manifest.json' ) {
content = content.replace( 'serviceworker.js', 'serviceworker.min.js' ); content = content.replace( 'serviceworker.js', 'serviceworker.min.js' );
} }

21
README.md
View File

@ -16,8 +16,8 @@ if you're a developer and just interested in the code for the glitch effect, the
third party code used in this experiment third party code used in this experiment
--- ---
* [localforage](https://github.com/mozilla/localForage) by [mozilla](https://github.com/mozilla), Apache License 2.0 * [localforage](https://github.com/mozilla/localForage) by [mozilla](https://github.com/mozilla), Apache License 2.0
* [requirejs](http://requirejs.org/), by [jrburke](jrburke), BSD & MIT license * [requirejs](http://requirejs.org/), by [jrburke](https://github.com/jrburke), BSD & MIT license
* [almond](https://github.com/jrburke/almond), by [jrburke](jrburke), BSD & MIT license * [almond](https://github.com/jrburke/almond), by [jrburke](https://github.com/jrburke), BSD & MIT license
* [javascript-md5](https://blueimp.github.io/JavaScript-MD5/), by [blueimp](https://github.com/blueimp), MIT license * [javascript-md5](https://blueimp.github.io/JavaScript-MD5/), by [blueimp](https://github.com/blueimp), MIT license
* [reqwest](https://github.com/ded/reqwest/), by [ded](https://github.com/ded), MIT license * [reqwest](https://github.com/ded/reqwest/), by [ded](https://github.com/ded), MIT license
* [glitch-canvas](https://github.com/snorpey/glitch-canvas/), by [snorpey](https://github.com/snorpey), MIT license * [glitch-canvas](https://github.com/snorpey/glitch-canvas/), by [snorpey](https://github.com/snorpey), MIT license
@ -45,8 +45,19 @@ build script
--- ---
the build script takes care of concatenating and minifying all scripts and styles. it uses [gruntjs](http://gruntjs.com/). the build script takes care of concatenating and minifying all scripts and styles. it uses [gruntjs](http://gruntjs.com/).
please make sure that both [nodejs](http://nodejs.org/) and grunt-cli are [set up properly](http://gruntjs.com/getting-started) on your machine. please make sure that both [nodejs](http://nodejs.org/) and [npm](http://npmjs.com) are set up properly] on your machine.
run ```npm install``` from within the ```build/``` folder to install the dependencies of the build script. run ```npm install``` to install the dependencies of the build script.
to build, run ```npm run build``` the optimized files will get copied to the ```production/``` folder.
missing somehing?
---
found a bug? missing a feature? instructions unclear? are you using this tool in an interesting project? maybe have a look at the [issues](../../issues), open a pull request and let me know. thanks!
most importantly
---
thank you for taking a look at this repo. have a great day :)
to build, run ```grunt production``` from within the ```build/``` folder. the optimized files will get copied to the ```production/``` folder.

14
build/package.json
View File

@ -1,14 +0,0 @@
{
"name": "distort-grid-build",
"version": "0.0.1",
"devDependencies": {
"grunt": "~0.4.1",
"grunt-contrib-copy": "~0.4.1",
"grunt-contrib-cssmin": "~0.6.1",
"grunt-contrib-htmlmin": "~0.6.0",
"grunt-contrib-imagemin": "~0.3.0",
"grunt-contrib-requirejs": "~0.4.1",
"grunt-contrib-uglify": "^0.11.0",
"grunt-svgmin": "^3.1.0"
}
}

36
package.json Normal file
View File

@ -0,0 +1,36 @@
{
"name": "jpg-glitch",
"version": "1.0.1",
"devDependencies": {
"grunt": "^1.0.1",
"grunt-contrib-copy": "^1.0.0",
"grunt-contrib-cssmin": "^1.0.1",
"grunt-contrib-htmlmin": "^2.0.0",
"grunt-contrib-imagemin": "^1.0.1",
"grunt-contrib-requirejs": "^1.0.0",
"grunt-contrib-uglify": "^2.0.0",
"grunt-svgmin": "^3.3.0"
},
"scripts": {
"build": "grunt"
},
"description": "glitch images with jpg encoding",
"repository": {
"type": "git",
"url": "git+https://github.com/snorpey/jpg-glitch.git"
},
"keywords": [
"glitch",
"jpg",
"image manipulation",
"image processing",
"image",
"jpeg"
],
"author": "georg fischer",
"license": "MIT",
"bugs": {
"url": "https://github.com/snorpey/jpg-glitch/issues"
},
"homepage": "http://snorpey.github.io/jpg-glitch/"
}