diff options
| author | jules <jules@okfoc.us> | 2013-12-13 15:28:31 -0500 |
|---|---|---|
| committer | jules <jules@okfoc.us> | 2013-12-13 15:28:31 -0500 |
| commit | 346f3a9817b1e0812565396b9811a1ce5adc97b8 (patch) | |
| tree | 47944eb9a2762ef2036d140430a69be5afa9f368 /canvasquery.dither.js | |
| parent | 96fd8423cc0793d47cab9117b0167fe19041cdea (diff) | |
reorganize
Diffstat (limited to 'canvasquery.dither.js')
| -rw-r--r-- | canvasquery.dither.js | 217 |
1 files changed, 0 insertions, 217 deletions
diff --git a/canvasquery.dither.js b/canvasquery.dither.js deleted file mode 100644 index a76ad12..0000000 --- a/canvasquery.dither.js +++ /dev/null @@ -1,217 +0,0 @@ -var patterns = {} -patterns[2] = [ 0, 2, - 3, 1 ] - -patterns[3] = [ 0, 5, 3, - 8, 1, 6, - 4, 7, 2, ] - -patterns[4] = [ 0, 8, 2, 10, - 6, 14, 4, 12, - 3, 11, 1, 9, - 5, 13, 7, 15 ] - -CanvasQuery.Wrapper.prototype.threshold = function(factor) { - var bitmap = this.context.getImageData(0, 0, this.canvas.width, this.canvas.height) - var bitmapData = bitmap.data - - var width = this.canvas.width - var height = this.canvas.height - - if (factor < 1) factor *= 255 - - for (var i = 0; i < height; i++) { - for (var j = 0; j < width; j++) { - var a = 4 * (i*width + j) - var val = (bitmapData[a] + bitmapData[a+1] + bitmapData[a+2]) / 3 - var lum = val > factor ? 255 : 0 - bitmapData[a] = bitmapData[a+1] = bitmapData[a+2] = lum - } - } - this.context.putImageData(bitmap, 0, 0); - return this; -} - -CanvasQuery.Wrapper.prototype.randomDither = function() { - var bitmap = this.context.getImageData(0, 0, this.canvas.width, this.canvas.height) - var bitmapData = bitmap.data - - var width = this.canvas.width - var height = this.canvas.height - - for (var i = 0; i < height; i++) { - for (var j = 0; j < width; j++) { - var a = 4 * (i*width + j) - var val = (bitmapData[a] + bitmapData[a+1] + bitmapData[a+2]) / (3*255) - var lum = val > Math.random() ? 255 : 0 - bitmapData[a] = bitmapData[a+1] = bitmapData[a+2] = lum - } - } - this.context.putImageData(bitmap, 0, 0); - return this; -} - -CanvasQuery.Wrapper.prototype.pattern2Dither = function() { - this.patternDither(2) -} -CanvasQuery.Wrapper.prototype.pattern3Dither = function() { - this.patternDither(3) -} -CanvasQuery.Wrapper.prototype.pattern4Dither = function() { - this.patternDither(4) -} -CanvasQuery.Wrapper.prototype.patternDither = function(n) { - var bitmap = this.context.getImageData(0, 0, this.canvas.width, this.canvas.height) - var bitmapData = bitmap.data - - var width = this.canvas.width - var height = this.canvas.height - - var pat = patterns[n] - var len = pat.length - 1 - - for (var i = 0; i < height; i++) { - for (var j = 0; j < width; j++) { - var p = ((i % n) * n) + (j % n) - var a = 4 * (i*width + j) - var val = (bitmapData[a] + bitmapData[a+1] + bitmapData[a+2]) / (3*255) - var lum = val > pat[p]/len ? 255 : 0 - bitmapData[a] = bitmapData[a+1] = bitmapData[a+2] = lum - } - } - this.context.putImageData(bitmap, 0, 0); - return this; -} - -CanvasQuery.Wrapper.prototype.pattern2LiteDither = function() { - this.patternLiteDither(2) -} -CanvasQuery.Wrapper.prototype.pattern3LiteDither = function() { - this.patternLiteDither(3) -} -CanvasQuery.Wrapper.prototype.pattern4LiteDither = function() { - this.patternLiteDither(4) -} -CanvasQuery.Wrapper.prototype.patternLiteDither = function(n) { - var bitmap = this.context.getImageData(0, 0, this.canvas.width, this.canvas.height) - var bitmapData = bitmap.data - - var width = this.canvas.width - var height = this.canvas.height - - var pat = patterns[n] - var len = pat.length - - for (var i = 0; i < height; i++) { - for (var j = 0; j < width; j++) { - var p = ((i % n) * n) + (j % n) - var a = 4 * (i*width + j) - var val = (bitmapData[a] + bitmapData[a+1] + bitmapData[a+2]) / (3*255) - var lum = val > pat[p]/len ? 255 : 0 - bitmapData[a] = bitmapData[a+1] = bitmapData[a+2] = lum - } - } - this.context.putImageData(bitmap, 0, 0); - return this; -} - -CanvasQuery.Wrapper.prototype.floydSteinbergDither = function(n) { - var bitmap = this.context.getImageData(0, 0, this.canvas.width, this.canvas.height) - var bitmapData = bitmap.data - - var mask = this.grayscaleToMask() - - var width = this.canvas.width - var height = this.canvas.height - - for (var y = 0; y < height; y++) { - for (var x = 0; x < width; x++) { - var p = (y*width + x) - var a = 4 * p - var val = mask[p] - var lum = val > 127 ? 255 : 0 - var error = val - lum - if (x < width-1) - mask[ (y*width) + x+1 ] += 7/16 * error - if (y < height-1 && x > 0) - mask[ ((y+1)*width) + x-1 ] += 5/16 * error - if (y < height-1) - mask[ ((y+1)*width) + x ] += 3/16 * error - if (y < height-1 && x < width-1) - mask[ ((y+1)*width) + x+1 ] += 1/16 * error - bitmapData[a] = bitmapData[a+1] = bitmapData[a+2] = lum - } - } - this.context.putImageData(bitmap, 0, 0); - return this; -} - -CanvasQuery.Wrapper.prototype.rightDither = function(n) { - var bitmap = this.context.getImageData(0, 0, this.canvas.width, this.canvas.height) - var bitmapData = bitmap.data - - var mask = this.grayscaleToMask() - - var width = this.canvas.width - var height = this.canvas.height - - for (var y = 0; y < height; y++) { - for (var x = 0; x < width; x++) { - var p = (y*width + x) - var a = 4 * p - var val = mask[p] - var lum = val > 127 ? 255 : 0 - var error = val - lum - if (x < width-1) - mask[ (y*width) + x+1 ] += 7/16 * error - bitmapData[a] = bitmapData[a+1] = bitmapData[a+2] = lum - } - } - this.context.putImageData(bitmap, 0, 0); - return this; -} - -CanvasQuery.Wrapper.prototype.halftone = function(radius, angle) { - var mask = this.grayscaleToMask() - - this.fillStyle("#fff") - this.fillRect(0, 0, this.canvas.width, this.canvas.height) - - var diameter = radius*2 - var TWO_PI = Math.PI*2 - - var angle = angle / 180 * Math.PI - - var cos = Math.cos(angle) - var sin = Math.sin(angle) - - var xstep = cos * radius - var ystep = sin * radius - - var w = this.canvas.width - var h = this.canvas.height - - this.fillStyle("#000") - - for (var i = -w; i < w; i++) { - for (var j = -h; j < h; j++) { - var x = i * ystep - j * xstep - var y = i * xstep + j * ystep - if (x > -diameter && y > -diameter && x < w+diameter && y < h+diameter) { - circle(this,x,y) - } - } - } - - function circle(cq,x,y) { - var xx = x < 0 ? 0 : x > w ? w - 1 : x; - var yy = y < 0 ? 0 : y > h ? h - 1 : y; - var r = (1 - Math.pow( mask[ ~~(~~yy*w+(xx)) ] / 255, Math.E/4 )) * radius - cq.beginPath() - .arc(x,y,r,0,TWO_PI) - .closePath() - .fill(); - } - return this; -} - |
