<commit_before>glitch-canvas
=============

what is it?
-----------
glitch-canvas is a javascript library for applying a glitch effect (see this
[example](http://i.imgur.com/jU1hiYl.png)) to a canvas element.

how to use it
-------------
glitch-canvas is designed to be used in web browsers (see
[Requirements](#requirements) for more information).

the library is used like this:

	glitch(image_data, parameters, callback);

_imagedata_ **image_data** (required): is an ImageData object as required by [canvas.getImageData()](https://developer.mozilla.org/en/docs/Web/API/CanvasRenderingContext2D#getImageData()).

_object_ **parameters** (required): object containing the parameters for the glitch effect. you can check out my [jpg-glitch](http://snorpey.github.io/jpg-glitch/)
experiment to get a better understanding of the values. The following parameters are accepted:

```javascript
	{
		seed:       25, // number between 0 and 99
		quality:    30, // number between 0 and 99
		amount:     35, // number between 0 and 99
		iterations: 20  // number
	}
```

_function_ **callback** (required): callback function that gets passed a glitched
imagedata object as argument.

simple example
--------------
```javascript
	// assuming there's a loaded image and a canvas element in the DOM.
	var my_image = document.getElementById('my-image');
	var my_canvas = document.getElementById('my-canvas');
	var ctx = my_canvas.getContext('2d');
	
	// draw the image on the canvas
	ctx.drawImage(my_image, my_image);

	var my_image_data = ctx.getImageData( 0, 0, my_canvas.clientWidth, my_canvas.clientHeight );
	var parameters = { amount: 10, seed: 45, iterations: 30, quality: 30 };
	
	function drawGlitchedImageData(image_data) {
		ctx.putImageData(image_data, 0, 0);
	}
	
	glitch(my_image_data, parameters, drawGlitchedImageData);
```

there are more detailed examples available in the ```./example/``` folder.

loading
-------
the library supports loading as an [amd module](https://en.wikipedia.org/wiki/Asynchronous_module_definition)
with [requirejs](http://requirejs.org).

requirements
------------
the following browser features are required for the library to work:

* canvas support (including canvas.toDataURL method)
* Array.prototype.forEach

the library does __not__ check if those features are actually supported in the browser.

build script
------------
the build script takes care of minifying the scripts files. 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. run ```npm install``` from within the ```./build/``` folder to install the dependencies of the build script.

to build, run ```grunt``` from within the ```./build/``` folder. the optimized files will get copied to the ```dist/``` folder.

tests
-----
before you run the tests, make sure you have [nodejs](http://nodejs.org) (with NPM) installed on your machine. open the ```./test/``` folder in your terminal and install the dependencies with ```npm install```.

to run the tests, run ```mocha-phantomjs tester.html``` from the ```./test/``` folder.

License
-------
[MIT](LICENSE)<commit_msg>fix a small typo<commit_after>glitch-canvas
=============

what is it?
-----------
glitch-canvas is a javascript library for applying a glitch effect (see this
[example](http://i.imgur.com/jU1hiYl.png)) to a canvas element.

how to use it
-------------
glitch-canvas is designed to be used in web browsers (see
[Requirements](#requirements) for more information).

the library is used like this:

	glitch(image_data, parameters, callback);

_imagedata_ **image_data** (required): is an ImageData object as required by [canvas.getImageData()](https://developer.mozilla.org/en/docs/Web/API/CanvasRenderingContext2D#getImageData()).

_object_ **parameters** (required): object containing the parameters for the glitch effect. you can check out my [jpg-glitch](http://snorpey.github.io/jpg-glitch/)
experiment to get a better understanding of the values. The following parameters are accepted:

```javascript
	{
		seed:       25, // number between 0 and 99
		quality:    30, // number between 0 and 99
		amount:     35, // number between 0 and 99
		iterations: 20  // number
	}
```

_function_ **callback** (required): callback function that gets passed a glitched
imagedata object as argument.

simple example
--------------
```javascript
	// assuming there's a loaded image and a canvas element in the DOM.
	var my_image = document.getElementById('my-image');
	var my_canvas = document.getElementById('my-canvas');
	var ctx = my_canvas.getContext('2d');
	
	// draw the image on the canvas
	ctx.drawImage(my_image, my_image);

	var my_image_data = ctx.getImageData( 0, 0, my_canvas.clientWidth, my_canvas.clientHeight );
	var parameters = { amount: 10, seed: 45, iterations: 30, quality: 30 };
	
	function drawGlitchedImageData(image_data) {
		ctx.putImageData(image_data, 0, 0);
	}
	
	glitch(my_image_data, parameters, drawGlitchedImageData);
```

there are more detailed examples available in the ```./example/``` folder.

loading
-------
the library supports loading as an [amd module](https://en.wikipedia.org/wiki/Asynchronous_module_definition)
with [requirejs](http://requirejs.org).

requirements
------------
the following browser features are required for the library to work:

* canvas support (including canvas.toDataURL method)
* Array.prototype.forEach

the library does __not__ check if those features are actually supported in the browser.

build script
------------
the build script takes care of minifying the scripts files. 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. run ```npm install``` from within the ```./build/``` folder to install the dependencies of the build script.

to build, run ```grunt``` from within the ```./build/``` folder. the optimized files will get copied to the ```./dist/``` folder.

tests
-----
before you run the tests, make sure you have [nodejs](http://nodejs.org) (with NPM) installed on your machine. open the ```./test/``` folder in your terminal and install the dependencies with ```npm install```.

to run the tests, run ```mocha-phantomjs tester.html``` from the ```./test/``` folder.

License
-------
[MIT](LICENSE)
{'fraction_non_alphanumeric': 0.14065180102915953, 'fraction_numerical': 0.009979728676126618, 'mean_word_length': 3.9953271028037385, 'pattern_counts': {'":': 0, '<': 3, '<?xml version=': 0, '>': 3, 'https://': 4, 'lorem ipsum': 0, 'www.': 0, 'xml': 0}, 'pii_count': 0, 'substrings_counts': 0, 'word_list_counts': {'cursed_substrings.json': 0, 'profanity_word_list.json': 0, 'sexual_word_list.json': 0, 'zh_pornsignals.json': 0}}
{'dir': 'git-commits-cleaned', 'id': '3970564', 'n_tokens_mistral': 1930, 'n_tokens_neox': 1812, 'n_words': 698}