30:Td9a,pathdraw = { context.fillStyle = "lightgray"; context.fillRect(0, 0, 600, 600); context.fillStyle = "black"; context.strokeStyle = "black"; context.beginPath(); context.moveTo(300.5, 433.333846); context.bezierCurveTo( 282.72532, 433.333846, 267.32532, 429.466154, 254.3, 421.733846 ); context.bezierCurveTo( 241.321034, 414.030769, 230.944206, 403.118462, 224.350234, 390.236923 ); context.bezierCurveTo( 217.339538, 376.833846, 212.207488, 362.66, 209.078516, 348.06 ); context.bezierCurveTo( 205.758584, 332.226154, 204.141276, 316.127692, 204.25, 300 ); context.bezierCurveTo( 204.25, 287.229231, 205.084218, 275.021538, 206.768516, 263.347692 ); context.bezierCurveTo( 208.436952, 251.689231, 211.532968, 239.836923, 216.040702, 227.807385 ); context.bezierCurveTo( 220.548282, 215.777692, 226.355468, 205.348154, 233.429766, 196.503692 ); context.bezierCurveTo( 240.794816, 187.442769, 250.317714, 180.067385, 261.262032, 174.948154 ); context.bezierCurveTo( 272.74766, 169.422154, 285.80532, 166.666615, 300.5, 166.666615 ); context.bezierCurveTo( 318.27468, 166.666615, 333.67468, 170.533385, 346.7, 178.266615 ); context.bezierCurveTo( 359.67912, 185.969231, 370.05564, 196.882, 376.64992, 209.762923 ); context.bezierCurveTo( 383.61226, 223.022154, 388.69734, 237.081538, 391.9221, 251.94 ); context.bezierCurveTo(395.12992, 266.784615, 396.75, 282.815385, 396.75, 300); context.bezierCurveTo( 396.75, 312.770769, 395.91532, 324.978462, 394.2321, 336.652308 ); context.bezierCurveTo( 392.43646, 348.772308, 389.26406, 360.686154, 384.76726, 372.192308 ); context.bezierCurveTo( 380.11492, 384.221538, 374.33992, 394.652308, 367.37758, 403.496923 ); context.bezierCurveTo( 360.41524, 412.34, 351.20758, 419.526154, 339.73766, 425.052308 ); context.bezierCurveTo( 328.26774, 430.578462, 315.19468, 433.333846, 300.5, 433.333846 ); context.closePath(); context.moveTo(334.47702, 335.3); context.bezierCurveTo( 343.6816, 326.067692, 348.8021, 313.292308, 348.625, 300 ); context.bezierCurveTo(348.625, 286.266154, 344.0204, 274.5, 334.82968, 264.7); context.bezierCurveTo(325.62202, 254.9, 314.1829, 250, 300.5, 250); context.bezierCurveTo(286.8171, 250, 275.37952, 254.9, 266.17032, 264.7); context.bezierCurveTo( 257.153928, 274.035385, 252.174492, 286.776923, 252.375, 300 ); context.bezierCurveTo( 252.375, 313.733846, 256.978984, 325.5, 266.17032, 335.3 ); context.bezierCurveTo(275.37952, 345.1, 286.8171, 350, 300.5, 350); context.bezierCurveTo(314.1829, 350, 325.5096, 345.1, 334.47702, 335.3); context.closePath(); context.moveTo(300.5, 500); context.bezierCurveTo(406.80774, 500, 493, 410.449231, 493, 300); context.bezierCurveTo(493, 189.55, 406.80774, 100, 300.5, 100); context.bezierCurveTo(194.191798, 100, 108, 189.55, 108, 300); context.bezierCurveTo(108, 410.449231, 194.191798, 500, 300.5, 500); context.stroke(); context.fill(); context.closePath(); }31:T24dd,Stereogram = { /*! Stereogram.js (https://github.com/peeinears/Stereogram.js) * * MIT License (http://www.opensource.org/licenses/mit-license.html) * Copyright (c) 2014 Ian Pearce */ var Stereogram = { render: function (opts) { opts = opts || {}; var defaultOptions = { width: null, height: null, depthMap: null, depthMapper: new Stereogram.DepthMapper(), imageType: "png", colors: [ [255, 255, 255, 255], [0, 0, 0, 255] ] }; for (var property in defaultOptions) { if (!opts.hasOwnProperty(property)) opts[property] = defaultOptions[property]; } var element, width, height, depthMap, pixelData, i; // find and set element if (opts.el) { element = typeof opts.el === "string" ? document.getElementById(opts.el) : opts.el; if (!element || !element.tagName) throw "Stereogram: Could not find element: " + opts.el; } // use element's height and width unless height and width is provided width = opts.width || element.width; if (!width) throw ( "Stereogram: width not set and could not be inferred from element: " + opts.el ); height = opts.height || element.height; if (!height) throw ( "Stereogram: height not set and could not be inferred from element: " + opts.el ); // use depthMap if provided, otherwise use depthMap generated by given depthMapper if (opts.depthMap) { depthMap = opts.depthMap; } else if (opts.depthMapper) { depthMap = opts.depthMapper.generate(width, height); } else throw "Stereogram: no depthMap or depthMapper opts given"; // convert hex colors to RGBa for (i = 0; i < opts.colors.length; i++) { if (typeof opts.colors[i] === "string") { opts.colors[i] = this.helpers.hexToRGBa(opts.colors[i]); } } pixelData = this.generatePixelData({ width: width, height: height, depthMap: depthMap, colors: opts.colors }); switch (element.tagName) { case "CANVAS": this.renderToCanvas(element, pixelData, width, height); break; case "IMG": var canvas = document.createElement("canvas"); canvas.width = width; canvas.height = height; this.renderToCanvas(canvas, pixelData, width, height); element.src = canvas.toDataURL("image/" + (opts.imageType || "png")); break; default: throw "Stereogram: el must be either a