diff options
Diffstat (limited to 'js')
| -rw-r--r-- | js/gif-encode/worker.concat.js | 1467 | ||||
| -rw-r--r-- | js/record.concat.js | 720 | ||||
| -rw-r--r-- | js/record.min.js | 2 |
3 files changed, 2189 insertions, 0 deletions
diff --git a/js/gif-encode/worker.concat.js b/js/gif-encode/worker.concat.js new file mode 100644 index 0000000..d26ba28 --- /dev/null +++ b/js/gif-encode/worker.concat.js @@ -0,0 +1,1467 @@ +/**
+* This class lets you encode animated GIF files
+* Base class : http://www.java2s.com/Code/Java/2D-Graphics-GUI/AnimatedGifEncoder.htm
+* @author Kevin Weiner (original Java version - kweiner@fmsware.com)
+* @author Thibault Imbert (AS3 version - bytearray.org)
+* @version 0.1 AS3 implementation
+*/
+
+//import flash.utils.ByteArray;
+//import flash.display.BitmapData;
+//import flash.display.Bitmap;
+//import org.bytearray.gif.encoder.NeuQuant
+//import flash.net.URLRequestHeader;
+//import flash.net.URLRequestMethod;
+//import flash.net.URLRequest;
+//import flash.net.navigateToURL;
+
+GIFEncoder = function() {
+ for(var i = 0, chr = {}; i < 256; i++) {
+ chr[i] = String.fromCharCode(i);
+ }
+
+ function ByteArray(){
+ this.bin = [];
+ }
+
+ ByteArray.prototype.getData = function(){
+ for(var v = '', l = this.bin.length, i = 0; i < l; i++) {
+ v += chr[this.bin[i]];
+ }
+ return v;
+ }
+ ByteArray.prototype.writeByte = function(val){
+ this.bin.push(val);
+ }
+ ByteArray.prototype.writeUTFBytes = function(string) {
+ for(var l = string.length, i = 0; i < l; i++) {
+ this.writeByte(string.charCodeAt(i));
+ }
+ }
+ ByteArray.prototype.writeBytes = function(array, offset, length) {
+ for(var l = length || array.length, i = offset||0; i < l; i++) {
+ this.writeByte(array[i]);
+ }
+ }
+
+ var exports = {};
+ var width/*int*/ // image size
+ var height/*int*/;
+ var transparent/***/ = null; // transparent color if given
+ var transIndex/*int*/; // transparent index in color table
+ var repeat/*int*/ = -1; // no repeat
+ var delay/*int*/ = 0; // frame delay (hundredths)
+ var started/*Boolean*/ = false; // ready to output frames
+ var out/*ByteArray*/;
+ var image/*Bitmap*/; // current frame
+ var pixels/*ByteArray*/; // BGR byte array from frame
+ var indexedPixels/*ByteArray*/ // converted frame indexed to palette
+ var colorDepth/*int*/; // number of bit planes
+ var colorTab/*ByteArray*/; // RGB palette
+ var usedEntry/*Array*/ = new Array; // active palette entries
+ var palSize/*int*/ = 7; // color table size (bits-1)
+ var dispose/*int*/ = -1; // disposal code (-1 = use default)
+ var closeStream/*Boolean*/ = false; // close stream when finished
+ var firstFrame/*Boolean*/ = true;
+ var sizeSet/*Boolean*/ = false; // if false, get size from first frame
+ var sample/*int*/ = 1; // default sample interval for quantizer
+ var neuquantBrain = null; // allow loading in a prefab neural net
+
+ /**
+ * Sets the delay time between each frame, or changes it for subsequent frames
+ * (applies to last frame added)
+ * int delay time in milliseconds
+ * @param ms
+ */
+
+ var setDelay = exports.setDelay = function setDelay(ms/*int*/) {
+ delay = Math.round(ms / 10);
+ }
+
+ /**
+ * Sets the GIF frame disposal code for the last added frame and any
+ *
+ * subsequent frames. Default is 0 if no transparent color has been set,
+ * otherwise 2.
+ * @param code
+ * int disposal code.
+ */
+
+ var setDispose = exports.setDispose = function setDispose(code/*int*/) {
+ if (code >= 0) dispose = code;
+ }
+
+ /**
+ * Sets the number of times the set of GIF frames should be played. Default is
+ * 1; 0 means play indefinitely. Must be invoked before the first image is
+ * added.
+ *
+ * @param iter
+ * int number of iterations.
+ * @return
+ */
+
+ var setRepeat = exports.setRepeat = function setRepeat(iter/*int*/) {
+ if (iter >= 0) repeat = iter;
+ }
+
+ /**
+ * Sets the transparent color for the last added frame and any subsequent
+ * frames. Since all colors are subject to modification in the quantization
+ * process, the color in the final palette for each frame closest to the given
+ * color becomes the transparent color for that frame. May be set to null to
+ * indicate no transparent color.
+ * @param
+ * Color to be treated as transparent on display.
+ */
+
+ var setTransparent = exports.setTransparent = function setTransparent(c/*Number*/) {
+ transparent = c;
+ }
+
+ /**
+ * The addFrame method takes an incoming BitmapData object to create each frames
+ * @param
+ * BitmapData object to be treated as a GIF's frame
+ */
+
+ /*Boolean*/
+ var addFrame = exports.addFrame = function addFrame(im/*BitmapData*/, is_imageData) {
+ if ((im == null) || ! started || out == null) {
+ throw new Error ("Please call start method before calling addFrame");
+ return false;
+ }
+
+ var ok/*Boolean*/ = true;
+
+ try {
+ if ( ! is_imageData) {
+ image = im.getImageData(0,0, im.canvas.width, im.canvas.height).data;
+ if ( ! sizeSet) {
+ setSize(im.canvas.width, im.canvas.height);
+ }
+ }
+ else {
+ image = im;
+ }
+ getImagePixels(); // convert to correct format if necessary
+ analyzePixels(); // build color table & map pixels
+
+ if (firstFrame) {
+ writeLSD(); // logical screen descriptior
+ writePalette(); // global color table
+ if (repeat >= 0) {
+ // use NS app extension to indicate reps
+ writeNetscapeExt();
+ }
+ }
+
+ writeGraphicCtrlExt(); // write graphic control extension
+ writeImageDesc(); // image descriptor
+ if (!firstFrame) {
+ writePalette(); // local color table
+ }
+ writePixels(); // encode and write pixel data
+ firstFrame = false;
+ }
+ catch (e/*Error*/) {
+ ok = false;
+ }
+ return ok;
+ }
+
+ /**
+ * Adds final trailer to the GIF stream, if you don't call the finish method
+ * the GIF stream will not be valid.
+ */
+
+ /*Boolean*/
+ var finish = exports.finish = function finish() {
+ if ( ! started) {
+ return false;
+ }
+
+ var ok/*Boolean*/ = true;
+ started = false;
+ try {
+ out.writeByte(0x3b); // gif trailer
+ }
+ catch (e/*Error*/) {
+ ok = false;
+ }
+ return ok;
+ }
+
+ /**
+ * Resets some members so that a new stream can be started.
+ * This method is actually called by the start method
+ */
+
+ var reset = function reset () {
+ // reset for subsequent use
+ transIndex = 0;
+ image = null;
+ pixels = null;
+ indexedPixels = null;
+ colorTab = null;
+ closeStream = false;
+ firstFrame = true;
+ }
+
+ /**
+ * * Sets frame rate in frames per second. Equivalent to
+ * <code>setDelay(1000/fps)</code>.
+ * @param fps
+ * float frame rate (frames per second)
+ */
+
+ var setFrameRate = exports.setFrameRate = function setFrameRate(fps/*Number*/) {
+ if (fps != 0xf) {
+ delay = Math.round(100/fps);
+ }
+ }
+
+ /**
+ * Sets quality of color quantization (conversion of images to the maximum 256
+ * colors allowed by the GIF specification). Lower values (minimum = 1)
+ * produce better colors, but slow processing significantly. 10 is the
+ * default, and produces good color mapping at reasonable speeds. Values
+ * greater than 20 do not yield significant improvements in speed.
+ * @param quality
+ * int greater than 0.
+ * @return
+ */
+
+ var setQuality = exports.setQuality = function setQuality(quality/*int*/) {
+ sample = Math.max(1, quality);
+ }
+
+ /**
+ * Sets the GIF frame size. The default size is the size of the first frame
+ * added if this method is not invoked.
+ * @param w
+ * int frame width.
+ * @param h
+ * int frame width.
+ */
+
+ var setSize = exports.setSize = function setSize(w/*int*/, h/*int*/) {
+ if (started && !firstFrame) {
+ return;
+ }
+ width = w;
+ height = h;
+ if (width < 1) width = 320;
+ if (height < 1) height = 240;
+ sizeSet = true;
+ }
+
+ /**
+ * After running the Neuquant on some test frames, it can be exported and then loaded
+ * into an uninitialized NQ instance on another worker and used accordingly.
+ */
+ var setNeuquant = exports.setNeuquant = function setNeuquant(neuquant, colors){
+ neuquantBrain = neuquant;
+ colorTab = colors;
+ }
+
+ /**
+ * Initiates GIF file creation on the given stream.
+ * @param os
+ * OutputStream on which GIF images are written.
+ * @return false if initial write failed.
+ */
+
+ var start = exports.start = function start() {
+ reset();
+ var ok/*Boolean*/ = true;
+ closeStream = false;
+ out = new ByteArray;
+ try {
+ out.writeUTFBytes("GIF89a"); // header
+ } catch (e/*Error*/) {
+ ok = false;
+ }
+
+ return started = ok;
+ }
+
+ var cont = exports.cont = function cont() {
+ reset();
+ var ok = true;
+ closeStream = false;
+ out = new ByteArray ();
+ return started = ok;
+ }
+
+ /**
+ * Analyzes image colors and creates color map.
+ */
+
+ var analyzePixels = function analyzePixels() {
+ var len = pixels.length;
+ var nPix = len / 3;
+ indexedPixels = [];
+ // initialize quantizer
+
+ var nq;
+ if (neuquantBrain && colorTab) {
+ nq = new NeuQuant();
+ nq.load(neuquantBrain);
+ }
+ else {
+ nq = new NeuQuant (pixels, len, sample);
+ colorTab = nq.process(); // create reduced palette
+ }
+
+ // map image pixels to new palette
+ var k = 0;
+ for (var j = 0; j < nPix; j++) {
+ var index = nq.map(pixels[k++] & 0xff, pixels[k++] & 0xff, pixels[k++] & 0xff);
+ usedEntry[index] = true;
+ indexedPixels[j] = index;
+ }
+ pixels = null;
+ colorDepth = 8;
+ palSize = 7;
+
+ // get closest match to transparent color if specified
+ if (transparent != null) {
+ transIndex = findClosest(transparent);
+ }
+ }
+
+ /**
+ * Returns index of palette color closest to c
+ */
+
+ var findClosest = function findClosest(c/*Number*/) {
+ if (colorTab == null) return -1;
+ var r = (c & 0xFF0000) >> 16;
+ var g = (c & 0x00FF00) >> 8;
+ var b = (c & 0x0000FF);
+ var minpos = 0;
+ var dmin = 256 * 256 * 256;
+ var len = colorTab.length;
+
+ for (var i = 0; i < len;) {
+ var dr = r - (colorTab[i++] & 0xff);
+ var dg = g - (colorTab[i++] & 0xff);
+ var db = b - (colorTab[i] & 0xff);
+ var d = dr * dr + dg * dg + db * db;
+ var index = i / 3;
+ if (usedEntry[index] && (d < dmin)) {
+ dmin = d;
+ minpos = index;
+ }
+ i++;
+ }
+ return minpos;
+ }
+
+ /**
+ * Extracts image pixels into byte array "pixels
+ */
+
+ var getImagePixels = function getImagePixels() {
+ var w = width;
+ var h = height;
+ pixels = [];
+ var data = image;
+ var count/*int*/ = 0;
+
+ for ( var i/*int*/ = 0; i < h; i++ ) {
+ for (var j/*int*/ = 0; j < w; j++ ) {
+ var b = (i*w*4)+j*4;
+ pixels[count++] = data[b];
+ pixels[count++] = data[b+1];
+ pixels[count++] = data[b+2];
+ }
+ }
+ }
+
+ /**
+ * Writes Graphic Control Extension
+ */
+
+ var writeGraphicCtrlExt = function writeGraphicCtrlExt() {
+ out.writeByte(0x21); // extension introducer
+ out.writeByte(0xf9); // GCE label
+ out.writeByte(4); // data block size
+ var transp/*int*/
+ var disp/*int*/;
+ if (transparent == null) {
+ transp = 0;
+ disp = 0; // dispose = no action
+ }
+ else {
+ transp = 1;
+ disp = 2; // force clear if using transparent color
+ }
+ if (dispose >= 0) {
+ disp = dispose & 7; // user override
+ }
+ disp <<= 2;
+ // packed fields
+ out.writeByte(0 | // 1:3 reserved
+ disp | // 4:6 disposal
+ 0 | // 7 user input - 0 = none
+ transp); // 8 transparency flag
+
+ WriteShort(delay); // delay x 1/100 sec
+ out.writeByte(transIndex); // transparent color index
+ out.writeByte(0); // block terminator
+ }
+
+ /**
+ * Writes Image Descriptor
+ */
+
+ var writeImageDesc = function writeImageDesc() {
+ out.writeByte(0x2c); // image separator
+ WriteShort(0); // image position x,y = 0,0
+ WriteShort(0);
+ WriteShort(width); // image size
+ WriteShort(height);
+
+ // packed fields
+ if (firstFrame) {
+ // no LCT - GCT is used for first (or only) frame
+ out.writeByte(0);
+ }
+ else {
+ // specify normal LCT
+ out.writeByte(0x80 | // 1 local color table 1=yes
+ 0 | // 2 interlace - 0=no
+ 0 | // 3 sorted - 0=no
+ 0 | // 4-5 reserved
+ palSize); // 6-8 size of color table
+ }
+ }
+
+ /**
+ * Writes Logical Screen Descriptor
+ */
+
+ var writeLSD = function writeLSD() {
+ // logical screen size
+ WriteShort(width);
+ WriteShort(height);
+ // packed fields
+ out.writeByte((0x80 | // 1 : global color table flag = 1 (gct used)
+ 0x70 | // 2-4 : color resolution = 7
+ 0x00 | // 5 : gct sort flag = 0
+ palSize)); // 6-8 : gct size
+
+ out.writeByte(0); // background color index
+ out.writeByte(0); // pixel aspect ratio - assume 1:1
+ }
+
+ /**
+ * Writes Netscape application extension to define repeat count.
+ */
+
+ var writeNetscapeExt = function writeNetscapeExt() {
+ out.writeByte(0x21); // extension introducer
+ out.writeByte(0xff); // app extension label
+ out.writeByte(11); // block size
+ out.writeUTFBytes("NETSCAPE" + "2.0"); // app id + auth code
+ out.writeByte(3); // sub-block size
+ out.writeByte(1); // loop sub-block id
+ WriteShort(repeat); // loop count (extra iterations, 0=repeat forever)
+ out.writeByte(0); // block terminator
+ }
+
+ /**
+ * Writes color table
+ */
+ var writePalette = function writePalette() {
+ out.writeBytes(colorTab);
+ var n/*int*/ = (3 * 256) - colorTab.length;
+ for (var i/*int*/ = 0; i < n; i++) {
+ out.writeByte(0);
+ }
+ }
+
+ var WriteShort = function WriteShort (pValue/*int*/) {
+ out.writeByte( pValue & 0xFF );
+ out.writeByte( (pValue >> 8) & 0xFF);
+ }
+
+ /**
+ * Encodes and writes pixel data
+ */
+ var writePixels = function writePixels() {
+ var myencoder = new LZWEncoder(width, height, indexedPixels, colorDepth);
+ myencoder.encode(out);
+ }
+
+ /**
+ * retrieves the GIF stream
+ */
+ var stream = exports.stream = function stream () {
+ return out;
+ }
+
+ var setProperties = exports.setProperties = function setProperties(has_start, is_first) {
+ started = has_start;
+ firstFrame = is_first;
+ }
+
+ return exports;
+}
+
+;/**
+* This class handles LZW encoding
+* Adapted from Jef Poskanzer's Java port by way of J. M. G. Elliott.
+* @author Kevin Weiner (original Java version - kweiner@fmsware.com)
+* @author Thibault Imbert (AS3 version - bytearray.org)
+* @version 0.1 AS3 implementation
+*/
+
+//import flash.utils.ByteArray;
+
+LZWEncoder = function()
+{
+ var exports = {};
+ /*private_static*/ var EOF/*int*/ = -1;
+ /*private*/ var imgW/*int*/;
+ /*private*/ var imgH/*int*/
+ /*private*/ var pixAry/*ByteArray*/;
+ /*private*/ var initCodeSize/*int*/;
+ /*private*/ var remaining/*int*/;
+ /*private*/ var curPixel/*int*/;
+
+ // GIFCOMPR.C - GIF Image compression routines
+ // Lempel-Ziv compression based on 'compress'. GIF modifications by
+ // David Rowley (mgardi@watdcsu.waterloo.edu)
+ // General DEFINEs
+
+ /*private_static*/ var BITS/*int*/ = 12;
+ /*private_static*/ var HSIZE/*int*/ = 5003; // 80% occupancy
+
+ // GIF Image compression - modified 'compress'
+ // Based on: compress.c - File compression ala IEEE Computer, June 1984.
+ // By Authors: Spencer W. Thomas (decvax!harpo!utah-cs!utah-gr!thomas)
+ // Jim McKie (decvax!mcvax!jim)
+ // Steve Davies (decvax!vax135!petsd!peora!srd)
+ // Ken Turkowski (decvax!decwrl!turtlevax!ken)
+ // James A. Woods (decvax!ihnp4!ames!jaw)
+ // Joe Orost (decvax!vax135!petsd!joe)
+
+ /*private*/ var n_bits/*int*/ // number of bits/code
+ /*private*/ var maxbits/*int*/ = BITS; // user settable max # bits/code
+ /*private*/ var maxcode/*int*/ // maximum code, given n_bits
+ /*private*/ var maxmaxcode/*int*/ = 1 << BITS; // should NEVER generate this code
+ /*private*/ var htab/*Array*/ = new Array;
+ /*private*/ var codetab/*Array*/ = new Array;
+ /*private*/ var hsize/*int*/ = HSIZE; // for dynamic table sizing
+ /*private*/ var free_ent/*int*/ = 0; // first unused entry
+
+ // block compression parameters -- after all codes are used up,
+ // and compression rate changes, start over.
+
+ /*private*/ var clear_flg/*Boolean*/ = false;
+
+ // Algorithm: use open addressing double hashing (no chaining) on the
+ // prefix code / next character combination. We do a variant of Knuth's
+ // algorithm D (vol. 3, sec. 6.4) along with G. Knott's relatively-prime
+ // secondary probe. Here, the modular division first probe is gives way
+ // to a faster exclusive-or manipulation. Also do block compression with
+ // an adaptive reset, whereby the code table is cleared when the compression
+ // ratio decreases, but after the table fills. The variable-length output
+ // codes are re-sized at this point, and a special CLEAR code is generated
+ // for the decompressor. Late addition: construct the table according to
+ // file size for noticeable speed improvement on small files. Please direct
+ // questions about this implementation to ames!jaw.
+
+ /*private*/ var g_init_bits/*int*/;
+ /*private*/ var ClearCode/*int*/;
+ /*private*/ var EOFCode/*int*/;
+
+ // output
+ // Output the given code.
+ // Inputs:
+ // code: A n_bits-bit integer. If == -1, then EOF. This assumes
+ // that n_bits =< wordsize - 1.
+ // Outputs:
+ // Outputs code to the file.
+ // Assumptions:
+ // Chars are 8 bits long.
+ // Algorithm:
+ // Maintain a BITS character long buffer (so that 8 codes will
+ // fit in it exactly). Use the VAX insv instruction to insert each
+ // code in turn. When the buffer fills up empty it and start over.
+
+ /*private*/ var cur_accum/*int*/ = 0;
+ /*private*/ var cur_bits/*int*/ = 0;
+ /*private*/ var masks/*Array*/ = [ 0x0000, 0x0001, 0x0003, 0x0007, 0x000F, 0x001F, 0x003F, 0x007F, 0x00FF, 0x01FF, 0x03FF, 0x07FF, 0x0FFF, 0x1FFF, 0x3FFF, 0x7FFF, 0xFFFF ];
+
+ // Number of characters so far in this 'packet'
+ /*private*/ var a_count/*int*/;
+
+ // Define the storage for the packet accumulator
+ /*private*/ var accum/*ByteArray*/ = [];
+
+ var LZWEncoder = exports.LZWEncoder = function LZWEncoder (width/*int*/, height/*int*/, pixels/*ByteArray*/, color_depth/*int*/)
+ {
+
+ imgW = width;
+ imgH = height;
+ pixAry = pixels;
+ initCodeSize = Math.max(2, color_depth);
+
+ }
+
+ // Add a character to the end of the current packet, and if it is 254
+ // characters, flush the packet to disk.
+ var char_out = function char_out(c/*Number*/, outs/*ByteArray*/)/*void*/
+ {
+ accum[a_count++] = c;
+ if (a_count >= 254) flush_char(outs);
+
+ }
+
+ // Clear out the hash table
+ // table clear for block compress
+
+ var cl_block = function cl_block(outs/*ByteArray*/)/*void*/
+ {
+
+ cl_hash(hsize);
+ free_ent = ClearCode + 2;
+ clear_flg = true;
+ output(ClearCode, outs);
+
+ }
+
+ // reset code table
+ var cl_hash = function cl_hash(hsize/*int*/)/*void*/
+ {
+
+ for (var i/*int*/ = 0; i < hsize; ++i) htab[i] = -1;
+
+ }
+
+ var compress = exports.compress = function compress(init_bits/*int*/, outs/*ByteArray*/)/*void*/
+
+ {
+ var fcode/*int*/;
+ var i/*int*/ /* = 0 */;
+ var c/*int*/;
+ var ent/*int*/;
+ var disp/*int*/;
+ var hsize_reg/*int*/;
+ var hshift/*int*/;
+
+ // Set up the globals: g_init_bits - initial number of bits
+ g_init_bits = init_bits;
+
+ // Set up the necessary values
+ clear_flg = false;
+ n_bits = g_init_bits;
+ maxcode = MAXCODE(n_bits);
+
+ ClearCode = 1 << (init_bits - 1);
+ EOFCode = ClearCode + 1;
+ free_ent = ClearCode + 2;
+
+ a_count = 0; // clear packet
+
+ ent = nextPixel();
+
+ hshift = 0;
+ for (fcode = hsize; fcode < 65536; fcode *= 2)
+ ++hshift;
+ hshift = 8 - hshift; // set hash code range bound
+
+ hsize_reg = hsize;
+ cl_hash(hsize_reg); // clear hash table
+
+ output(ClearCode, outs);
+
+ outer_loop: while ((c = nextPixel()) != EOF)
+
+ {
+
+ fcode = (c << maxbits) + ent;
+ i = (c << hshift) ^ ent; // xor hashing
+
+ if (htab[i] == fcode)
+ {
+ ent = codetab[i];
+ continue;
+ } else if (htab[i] >= 0) // non-empty slot
+ {
+ disp = hsize_reg - i; // secondary hash (after G. Knott)
+ if (i == 0)
+ disp = 1;
+ do
+ {
+
+ if ((i -= disp) < 0) i += hsize_reg;
+
+ if (htab[i] == fcode)
+ {
+ ent = codetab[i];
+ continue outer_loop;
+ }
+ } while (htab[i] >= 0);
+ }
+
+ output(ent, outs);
+ ent = c;
+ if (free_ent < maxmaxcode)
+ {
+ codetab[i] = free_ent++; // code -> hashtable
+ htab[i] = fcode;
+ } else cl_block(outs);
+ }
+
+ // Put out the final code.
+ output(ent, outs);
+ output(EOFCode, outs);
+
+ }
+
+ // ----------------------------------------------------------------------------
+ var encode = exports.encode = function encode(os/*ByteArray*/)/*void*/
+ {
+ os.writeByte(initCodeSize); // write "initial code size" byte
+ remaining = imgW * imgH; // reset navigation variables
+ curPixel = 0;
+ compress(initCodeSize + 1, os); // compress and write the pixel data
+ os.writeByte(0); // write block terminator
+
+ }
+
+ // Flush the packet to disk, and reset the accumulator
+ var flush_char = function flush_char(outs/*ByteArray*/)/*void*/
+ {
+
+ if (a_count > 0)
+ {
+ outs.writeByte(a_count);
+ outs.writeBytes(accum, 0, a_count);
+ a_count = 0;
+ }
+
+ }
+
+ var MAXCODE = function MAXCODE(n_bits/*int*/)/*int*/
+ {
+
+ return (1 << n_bits) - 1;
+
+ }
+
+ // ----------------------------------------------------------------------------
+ // Return the next pixel from the image
+ // ----------------------------------------------------------------------------
+
+ var nextPixel = function nextPixel()/*int*/
+ {
+
+ if (remaining == 0) return EOF;
+
+ --remaining;
+
+ var pix/*Number*/ = pixAry[curPixel++];
+
+ return pix & 0xff;
+
+ }
+
+ var output = function output(code/*int*/, outs/*ByteArray*/)/*void*/
+
+ {
+ cur_accum &= masks[cur_bits];
+
+ if (cur_bits > 0) cur_accum |= (code << cur_bits);
+ else cur_accum = code;
+
+ cur_bits += n_bits;
+
+ while (cur_bits >= 8)
+
+ {
+
+ char_out((cur_accum & 0xff), outs);
+ cur_accum >>= 8;
+ cur_bits -= 8;
+
+ }
+
+ // If the next entry is going to be too big for the code size,
+ // then increase it, if possible.
+
+ if (free_ent > maxcode || clear_flg)
+ {
+
+ if (clear_flg)
+ {
+
+ maxcode = MAXCODE(n_bits = g_init_bits);
+ clear_flg = false;
+
+ } else
+ {
+
+ ++n_bits;
+
+ if (n_bits == maxbits) maxcode = maxmaxcode;
+
+ else maxcode = MAXCODE(n_bits);
+
+ }
+
+ }
+
+ if (code == EOFCode)
+ {
+
+ // At EOF, write the rest of the buffer.
+ while (cur_bits > 0)
+ {
+
+ char_out((cur_accum & 0xff), outs);
+ cur_accum >>= 8;
+ cur_bits -= 8;
+ }
+
+
+ flush_char(outs);
+
+ }
+
+ }
+ LZWEncoder.apply(this, arguments);
+ return exports;
+}
+
+;/*
+* NeuQuant Neural-Net Quantization Algorithm
+* ------------------------------------------
+*
+* Copyright (c) 1994 Anthony Dekker
+*
+* NEUQUANT Neural-Net quantization algorithm by Anthony Dekker, 1994. See
+* "Kohonen neural networks for optimal colour quantization" in "Network:
+* Computation in Neural Systems" Vol. 5 (1994) pp 351-367. for a discussion of
+* the algorithm.
+*
+* Any party obtaining a copy of these files from the author, directly or
+* indirectly, is granted, free of charge, a full and unrestricted irrevocable,
+* world-wide, paid up, royalty-free, nonexclusive right and license to deal in
+* this software and documentation files (the "Software"), including without
+* limitation the rights to use, copy, modify, merge, publish, distribute,
+* sublicense, and/or sell copies of the Software, and to permit persons who
+* receive copies from any such party to do so, with the only requirement being
+* that this copyright notice remain intact.
+*/
+
+/*
+* This class handles Neural-Net quantization algorithm
+* @author Kevin Weiner (original Java version - kweiner@fmsware.com)
+* @author Thibault Imbert (AS3 version - bytearray.org)
+* @version 0.1 AS3 implementation
+*/
+
+//import flash.utils.ByteArray;
+
+NeuQuant = function() {
+ var exports = {};
+ var netsize = 128; /* number of colours used */
+
+ /* four primes near 500 - assume no image has a length so large */
+ /* that it is divisible by all four primes */
+
+ var prime1 = 499;
+ var prime2 = 491;
+ var prime3 = 487;
+ var prime4 = 503;
+ var minpicturebytes = (3 * prime4);
+
+ /* minimum size for input image */
+ /*
+ * Program Skeleton ---------------- [select samplefac in range 1..30] [read
+ * image from input file] pic = (unsigned char*) malloc(3*width*height);
+ * initnet(pic,3*width*height,samplefac); learn(); unbiasnet(); [write output
+ * image header, using writecolourmap(f)] inxbuild(); write output image using
+ * inxsearch(b,g,r)
+ */
+
+ /*
+ * Network Definitions -------------------
+ */
+
+ var maxnetpos = (netsize - 1);
+ var netbiasshift = 4; /* bias for colour values */
+ var ncycles = 100; /* no. of learning cycles */
+
+ /* defs for freq and bias */
+ var intbiasshift = 16; /* bias for fractions */
+ var intbias = (1 << intbiasshift);
+ var gammashift = 10; /* gamma = 1024 */
+ var gamma = (1 << gammashift);
+ var betashift = 10;
+ var beta = (intbias >> betashift); /* beta = 1/1024 */
+ var betagamma = (intbias << (gammashift - betashift));
+
+ /* defs for decreasing radius factor */
+ var initrad = (netsize >> 3); /* for 256 cols, radius starts */
+ var radiusbiasshift = 6; /* at 32.0 biased by 6 bits */
+ var radiusbias = (1 << radiusbiasshift);
+ var initradius = (initrad * radiusbias); /* and decreases by a */
+ var radiusdec = 30; /* factor of 1/30 each cycle */
+
+ /* defs for decreasing alpha factor */
+ var alphabiasshift = 10; /* alpha starts at 1.0 */
+ var initalpha = (1 << alphabiasshift);
+ var alphadec /* biased by 10 bits */
+
+ /* radbias and alpharadbias used for radpower calculation */
+ var radbiasshift = 8;
+ var radbias = (1 << radbiasshift);
+ var alpharadbshift = (alphabiasshift + radbiasshift);
+
+ var alpharadbias = (1 << alpharadbshift);
+
+ /*
+ * Types and Global Variables --------------------------
+ */
+
+ var thepicture/*ByteArray*//* the input image itself */
+ var lengthcount; /* lengthcount = H*W*3 */
+ var samplefac; /* sampling factor 1..30 */
+
+ // typedef int pixel[4]; /* BGRc */
+ var network; /* the network itself - [netsize][4] */
+ var netindex = new Array();
+
+ /* for network lookup - really 256 */
+ var bias = new Array();
+
+ /* bias and freq arrays for learning */
+ var freq = new Array();
+ var radpower = new Array();
+
+ var NeuQuant = exports.NeuQuant = function NeuQuant(thepic, len, sample) {
+
+ // with no input, assume we'll load in a lobotomized neuquant later.
+ // otherwise, initialize the neural net stuff
+
+ if (thepic && len && sample) {
+ var i;
+ var p;
+
+ thepicture = thepic;
+ lengthcount = len;
+ samplefac = sample;
+
+ network = new Array(netsize);
+
+ for (i = 0; i < netsize; i++) {
+ network[i] = new Array(4);
+ p = network[i];
+ p[0] = p[1] = p[2] = (i << (netbiasshift + 8)) / netsize;
+ freq[i] = intbias / netsize; /* 1/netsize */
+ bias[i] = 0;
+ }
+ }
+ }
+
+ var colorMap = function colorMap() {
+ var map/*ByteArray*/ = [];
+ var index = new Array(netsize);
+ for (var i = 0; i < netsize; i++) {
+ index[network[i][3]] = i;
+ }
+ var k = 0;
+ for (var l = 0; l < netsize; l++) {
+ var j = index[l];
+ map[k++] = (network[j][0]);
+ map[k++] = (network[j][1]);
+ map[k++] = (network[j][2]);
+ }
+ return map;
+ }
+
+ /*
+ * Insertion sort of network and building of netindex[0..255] (to do after
+ * unbias)
+ * -------------------------------------------------------------------------------
+ */
+
+ var inxbuild = function inxbuild() {
+ var i;
+ var j;
+ var smallpos;
+ var smallval;
+ var p;
+ var q;
+ var previouscol
+ var startpos
+
+ previouscol = 0;
+ startpos = 0;
+ for (i = 0; i < netsize; i++) {
+ p = network[i];
+ smallpos = i;
+ smallval = p[1]; /* index on g */
+ /* find smallest in i..netsize-1 */
+ for (j = i + 1; j < netsize; j++) {
+ q = network[j];
+ if (q[1] < smallval) { /* index on g */
+ smallpos = j;
+ smallval = q[1]; /* index on g */
+ }
+ }
+
+ q = network[smallpos];
+ /* swap p (i) and q (smallpos) entries */
+
+ if (i != smallpos) {
+ j = q[0];
+ q[0] = p[0];
+ p[0] = j;
+ j = q[1];
+ q[1] = p[1];
+ p[1] = j;
+ j = q[2];
+ q[2] = p[2];
+ p[2] = j;
+ j = q[3];
+ q[3] = p[3];
+ p[3] = j;
+ }
+
+ /* smallval entry is now in position i */
+
+ if (smallval != previouscol) {
+ netindex[previouscol] = (startpos + i) >> 1;
+
+ for (j = previouscol + 1; j < smallval; j++) netindex[j] = i;
+
+ previouscol = smallval;
+ startpos = i;
+ }
+ }
+
+ netindex[previouscol] = (startpos + maxnetpos) >> 1;
+ for (j = previouscol + 1; j < 256; j++) netindex[j] = maxnetpos; /* really 256 */
+ }
+
+ /*
+ * Main Learning Loop ------------------
+ */
+
+ var learn = function learn() {
+ var i;
+ var j;
+ var b;
+ var g
+ var r;
+ var radius;
+ var rad;
+ var alpha;
+ var step;
+ var delta;
+ var samplepixels;
+ var p/*ByteArray*/;
+ var pix;
+ var lim;
+
+ if (lengthcount < minpicturebytes) samplefac = 1;
+
+ alphadec = 30 + ((samplefac - 1) / 3);
+ p = thepicture;
+ pix = 0;
+ lim = lengthcount;
+ samplepixels = lengthcount / (3 * samplefac);
+ delta = samplepixels / ncycles;
+ alpha = initalpha;
+ radius = initradius;
+
+ rad = radius >> radiusbiasshift;
+ if (rad <= 1) rad = 0;
+
+ for (i = 0; i < rad; i++) radpower[i] = alpha * (((rad * rad - i * i) * radbias) / (rad * rad));
+
+ if (lengthcount < minpicturebytes) step = 3;
+ else if ((lengthcount % prime1) != 0) step = 3 * prime1;
+ else if ((lengthcount % prime2) != 0) step = 3 * prime2;
+ else if ((lengthcount % prime3) != 0) step = 3 * prime3;
+ else step = 3 * prime4;
+
+ i = 0;
+
+ while (i < samplepixels) {
+ b = (p[pix + 0] & 0xff) << netbiasshift;
+ g = (p[pix + 1] & 0xff) << netbiasshift;
+ r = (p[pix + 2] & 0xff) << netbiasshift;
+ j = contest(b, g, r);
+
+ altersingle(alpha, j, b, g, r);
+
+ if (rad != 0) alterneigh(rad, j, b, g, r); /* alter neighbours */
+
+ pix += step;
+
+ if (pix >= lim) pix -= lengthcount;
+
+ i++;
+
+ if (delta == 0) delta = 1;
+
+ if (i % delta == 0) {
+ alpha -= alpha / alphadec;
+ radius -= radius / radiusdec;
+ rad = radius >> radiusbiasshift;
+
+ if (rad <= 1) rad = 0;
+
+ for (j = 0; j < rad; j++) radpower[j] = alpha * (((rad * rad - j * j) * radbias) / (rad * rad));
+ }
+ }
+ }
+
+
+ /* Save the neural network so we can load it back in on another worker.
+ */
+ var save = exports.save = function(){
+ var data = {
+ netindex: netindex,
+ netsize: netsize,
+ network: network
+ };
+ return data;
+ }
+ var load = exports.load = function(data){
+ netindex = data.netindex;
+ netsize = data.netsize;
+ network = data.network;
+ }
+
+
+ /*
+ ** Search for BGR values 0..255 (after net is unbiased) and return colour
+ * index
+ * ----------------------------------------------------------------------------
+ */
+
+ var map = exports.map = function map(b, g, r) {
+ var i;
+ var j;
+ var dist
+ var a;
+ var bestd;
+ var p;
+ var best;
+
+ bestd = 1000; /* biggest possible dist is 256*3 */
+ best = -1;
+ i = netindex[g]; /* index on g */
+ j = i - 1; /* start at netindex[g] and work outwards */
+
+ while ((i < netsize) || (j >= 0)) {
+ if (i < netsize) {
+ p = network[i];
+ dist = p[1] - g; /* inx key */
+ if (dist >= bestd) i = netsize; /* stop iter */
+ else {
+ i++;
+
+ if (dist < 0) dist = -dist;
+
+ a = p[0] - b;
+
+ if (a < 0) a = -a;
+
+ dist += a;
+
+ if (dist < bestd) {
+ a = p[2] - r;
+
+ if (a < 0) a = -a;
+
+ dist += a;
+
+ if (dist < bestd) {
+ bestd = dist;
+ best = p[3];
+ }
+ }
+ }
+ }
+ if (j >= 0) {
+ p = network[j];
+
+ dist = g - p[1]; /* inx key - reverse dif */
+
+ if (dist >= bestd) j = -1; /* stop iter */
+ else {
+ j--;
+ if (dist < 0) dist = -dist;
+ a = p[0] - b;
+ if (a < 0) a = -a;
+ dist += a;
+
+ if (dist < bestd) {
+ a = p[2] - r;
+ if (a < 0)a = -a;
+ dist += a;
+ if (dist < bestd) {
+ bestd = dist;
+ best = p[3];
+ }
+ }
+ }
+ }
+ }
+ return best;
+ }
+
+ var process = exports.process = function process() {
+ learn();
+ unbiasnet();
+ inxbuild();
+ return colorMap();
+ }
+
+ /*
+ * Unbias network to give byte values 0..255 and record position i to prepare
+ * for sort
+ * -----------------------------------------------------------------------------------
+ */
+
+ var unbiasnet = function unbiasnet() {
+ var i;
+ var j;
+ for (i = 0; i < netsize; i++) {
+ network[i][0] >>= netbiasshift;
+ network[i][1] >>= netbiasshift;
+ network[i][2] >>= netbiasshift;
+ network[i][3] = i; /* record colour no */
+ }
+ }
+
+ /*
+ * Move adjacent neurons by precomputed alpha*(1-((i-j)^2/[r]^2)) in
+ * radpower[|i-j|]
+ * ---------------------------------------------------------------------------------
+ */
+
+ var alterneigh = function alterneigh(rad, i, b, g, r) {
+ var j;
+ var k;
+ var lo;
+ var hi;
+ var a;
+ var m;
+ var p;
+
+ lo = i - rad;
+ if (lo < -1) lo = -1;
+
+ hi = i + rad;
+
+ if (hi > netsize) hi = netsize;
+
+ j = i + 1;
+ k = i - 1;
+ m = 1;
+
+ while ((j < hi) || (k > lo)) {
+ a = radpower[m++];
+ if (j < hi) {
+ p = network[j++];
+
+ try {
+ p[0] -= (a * (p[0] - b)) / alpharadbias;
+ p[1] -= (a * (p[1] - g)) / alpharadbias;
+ p[2] -= (a * (p[2] - r)) / alpharadbias;
+ } catch (e/*Error*/) {} // prevents 1.3 miscompilation
+ }
+
+ if (k > lo) {
+ p = network[k--];
+ try {
+ p[0] -= (a * (p[0] - b)) / alpharadbias;
+ p[1] -= (a * (p[1] - g)) / alpharadbias;
+ p[2] -= (a * (p[2] - r)) / alpharadbias;
+ } catch (e/*Error*/) {}
+ }
+ }
+ }
+
+ /*
+ * Move neuron i towards biased (b,g,r) by factor alpha
+ * ----------------------------------------------------
+ */
+
+ var altersingle = function altersingle(alpha, i, b, g, r) {
+ /* alter hit neuron */
+ var n = network[i];
+ n[0] -= (alpha * (n[0] - b)) / initalpha;
+ n[1] -= (alpha * (n[1] - g)) / initalpha;
+ n[2] -= (alpha * (n[2] - r)) / initalpha;
+ }
+
+ /*
+ * Search for biased BGR values ----------------------------
+ */
+
+ var contest = function contest(b, g, r) {
+ /* finds closest neuron (min dist) and updates freq */
+ /* finds best neuron (min dist-bias) and returns position */
+ /* for frequently chosen neurons, freq[i] is high and bias[i] is negative */
+ /* bias[i] = gamma*((1/netsize)-freq[i]) */
+
+ var i;
+ var dist;
+ var a;
+ var biasdist;
+ var betafreq;
+ var bestpos;
+ var bestbiaspos;
+ var bestd;
+ var bestbiasd;
+ var n;
+
+ bestd = ~(1 << 31);
+ bestbiasd = bestd;
+ bestpos = -1;
+ bestbiaspos = bestpos;
+
+ for (i = 0; i < netsize; i++) {
+ n = network[i];
+ dist = n[0] - b;
+
+ if (dist < 0) dist = -dist;
+
+ a = n[1] - g;
+
+ if (a < 0) a = -a;
+
+ dist += a;
+
+ a = n[2] - r;
+
+ if (a < 0) a = -a;
+
+ dist += a;
+
+ if (dist < bestd) {
+ bestd = dist;
+ bestpos = i;
+ }
+
+ biasdist = dist - ((bias[i]) >> (intbiasshift - netbiasshift));
+
+ if (biasdist < bestbiasd) {
+ bestbiasd = biasdist;
+ bestbiaspos = i;
+ }
+
+ betafreq = (freq[i] >> betashift);
+ freq[i] -= betafreq;
+ bias[i] += (betafreq << gammashift);
+ }
+
+ freq[bestpos] += beta;
+ bias[bestpos] -= betagamma;
+ return (bestbiaspos);
+ }
+
+ NeuQuant.apply(this, arguments);
+ return exports;
+}
+;// importScripts('LZWEncoder.js', 'NeuQuant.js', 'GIFEncoder.js'); + +self.onmessage = function(event) { + var data = event.data; + var task = data['task']; + switch (task) { + case 'encode': + encode (data); + break; + case 'quantize': + quantize(data); + break; + } +} + +function log(msg) { + self.postMessage({ + task: 'message', + message: msg + }); +} + +function quantize (data) { + var imageData = data["imageData"]; + var pixels = discardAlphaChannel( imageData.data ); + + var nq = new NeuQuant (pixels, pixels.length, 1); + var colortab = nq.process(); + + self.postMessage({ + task: 'quantize', + neuquant: nq.save(), + colortab: colortab + }); +} + +function discardAlphaChannel( imageData ) { + var pixels = []; + + for ( var i = 0, b = 0, _len = imageData.length; i < _len; b += 4 ) { + pixels[i++] = imageData[b]; + pixels[i++] = imageData[b+1]; + pixels[i++] = imageData[b+2]; + } + return pixels; +} + +function encode (data) { + var frame_index = data["frame_index"]; + var frame_length = data["frame_length"]; + var height = data["height"]; + var width = data["width"]; + var imageData = data["imageData"]; + var delay = data["delay"]; + var neuquant = data["neuquant"]; + var colortab = data["colortab"]; + + // Create a new GIFEncoder for every new worker + var encoder = new GIFEncoder(); + encoder.setRepeat(0); // loop forever + encoder.setQuality(1); + encoder.setSize(width, height); + encoder.setDelay(delay); + + if (frame_index == 0) { + encoder.start(); + } + else { + encoder.cont(); + encoder.setProperties(true, false); //started, firstFrame + } + + // Load the neural net here because the color table gets clobbered by encoder.start(); + encoder.setNeuquant(neuquant, colortab); + encoder.addFrame(imageData, true); + + if(frame_length == frame_index) { + encoder.finish(); + } + + self.postMessage({ + task: 'encode', + frame_index: frame_index, + frame_data: encoder.stream().getData() + }); + // on the page, search for the GIF89a to see the frame_index +}; + diff --git a/js/record.concat.js b/js/record.concat.js new file mode 100644 index 0000000..4a03964 --- /dev/null +++ b/js/record.concat.js @@ -0,0 +1,720 @@ +/* FileSaver.js + * A saveAs() FileSaver implementation. + * 2013-10-21 + * + * By Eli Grey, http://eligrey.com + * License: X11/MIT + * See LICENSE.md + */ + +/*global self */ +/*jslint bitwise: true, regexp: true, confusion: true, es5: true, vars: true, white: true, + plusplus: true */ + +/*! @source http://purl.eligrey.com/github/FileSaver.js/blob/master/FileSaver.js */ + +var saveAs = saveAs + || (typeof navigator !== 'undefined' && navigator.msSaveOrOpenBlob && navigator.msSaveOrOpenBlob.bind(navigator)) + || (function(view) { + "use strict"; + var + doc = view.document + // only get URL when necessary in case BlobBuilder.js hasn't overridden it yet + , get_URL = function() { + return view.URL || view.webkitURL || view; + } + , URL = view.URL || view.webkitURL || view + , save_link = doc.createElementNS("http://www.w3.org/1999/xhtml", "a") + , can_use_save_link = !view.externalHost && "download" in save_link + , click = function(node) { + var event = doc.createEvent("MouseEvents"); + event.initMouseEvent( + "click", true, false, view, 0, 0, 0, 0, 0 + , false, false, false, false, 0, null + ); + node.dispatchEvent(event); + } + , webkit_req_fs = view.webkitRequestFileSystem + , req_fs = view.requestFileSystem || webkit_req_fs || view.mozRequestFileSystem + , throw_outside = function (ex) { + (view.setImmediate || view.setTimeout)(function() { + throw ex; + }, 0); + } + , force_saveable_type = "application/octet-stream" + , fs_min_size = 0 + , deletion_queue = [] + , process_deletion_queue = function() { + var i = deletion_queue.length; + while (i--) { + var file = deletion_queue[i]; + if (typeof file === "string") { // file is an object URL + URL.revokeObjectURL(file); + } else { // file is a File + file.remove(); + } + } + deletion_queue.length = 0; // clear queue + } + , dispatch = function(filesaver, event_types, event) { + event_types = [].concat(event_types); + var i = event_types.length; + while (i--) { + var listener = filesaver["on" + event_types[i]]; + if (typeof listener === "function") { + try { + listener.call(filesaver, event || filesaver); + } catch (ex) { + throw_outside(ex); + } + } + } + } + , FileSaver = function(blob, name) { + // First try a.download, then web filesystem, then object URLs + var + filesaver = this + , type = blob.type + , blob_changed = false + , object_url + , target_view + , get_object_url = function() { + var object_url = get_URL().createObjectURL(blob); + deletion_queue.push(object_url); + return object_url; + } + , dispatch_all = function() { + dispatch(filesaver, "writestart progress write writeend".split(" ")); + } + // on any filesys errors revert to saving with object URLs + , fs_error = function() { + // don't create more object URLs than needed + if (blob_changed || !object_url) { + object_url = get_object_url(blob); + } + if (target_view) { + target_view.location.href = object_url; + } else { + window.open(object_url, "_blank"); + } + filesaver.readyState = filesaver.DONE; + dispatch_all(); + } + , abortable = function(func) { + return function() { + if (filesaver.readyState !== filesaver.DONE) { + return func.apply(this, arguments); + } + }; + } + , create_if_not_found = {create: true, exclusive: false} + , slice + ; + filesaver.readyState = filesaver.INIT; + if (!name) { + name = "download"; + } + if (can_use_save_link) { + object_url = get_object_url(blob); + // FF for Android has a nasty garbage collection mechanism + // that turns all objects that are not pure javascript into 'deadObject' + // this means `doc` and `save_link` are unusable and need to be recreated + // `view` is usable though: + doc = view.document; + save_link = doc.createElementNS("http://www.w3.org/1999/xhtml", "a"); + save_link.href = object_url; + save_link.download = name; + var event = doc.createEvent("MouseEvents"); + event.initMouseEvent( + "click", true, false, view, 0, 0, 0, 0, 0 + , false, false, false, false, 0, null + ); + save_link.dispatchEvent(event); + filesaver.readyState = filesaver.DONE; + dispatch_all(); + return; + } + // Object and web filesystem URLs have a problem saving in Google Chrome when + // viewed in a tab, so I force save with application/octet-stream + // http://code.google.com/p/chromium/issues/detail?id=91158 + if (view.chrome && type && type !== force_saveable_type) { + slice = blob.slice || blob.webkitSlice; + blob = slice.call(blob, 0, blob.size, force_saveable_type); + blob_changed = true; + } + // Since I can't be sure that the guessed media type will trigger a download + // in WebKit, I append .download to the filename. + // https://bugs.webkit.org/show_bug.cgi?id=65440 + if (webkit_req_fs && name !== "download") { + name += ".download"; + } + if (type === force_saveable_type || webkit_req_fs) { + target_view = view; + } + if (!req_fs) { + fs_error(); + return; + } + fs_min_size += blob.size; + req_fs(view.TEMPORARY, fs_min_size, abortable(function(fs) { + fs.root.getDirectory("saved", create_if_not_found, abortable(function(dir) { + var save = function() { + dir.getFile(name, create_if_not_found, abortable(function(file) { + file.createWriter(abortable(function(writer) { + writer.onwriteend = function(event) { + target_view.location.href = file.toURL(); + deletion_queue.push(file); + filesaver.readyState = filesaver.DONE; + dispatch(filesaver, "writeend", event); + }; + writer.onerror = function() { + var error = writer.error; + if (error.code !== error.ABORT_ERR) { + fs_error(); + } + }; + "writestart progress write abort".split(" ").forEach(function(event) { + writer["on" + event] = filesaver["on" + event]; + }); + writer.write(blob); + filesaver.abort = function() { + writer.abort(); + filesaver.readyState = filesaver.DONE; + }; + filesaver.readyState = filesaver.WRITING; + }), fs_error); + }), fs_error); + }; + dir.getFile(name, {create: false}, abortable(function(file) { + // delete file if it already exists + file.remove(); + save(); + }), abortable(function(ex) { + if (ex.code === ex.NOT_FOUND_ERR) { + save(); + } else { + fs_error(); + } + })); + }), fs_error); + }), fs_error); + } + , FS_proto = FileSaver.prototype + , saveAs = function(blob, name) { + return new FileSaver(blob, name); + } + ; + FS_proto.abort = function() { + var filesaver = this; + filesaver.readyState = filesaver.DONE; + dispatch(filesaver, "abort"); + }; + FS_proto.readyState = FS_proto.INIT = 0; + FS_proto.WRITING = 1; + FS_proto.DONE = 2; + + FS_proto.error = + FS_proto.onwritestart = + FS_proto.onprogress = + FS_proto.onwrite = + FS_proto.onabort = + FS_proto.onerror = + FS_proto.onwriteend = + null; + + view.addEventListener("unload", process_deletion_queue, false); + return saveAs; +}(this.self || this.window || this.content)); +// `self` is undefined in Firefox for Android content script context +// while `this` is nsIContentFrameMessageManager +// with an attribute `content` that corresponds to the window + +if (typeof module !== 'undefined') module.exports = saveAs; +;window.dataUriToBlob = (function(){ +/** + * Blob constructor. + */ + +var Blob = window.Blob; + +/** + * ArrayBufferView support. + */ + +var hasArrayBufferView = new Blob([new Uint8Array(100)]).size == 100; + +/** + * Return a `Blob` for the given data `uri`. + * + * @param {String} uri + * @return {Blob} + * @api public + */ + +var dataUriToBlob = function(uri){ + var data = uri.split(',')[1]; + var bytes = atob(data); + var buf = new ArrayBuffer(bytes.length); + var arr = new Uint8Array(buf); + for (var i = 0; i < bytes.length; i++) { + arr[i] = bytes.charCodeAt(i); + } + + if (!hasArrayBufferView) arr = buf; + var blob = new Blob([arr], { type: mime(uri) }); + blob.slice = blob.slice || blob.webkitSlice; + return blob; +}; + +/** + * Return data uri mime type. + */ + +function mime(uri) { + return uri.split(';')[0].slice(5); +} + +return dataUriToBlob; + +})() +;// Total frames to record +var FRAMES_PER_GIF = 36; + +// Frames per second to read from the video +var FPS = 12; + +// Per-frame delay in milliseconds +var DELAY = Math.floor( 1000 / FPS ); + +// Number of WebWorkers to create +var WORKERS = 4; + +// Number of frames to use to build the gif palette (takes longest) +var FRAMES_TO_QUANTIZE = 4; + +// Upload these gifs when finished?? +var DO_UPLOAD = true; + +function GifEncoder(){ + var base = this; + this.working = false; + var canvases = []; + var contexts = []; + var frames = []; + var delays = []; + var width = 0; + var height = 0; + var frames_done = 0; + + var initted = Date.now(); + var started = Date.now(); + var tube = base.tube = new Tube () + + var workers = new Factory (); + + var width, height; + var neuquant, colortab; + + workers.hire("message", receiveMessage); + workers.hire("quantize", receiveQuantize); + workers.hire("encode", receiveEncode); + + var reset = this.reset = function(){ + resetFrames() + neuquant = null; + colortab = null; + base.quantized = false + } + var resetFrames = this.resetFrames = function(){ + canvases = []; + contexts = []; + frames = []; + delays = []; + width = 0; + height = 0; + frames_done = 0; + } + + this.on = function(){ + base.tube.on.apply(base.tube, arguments) + }; + + this.off = function(){ + base.tube.off.apply(base.tube, arguments) + }; + + var addFrame = this.addFrame = function(canvas, delay) { + var ctx = canvas.getContext('2d'); + canvases.push(canvas); + contexts.push(ctx); + delays.push(delay); + + if (canvases.length == 1) { + width = canvas.width; + height = canvas.height; + } + } + + var addFrames = this.addFrames = function(canvas_array, delay){ + for (var i = 0; i < canvas_array.length; i++) { + var canvas = canvas_array[i] + var ctx = canvas.getContext('2d'); + canvases.push(canvas); + contexts.push(ctx); + delays.push(delay); + } + + if (canvases.length == canvas_array.length) { + width = canvas_array[0].width; + height = canvas_array[0].height; + } + } + + var copyFrame = this.copyFrame = function(canvas, delay) { + var newCanvas = document.createElement("canvas"); + var ctx = newCanvas.getContext('2d'); + + ctx.drawImage(canvas, 0, 0, canvas.width, canvas.height); + + canvases.push(newCanvas); + contexts.push(ctx); + delays.push(delay); + + if (canvases.length == 1) { + width = canvas.width; + height = canvas.height; + } + } + + function Factory () { + var base = this; + var w = 0; // which worker to work next + var ww = []; + base.init = function(){ + for (var i = 0; i < WORKERS; i++) { + var worker = new Worker('js/vendor/gif-encode/worker.js'); + worker.onmessage = base.receiveWork; + ww.push(worker); + } + } + var tasks = {}; + base.hire = function(task, cb){ + tasks[task] = cb; + } + base.work = function(job){ + ww[++w % ww.length].postMessage(job); + } + base.receiveWork = function(e){ + e.data.task in tasks && tasks[e.data.task](e); + } + base.init(); + } + + function receiveMessage(e){ + console.log("[WORKER]", e.data.message); + } + + var neuquant, colortab; + var quantize = this.quantize = function () { + initted = Date.now(); + started = Date.now(); + var spritedata = spriteSheet(FRAMES_TO_QUANTIZE); + + workers.work({ + task: 'quantize', + imageData: spritedata + }); + } + + function receiveQuantize(e) { + console.log(Date.now() - started, "quantization done"); + neuquant = e.data.neuquant; + colortab = e.data.colortab; + base.quantized = true + base.tube("quantized") + } + + var encode = this.encode = function (nq, ct) { + if (! canvases.length) { + throw Error ("No frames to encode") + } + nq = nq || neuquant + ct = ct || colortab + + started = Date.now(); + frames_done = 0; + + console.log('working .... '); + var i = 0; + + function sendWork () { + if (i == canvases.length) return doneSending(); + + var ctx = contexts[i]; + var imdata = ctx.getImageData(0, 0, width, height).data; + var delay = delays[i]; + + workers.work({ + task: 'encode', + frame_index: i, + frame_length: contexts.length-1, + height: height, + width: width, + delay: delay, + imageData: imdata, + neuquant: neuquant, + colortab: colortab + }); + + i++; + setTimeout(sendWork, 16); + } + function doneSending(){ + base.tube("done_sending") + } + sendWork(); + } + + function receiveEncode(e){ + var frame_index = e.data["frame_index"]; + var frame_data = e.data["frame_data"]; + + frames[frame_index] = frame_data; + + base.tube("encoded-frame", frames.length, canvases.length) + for (var j = 0; j < canvases.length; j++) { + if (frames[j] == null) { + return; + } + } + console.log("FINISHED " + canvases.length); + var binary_gif = frames.join(''); + var base64_gif = window.btoa(binary_gif); + var data_url = 'data:image/gif;base64,'+base64_gif; + + base.working = false; + + // photo.setAttribute('src', data_url); + // ui.doneEncodingPicture(); + base.tube("rendered", binary_gif) + base.tube("rendered-url", data_url) +// if (DO_UPLOAD) upload( base64_gif ); + + console.log((Date.now() - started), "processed frames"); + console.log((Date.now() - initted), "done"); + } + +// function upload (base64_gif) { +// $("#working").html("UPLOADING") +// +// console.log("starting upload") +// var params = { +// url: base64_gif +// } +// $.ajax({ +// 'url': "/photos.json", +// 'type': 'post', +// 'data': csrf(params), +// 'success': function(data){ +// +// // $("#share").data("href", "/photos/" + data.hash) +// // $("#share, #make-another").fadeIn(400); +// console.log(data); +// console.log((Date.now() - started), "uploaded"); +// // $("#photo").attr("src", data.url); +// // window.location.href = "/photos/" + data.hash +// localStorage.setItem('hash', data.hash) +// window.location.href = "/" +// // data.hash +// } +// }); +// console.log("ok"); +// } + + function spriteSheet (frameCount) { + var start = Date.now(); + frameCount = Math.min(contexts.length, frameCount); + var sprites = document.createElement("canvas"); + var spriteContext = sprites.getContext('2d'); + sprites.width = width; + sprites.height = height * frameCount; + var spritedata = spriteContext.getImageData(0, 0, sprites.width, sprites.height) + var spritedatadata = spritedata.data + var j = 0; + var ctxz = sample(contexts, 4); + while (frameCount--) { + var ctx = ctxz[frameCount]; + var imdata = ctx.getImageData(0, 0, width, height).data; + for (var n = 0; n < imdata.length; j++, n++) { + spritedatadata[j] = imdata[n]; + } + } + // spriteContext.putImageData(spritedata, 0, 0, 0, 0, sprites.width, sprites.height); + // upload( sprites.toDataURL("image/png").split(",")[1] + console.log(Date.now() - start, "built spritesheet"); + return spritedata; + } + +} +;(function(){ + var canvases = document.getElementsByTagName("canvas") + if (canvases.length == 0) { alert("no canvas found"); return; } + + var source = canvases[0] + + var encoder = new GifEncoder() + encoder.on("encoded-frame", encoded_frame) + encoder.on("rendered", rendered_bytes) + encoder.on("rendered-url", rendered_url) + + var w, h, x, y; + var last_t, frame_t, count, delay, done; + var frames = [] + var curtain, outline + var dragging = false + var lastGif + + init() + function init(){ + document.body.style.width = "100%" + document.body.style.height = "100%" + document.body.parentNode.style.width = "100%" + document.body.parentNode.style.height = "100%" + var template = document.getElementById("template").innerHTML + var el = document.createElement("div") + el.innerHTML = template + document.body.appendChild(el) + bind() + } + function bind(){ + curtain = document.getElementById("curtain") + outline = document.getElementById("outline") + controls = document.getElementById("outline") + document.getElementById("record").addEventListener("click", record, false) + document.getElementById("save").addEventListener("click", save, false) + curtain.addEventListener("mousedown", box_start, false) + curtain.addEventListener("mousemove", box_size, false) + curtain.addEventListener("mouseup", box_end, false) + outline.style.display = "none" + controls.style.display = "none" + } + function box_start(e){ + x = e.pageX + y = e.pageY + w = 1 + h = 1 + dragging = true + outline.style.left = px(x-1) + outline.style.top = px(y-1) + outline.style.width = px(w) + outline.style.height = px(h) + outline.style.display = "block" + } + function box_size(e){ + if (! dragging) return + w = e.pageX - x + h = e.pageY - y + outline.style.width = px(w) + outline.style.height = px(h) + } + function box_end(e){ + dragging = false + controls.style.display = "block" + enable("record") + document.getElementById("record").focus() + } + function enable(id){ document.getElementById(id).removeAttribute("disabled") } + function disable(id){ document.getElementById(id).setAttribute("disabled","disabled") } + function px(n){ return n + "px" } + function record(){ + count = parseInt(document.getElementById("framecount").value) + delay = parseFloat(document.getElementById("framedelay").value) * 1000 + done = 0 + frame_t = 0 + build() + capture() + last_t = +new Date() + requestAnimationFrame(recordloop) + status("recording") + disable("record") + } + function recordloop(){ + var canvas = document.createElement("canvas") + var t = +new Date() + frame_t += t - last_t + last_t = t + if (frame_t > delay) { + frame_t -= delay + capture() + } + if (done == count) { + render() + } + else { + requestAnimationFrame(recordloop) + } + } + function build(){ + frames = new Array(count) + for (var i = 0; i < count; i++){ + frames[i] = document.createElement("canvas") + frames[i].height = h + frames[i].width = w + } + } + function capture(){ + var frame = frames[done++] + var ctx = frame.getContext('2d') + ctx.fillStyle = document.body.backgroundColor + ctx.fillRect(0,0,w,h) + ctx.drawImage(source, x, y, w, h, 0, 0, w, h) + } + function render(){ + encoder.reset() + encoder.addFrames(frames, delay) + status("encoding") + try { + encoder.encode() + } + catch (e) { + rendering = false + status(e) + throw e + } + } + function status(s){ + document.getElementById("status").innerHTML = s + } + function encoded_frame(done,count){ + status("encoded " + done + " / " + count) + } + function rendered_bytes(bytes){ + status(filesize(bytes.length)) + } + function rendered_url(url){ + var image = new Image () + lastGif = image.src = url + document.getElementById("preview").innerHTML = "" + document.getElementById("preview").appendChild(image) + rendering = false + enable("record") + enable("save") + } + function save (){ + if (! lastGif) return; + var filename = (window.location.host + window.location.pathname).replace(/[^a-zA-Z0-9]/g,"-").replace(/-+/,"-") + var blob = dataUriToBlob(lastGif) + saveAs(blob, filename + "-" + (+new Date()) + ".gif"); + } + function filesize(n) { + if (n < 1e3) return n + " bytes" + if (n < 1e6) return decimalString(n/1e3) + " kb" + if (n < 1e9) return decimalString(n/1e6) + " mb" + return "WAY TOO BIG DUDE" + } + function decimalString(n){ + var m = Math.floor(n); + return m + "." + Math.round((n-m)*10) + } +})() + diff --git a/js/record.min.js b/js/record.min.js new file mode 100644 index 0000000..6644460 --- /dev/null +++ b/js/record.min.js @@ -0,0 +1,2 @@ +/* asdf.us/dither */ +function GifEncoder(){function a(){var a=this,b=0,c=[];a.init=function(){for(var b=0;WORKERS>b;b++){var d=new Worker("js/vendor/gif-encode/worker.js");d.onmessage=a.receiveWork,c.push(d)}};var d={};a.hire=function(a,b){d[a]=b},a.work=function(a){c[++b%c.length].postMessage(a)},a.receiveWork=function(a){a.data.task in d&&d[a.data.task](a)},a.init()}function b(a){console.log("[WORKER]",a.data.message)}function c(a){console.log(Date.now()-q,"quantization done"),i=a.data.neuquant,j=a.data.colortab,f.quantized=!0,f.tube("quantized")}function d(a){var b=a.data.frame_index,c=a.data.frame_data;m[b]=c,f.tube("encoded-frame",m.length,k.length);for(var d=0;d<k.length;d++)if(null==m[d])return;console.log("FINISHED "+k.length);var e=m.join(""),g=window.btoa(e),h="data:image/gif;base64,"+g;f.working=!1,f.tube("rendered",e),f.tube("rendered-url",h),console.log(Date.now()-q,"processed frames"),console.log(Date.now()-p,"done")}function e(a){var b=Date.now();a=Math.min(l.length,a);var c=document.createElement("canvas"),d=c.getContext("2d");c.width=g,c.height=h*a;for(var e=d.getImageData(0,0,c.width,c.height),f=e.data,i=0,j=sample(l,4);a--;)for(var k=j[a],m=k.getImageData(0,0,g,h).data,n=0;n<m.length;i++,n++)f[i]=m[n];return console.log(Date.now()-b,"built spritesheet"),e}var f=this;this.working=!1;var g,h,i,j,k=[],l=[],m=[],n=[],g=0,h=0,o=0,p=Date.now(),q=Date.now(),r=(f.tube=new Tube,new a);r.hire("message",b),r.hire("quantize",c),r.hire("encode",d);var s=(this.reset=function(){s(),i=null,j=null,f.quantized=!1},this.resetFrames=function(){k=[],l=[],m=[],n=[],g=0,h=0,o=0});this.on=function(){f.tube.on.apply(f.tube,arguments)},this.off=function(){f.tube.off.apply(f.tube,arguments)};{var i,j;this.addFrame=function(a,b){var c=a.getContext("2d");k.push(a),l.push(c),n.push(b),1==k.length&&(g=a.width,h=a.height)},this.addFrames=function(a,b){for(var c=0;c<a.length;c++){var d=a[c],e=d.getContext("2d");k.push(d),l.push(e),n.push(b)}k.length==a.length&&(g=a[0].width,h=a[0].height)},this.copyFrame=function(a,b){var c=document.createElement("canvas"),d=c.getContext("2d");d.drawImage(a,0,0,a.width,a.height),k.push(c),l.push(d),n.push(b),1==k.length&&(g=a.width,h=a.height)},this.quantize=function(){p=Date.now(),q=Date.now();var a=e(FRAMES_TO_QUANTIZE);r.work({task:"quantize",imageData:a})},this.encode=function(a,b){function c(){if(e==k.length)return d();var a=l[e],b=a.getImageData(0,0,g,h).data,f=n[e];r.work({task:"encode",frame_index:e,frame_length:l.length-1,height:h,width:g,delay:f,imageData:b,neuquant:i,colortab:j}),e++,setTimeout(c,16)}function d(){f.tube("done_sending")}if(!k.length)throw Error("No frames to encode");a=a||i,b=b||j,q=Date.now(),o=0,console.log("working .... ");var e=0;c()}}}var saveAs=saveAs||"undefined"!=typeof navigator&&navigator.msSaveOrOpenBlob&&navigator.msSaveOrOpenBlob.bind(navigator)||function(a){"use strict";var b=a.document,c=function(){return a.URL||a.webkitURL||a},d=a.URL||a.webkitURL||a,e=b.createElementNS("http://www.w3.org/1999/xhtml","a"),f=!a.externalHost&&"download"in e,g=a.webkitRequestFileSystem,h=a.requestFileSystem||g||a.mozRequestFileSystem,i=function(b){(a.setImmediate||a.setTimeout)(function(){throw b},0)},j="application/octet-stream",k=0,l=[],m=function(){for(var a=l.length;a--;){var b=l[a];"string"==typeof b?d.revokeObjectURL(b):b.remove()}l.length=0},n=function(a,b,c){b=[].concat(b);for(var d=b.length;d--;){var e=a["on"+b[d]];if("function"==typeof e)try{e.call(a,c||a)}catch(f){i(f)}}},o=function(d,i){var m,o,p,q=this,r=d.type,s=!1,t=function(){var a=c().createObjectURL(d);return l.push(a),a},u=function(){n(q,"writestart progress write writeend".split(" "))},v=function(){(s||!m)&&(m=t(d)),o?o.location.href=m:window.open(m,"_blank"),q.readyState=q.DONE,u()},w=function(a){return function(){return q.readyState!==q.DONE?a.apply(this,arguments):void 0}},x={create:!0,exclusive:!1};if(q.readyState=q.INIT,i||(i="download"),f){m=t(d),b=a.document,e=b.createElementNS("http://www.w3.org/1999/xhtml","a"),e.href=m,e.download=i;var y=b.createEvent("MouseEvents");return y.initMouseEvent("click",!0,!1,a,0,0,0,0,0,!1,!1,!1,!1,0,null),e.dispatchEvent(y),q.readyState=q.DONE,u(),void 0}return a.chrome&&r&&r!==j&&(p=d.slice||d.webkitSlice,d=p.call(d,0,d.size,j),s=!0),g&&"download"!==i&&(i+=".download"),(r===j||g)&&(o=a),h?(k+=d.size,h(a.TEMPORARY,k,w(function(a){a.root.getDirectory("saved",x,w(function(a){var b=function(){a.getFile(i,x,w(function(a){a.createWriter(w(function(b){b.onwriteend=function(b){o.location.href=a.toURL(),l.push(a),q.readyState=q.DONE,n(q,"writeend",b)},b.onerror=function(){var a=b.error;a.code!==a.ABORT_ERR&&v()},"writestart progress write abort".split(" ").forEach(function(a){b["on"+a]=q["on"+a]}),b.write(d),q.abort=function(){b.abort(),q.readyState=q.DONE},q.readyState=q.WRITING}),v)}),v)};a.getFile(i,{create:!1},w(function(a){a.remove(),b()}),w(function(a){a.code===a.NOT_FOUND_ERR?b():v()}))}),v)}),v),void 0):(v(),void 0)},p=o.prototype,q=function(a,b){return new o(a,b)};return p.abort=function(){var a=this;a.readyState=a.DONE,n(a,"abort")},p.readyState=p.INIT=0,p.WRITING=1,p.DONE=2,p.error=p.onwritestart=p.onprogress=p.onwrite=p.onabort=p.onerror=p.onwriteend=null,a.addEventListener("unload",m,!1),q}(this.self||this.window||this.content);"undefined"!=typeof module&&(module.exports=saveAs),window.dataUriToBlob=function(){function a(a){return a.split(";")[0].slice(5)}var b=window.Blob,c=100==new b([new Uint8Array(100)]).size,d=function(d){for(var e=d.split(",")[1],f=atob(e),g=new ArrayBuffer(f.length),h=new Uint8Array(g),i=0;i<f.length;i++)h[i]=f.charCodeAt(i);c||(h=g);var j=new b([h],{type:a(d)});return j.slice=j.slice||j.webkitSlice,j};return d}();var FRAMES_PER_GIF=36,FPS=12,DELAY=Math.floor(1e3/FPS),WORKERS=4,FRAMES_TO_QUANTIZE=4,DO_UPLOAD=!0;!function(){function a(){document.body.style.width="100%",document.body.style.height="100%",document.body.parentNode.style.width="100%",document.body.parentNode.style.height="100%";var a=document.getElementById("template").innerHTML,c=document.createElement("div");c.innerHTML=a,document.body.appendChild(c),b()}function b(){G=document.getElementById("curtain"),H=document.getElementById("outline"),controls=document.getElementById("outline"),document.getElementById("record").addEventListener("click",i,!1),document.getElementById("save").addEventListener("click",r,!1),G.addEventListener("mousedown",c,!1),G.addEventListener("mousemove",d,!1),G.addEventListener("mouseup",e,!1),H.style.display="none",controls.style.display="none"}function c(a){z=a.pageX,A=a.pageY,x=1,y=1,K=!0,H.style.left=h(z-1),H.style.top=h(A-1),H.style.width=h(x),H.style.height=h(y),H.style.display="block"}function d(a){K&&(x=a.pageX-z,y=a.pageY-A,H.style.width=h(x),H.style.height=h(y))}function e(){K=!1,controls.style.display="block",f("record"),document.getElementById("record").focus()}function f(a){document.getElementById(a).removeAttribute("disabled")}function g(a){document.getElementById(a).setAttribute("disabled","disabled")}function h(a){return a+"px"}function i(){D=parseInt(document.getElementById("framecount").value),E=1e3*parseFloat(document.getElementById("framedelay").value),F=0,C=0,k(),l(),B=+new Date,requestAnimationFrame(j),n("recording"),g("record")}function j(){var a=(document.createElement("canvas"),+new Date);C+=a-B,B=a,C>E&&(C-=E,l()),F==D?m():requestAnimationFrame(j)}function k(){J=new Array(D);for(var a=0;D>a;a++)J[a]=document.createElement("canvas"),J[a].height=y,J[a].width=x}function l(){var a=J[F++],b=a.getContext("2d");b.fillStyle=document.body.backgroundColor,b.fillRect(0,0,x,y),b.drawImage(v,z,A,x,y,0,0,x,y)}function m(){w.reset(),w.addFrames(J,E),n("encoding");try{w.encode()}catch(a){throw rendering=!1,n(a),a}}function n(a){document.getElementById("status").innerHTML=a}function o(a,b){n("encoded "+a+" / "+b)}function p(a){n(s(a.length))}function q(a){var b=new Image;I=b.src=a,document.getElementById("preview").innerHTML="",document.getElementById("preview").appendChild(b),rendering=!1,f("record"),f("save")}function r(){if(I){var a=(window.location.host+window.location.pathname).replace(/[^a-zA-Z0-9]/g,"-").replace(/-+/,"-"),b=dataUriToBlob(I);saveAs(b,a+"-"+ +new Date+".gif")}}function s(a){return 1e3>a?a+" bytes":1e6>a?t(a/1e3)+" kb":1e9>a?t(a/1e6)+" mb":"WAY TOO BIG DUDE"}function t(a){var b=Math.floor(a);return b+"."+Math.round(10*(a-b))}var u=document.getElementsByTagName("canvas");if(0==u.length)return alert("no canvas found"),void 0;var v=u[0],w=new GifEncoder;w.on("encoded-frame",o),w.on("rendered",p),w.on("rendered-url",q);var x,y,z,A,B,C,D,E,F,G,H,I,J=[],K=!1;a()}();
\ No newline at end of file |