Skip to content

Instantly share code, notes, and snippets.

@vorlovsky
Created October 13, 2016 12:29
Show Gist options
  • Save vorlovsky/70a3675ae25b341ad1a48de85ff48264 to your computer and use it in GitHub Desktop.
Save vorlovsky/70a3675ae25b341ad1a48de85ff48264 to your computer and use it in GitHub Desktop.
// width - image width
// height - image height
// input - two-dimentional array of RGBA pixels of original image
// output - two-dimentional array of RGBA pixels of processed image
// Both are initialized with the same image
// channel - R, G, or B channel to copy (shifted) in output image
// copyChannelPoint(x, y) - pseudopoint, specifying where to place (top left corener) shifted channel data from on output image
// copyPixelsData - pseudostrust, specifying areas of input image to be copied (shifted) to output:
// y - top coord f the rect to copy (x == 0)
// height - height of the rect to copy (width == 780)
// shiftX - left coord of the point to place rect to (use y for top), all the pixels that shifts out of the limits will wrap to the opposite end of the row
// Number of copyPixelsData may vary.
function glitch(channel, copyChannelPoint.x, copyChannelPoint.y, [copyPixelsData0.y, copyPixelsData0.height, copyPixelsData0.shiftX, copyPixelsData1.y, copyPixelsData1.height, copyPixelsData1.shiftX...] ) {
// copy whole pixels from rectangular areas of input image to output one, shifted coords
for (var i = 0; i < copyPixelsData.length; i++) {
shiftRectWidth = width - Math.abs(copyPixelsData[i].shiftX);
wrapRectWidth = width - rectWidth;
if(copyPixelsData[i].shiftX > 0) {
copyPixels(input, output, new Rectangle(0, copyPixelsData[i].y, shiftRectWidth, copyPixelsData[i].height), new Point(wrapRectWidth, copyPixelsData[i].y));
copyPixels(input, output, new Rectangle(shiftRectWidth, copyPixelsData[i].y, wrapRectWidth, copyPixelsData[i].height), new Point(0, copyPixelsData[i].y));
} else {
copyPixels(input, output, new Rectangle(wrapRectWidth, copyPixelsData[i].y, shiftRectWidth, copyPixelsData[i].height), new Point(0, copyPixelsData[i].y));
copyPixels(input, output, new Rectangle(0, copyPixelsData[i].y, wrapRectWidth, copyPixelsData[i].height), new Point(shiftRectWidth, copyPixelsData[i].y));
}
copyPixels(input, output, new Rectangle(x, copyPixelsData[i].y, width, copyPixelsData[i].height), new Point(copyPixelsData0.shiftX, copyPixelsData[i].y));
}
// copy single channel data from rectangular areas of input image to output one, shifted coords
copyChannel(input, output, new Rectangle(0, 0, 780, 780), new Point(copyChannelPoint.x, copyChannelPoint.y), channel, channel);
}
function copyPixels(source, dest, sourceRect, destPoint) {
processRect(source, dest, sourceRect, destPoint, function(dx, dy, rgba) {
dest[dy][dx] = {r: rgba.r, g: rgba.g, b: rgba.b, a: rgba.a};
});
}
function copyChannel(source, dest, sourceRect, destPoint, sourceChannel, destChannel) {
processRect(source, dest, sourceRect, destPoint, function(dx, dy, rgba) {
dest[dy][dx][destChannel] = rgba[sourceChannel];
});
}
function processRect(source, dest, sourceRect, destPoint, routine) {
var sx, sy, dx, dy, rgba;
for (var y = 0; y < sourceRect.height; y++) {
for (var x = 0; x < sourceRect.width; x++) {
dx = destPoint.x + x;
dy = destPoint.y + y;
sx = sourceRect.x + x;
sy = sourceRect.y + y;
routine(dx, dy, source[sy][sx]);
}
}
}
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment