From 9f0938e98e329d26f06714a1e4937a4ec7e862ba Mon Sep 17 00:00:00 2001 From: Jules Date: Sat, 29 Nov 2014 00:55:52 -0500 Subject: colorcode stuff?? --- image.html | 45 ++++++++++++++++++++++++++++++---------- js/color_code.js | 63 +++++++++++++++++++++++++++++++++++++++++++++----------- 2 files changed, 85 insertions(+), 23 deletions(-) diff --git a/image.html b/image.html index 5729d60..0ddae0a 100644 --- a/image.html +++ b/image.html @@ -1,23 +1,47 @@

+
width x +
+ratio +nearest neighbor

+ diff --git a/js/color_code.js b/js/color_code.js index f16e91c..55a284f 100644 --- a/js/color_code.js +++ b/js/color_code.js @@ -42,7 +42,6 @@ var MircColor = (function(){ pixel = new Array (4), data = pixels.data, t - console.log(pixels) for (var i = 0, h = pixels.height; i < h; i++) { var row = [] rows.push(row) @@ -55,27 +54,66 @@ var MircColor = (function(){ row[j] = closest_to(pixel) } } - console.log(rows) if (! cb) return rows else cb (rows) } - function fromUrl (url, cb, width) { - var img = new Image () + + function neighbor (canvas, ctx, img) { + var scratch = document.createElement("canvas") + var scratchCtx = scratch.getContext('2d') + scratch.width = img.naturalWidth + scratch.height = img.naturalHeight + scratchCtx.drawImage(img, 0, 0, img.naturalWidth, img.naturalHeight) + var srcImageData = scratchCtx.getImageData(0,0,scratch.width,scratch.height) + var destImageData = ctx.createImageData(canvas.width,canvas.height) + var src = srcImageData.data, dest = destImageData.data + var dt, dw = destImageData.width, dh = destImageData.height + var st, sw = srcImageData.width, sh = srcImageData.height + for (var i = 0; i < dh; i++) { + for (var j = 0; j < dw; j++) { + var y = i * sh/dh + var x = j * sw/dw + dt = ((i*dw) + j) * 4 + st = Math.floor( Math.floor(y)*sw + x ) * 4 + dest[dt] = src[st] + dest[dt+1] = src[st+1] + dest[dt+2] = src[st+2] + dest[dt+3] = src[st+3] + } + } + + return destImageData + } + var img = new Image () + function fromUrl (url, cb, opt) { img.onload = function(){ - var canvas = document.createElement("canvas"), ctx = canvas.getContext('2d') - if (width) { - canvas.width = width - canvas.height = img.naturalHeight * width / img.naturalWidth / 2 + var canvas = document.createElement("canvas"), ctx = canvas.getContext('2d'), pixels + if (opt.width) { + canvas.width = opt.width + if (opt.height) { + canvas.height = opt.height + } else if (opt.ratio) { + canvas.height = opt.width / opt.ratio + } else { + canvas.height = (img.naturalHeight * width / img.naturalWidth) / 2 + } } else { canvas.width = img.naturalWidth * 2 canvas.height = img.naturalHeight } - ctx.drawImage(img,0,0,img.naturalWidth,img.naturalHeight,0,0,canvas.width,canvas.height) - var pixels = ctx.getImageData(0,0,canvas.width,canvas.height) + if (opt.neighbor) { + pixels = neighbor(canvas, ctx, img) + } + else { + ctx.drawImage(img,0,0,img.naturalWidth,img.naturalHeight,0,0,canvas.width,canvas.height) + pixels = ctx.getImageData(0,0,canvas.width,canvas.height) + } fromImageData(pixels, cb) } + if (img.src == url) { return img.onload() } img.src = url + if (img.complete) { return img.onload() } } function ascii (rows) { var lines = rows.map(function(str){ @@ -84,12 +122,12 @@ var MircColor = (function(){ var txt = '/exec -out printf "' + lines + '"\n' return txt } - function asciiFromUrl (url, cb, width) { + function asciiFromUrl (url, cb, opt) { fromUrl(url, function(rows){ cb(ascii(rows), rows) }, width) } - function stringFromUrl (url, cb, width) { + function stringFromUrl (url, cb, opt) { fromUrl(url, function(rows){ cb(rows.map(function(str){ return str.map(function(index){ return "\C-c" + index + "," + index + "x\C-c" }).join("") @@ -106,6 +144,7 @@ var MircColor = (function(){ stringFromUrl: stringFromUrl, asciiFromUrl: asciiFromUrl, ascii: ascii, + neighbor: neighbor, } })() -- cgit v1.2.3-70-g09d2