/*

html2canvas 0.4.1 <http://html2canvas.hertzen.com>

Copyright (c) 2013 Niklas von Hertzen

Released under MIT License

*/

(function(window, document, undefined){

"use strict";

var _html2canvas = {},

previousElement,

computedCSS,

html2canvas;

_html2canvas.Util = {};

_html2canvas.Util.log = function(a) {

if (_html2canvas.logging && window.console && window.console.log) {

window.console.log(a);

}

};

_html2canvas.Util.trimText = (function(isNative){

return function(input) {

return isNative ? isNative.apply(input) : ((input || '') + '').replace( /^\s+|\s+$/g , '' );

};

})(String.prototype.trim);

_html2canvas.Util.asFloat = function(v) {

return parseFloat(v);

};

(function() {

// TODO: support all possible length values

var TEXT_SHADOW_PROPERTY = /((rgba|rgb)\([^\)]+\)(\s-?\d+px){0,})/g;

var TEXT_SHADOW_VALUES = /(-?\d+px)|(#.+)|(rgb\(.+\))|(rgba\(.+\))/g;

_html2canvas.Util.parseTextShadows = function (value) {

if (!value || value === 'none') {

return [];

}

// find multiple shadow declarations

var shadows = value.match(TEXT_SHADOW_PROPERTY),

results = [];

for (var i = 0; shadows && (i < shadows.length); i++) {

var s = shadows[i].match(TEXT_SHADOW_VALUES);

results.push({

color: s[0],

offsetX: s[1] ? s[1].replace('px', '') : 0,

offsetY: s[2] ? s[2].replace('px', '') : 0,

blur: s[3] ? s[3].replace('px', '') : 0

});

}

return results;

};

})();

_html2canvas.Util.parseBackgroundImage = function (value) {

var whitespace = ' \r\n\t',

method, definition, prefix, prefix_i, block, results = [],

c, mode = 0, numParen = 0, quote, args;

var appendResult = function(){

if(method) {

if(definition.substr( 0, 1 ) === '"') {

definition = definition.substr( 1, definition.length - 2 );

}

if(definition) {

args.push(definition);

}

if(method.substr( 0, 1 ) === '-' &&

(prefix_i = method.indexOf( '-', 1 ) + 1) > 0) {

prefix = method.substr( 0, prefix_i);

method = method.substr( prefix_i );

}

results.push({

prefix: prefix,

method: method.toLowerCase(),

value: block,

args: args

});

}

args = []; //for some odd reason, setting .length = 0 didn't work in safari

method =

prefix =

definition =

block = '';

};

appendResult();

for(var i = 0, ii = value.length; i<ii; i++) {

c = value[i];

if(mode === 0 && whitespace.indexOf( c ) > -1){

continue;

}

switch(c) {

case '"':

if(!quote) {

quote = c;

}

else if(quote === c) {

quote = null;

}

break;

case '(':

if(quote) { break; }

else if(mode === 0) {

mode = 1;

block += c;

continue;

} else {

numParen++;

}

break;

case ')':

if(quote) { break; }

else if(mode === 1) {

if(numParen === 0) {

mode = 0;

block += c;

appendResult();

continue;

} else {

numParen--;

}

}

break;

case ',':

if(quote) { break; }

else if(mode === 0) {

appendResult();

continue;

}

else if (mode === 1) {

if(numParen === 0 && !method.match(/^url$/i)) {

args.push(definition);

definition = '';

block += c;

continue;

}

}

break;

}

block += c;

if(mode === 0) { method += c; }

else { definition += c; }

}

appendResult();

return results;

};

_html2canvas.Util.Bounds = function (element) {

var clientRect, bounds = {};

if (element.getBoundingClientRect){

clientRect = element.getBoundingClientRect();

// TODO add scroll position to bounds, so no scrolling of window necessary

bounds.top = clientRect.top;

bounds.bottom = clientRect.bottom || (clientRect.top + clientRect.height);

bounds.left = clientRect.left;

bounds.width = element.offsetWidth;

bounds.height = element.offsetHeight;

}

return bounds;

};

// TODO ideally, we'd want everything to go through this function instead of Util.Bounds,

// but would require further work to calculate the correct positions for elements with offsetParents

_html2canvas.Util.OffsetBounds = function (element) {

var parent = element.offsetParent ? _html2canvas.Util.OffsetBounds(element.offsetParent) : {top: 0, left: 0};

return {

top: element.offsetTop + parent.top,

bottom: element.offsetTop + element.offsetHeight + parent.top,

left: element.offsetLeft + parent.left,

width: element.offsetWidth,

height: element.offsetHeight

};

};

function toPX(element, attribute, value ) {

var rsLeft = element.runtimeStyle && element.runtimeStyle[attribute],

left,

style = element.style;

// Check if we are not dealing with pixels, (Opera has issues with this)

// Ported from jQuery css.js

// From the awesome hack by Dean Edwards

// http://erik.eae.net/archives/2007/07/27/18.54.15/#comment-102291

// If we're not dealing with a regular pixel number

// but a number that has a weird ending, we need to convert it to pixels

if ( !/^-?[0-9]+\.?[0-9]*(?:px)?$/i.test( value ) && /^-?\d/.test(value) ) {

// Remember the original values

left = style.left;

// Put in the new values to get a computed value out

if (rsLeft) {

element.runtimeStyle.left = element.currentStyle.left;

}

style.left = attribute === "fontSize" ? "1em" : (value || 0);

value = style.pixelLeft + "px";

// Revert the changed values

style.left = left;

if (rsLeft) {

element.runtimeStyle.left = rsLeft;

}

}

if (!/^(thin|medium|thick)$/i.test(value)) {

return Math.round(parseFloat(value)) + "px";

}

return value;

}

function asInt(val) {

return parseInt(val, 10);

}

function isPercentage(value) {

return value.toString().indexOf("%") !== -1;

}

function parseBackgroundSizePosition(value, element, attribute, index) {

value = (value || '').split(',');

value = value[index || 0] || value[0] || 'auto';

value = _html2canvas.Util.trimText(value).split(' ');

if(attribute === 'backgroundSize' && (value[0] && value[0].match(/^(cover|contain|auto)$/))) {

return value;

} else {

value[0] = (value[0].indexOf( "%" ) === -1) ? toPX(element, attribute + "X", value[0]) : value[0];

if(value[1] === undefined) {

if(attribute === 'backgroundSize') {

value[1] = 'auto';

return value;

} else {

// IE 9 doesn't return double digit always

value[1] = value[0];

}

}

value[1] = (value[1].indexOf("%") === -1) ? toPX(element, attribute + "Y", value[1]) : value[1];

}

return value;

}

_html2canvas.Util.getCSS = function (element, attribute, index) {

if (previousElement !== element) {

computedCSS = document.defaultView.getComputedStyle(element, null);

}

var value = computedCSS[attribute];

if (/^background(Size|Position)$/.test(attribute)) {

return parseBackgroundSizePosition(value, element, attribute, index);

} else if (/border(Top|Bottom)(Left|Right)Radius/.test(attribute)) {

var arr = value.split(" ");

if (arr.length <= 1) {

arr[1] = arr[0];

}

return arr.map(asInt);

}

return value;

};

_html2canvas.Util.resizeBounds = function( current_width, current_height, target_width, target_height, stretch_mode ){

var target_ratio = target_width / target_height,

current_ratio = current_width / current_height,

output_width, output_height;

if(!stretch_mode || stretch_mode === 'auto') {

output_width = target_width;

output_height = target_height;

} else if(target_ratio < current_ratio ^ stretch_mode === 'contain') {

output_height = target_height;

output_width = target_height * current_ratio;

} else {

output_width = target_width;

output_height = target_width / current_ratio;

}

return {

width: output_width,

height: output_height

};

};

_html2canvas.Util.BackgroundPosition = function(element, bounds, image, imageIndex, backgroundSize ) {

var backgroundPosition = _html2canvas.Util.getCSS(element, 'backgroundPosition', imageIndex),

leftPosition,

topPosition;

if (backgroundPosition.length === 1){

backgroundPosition = [backgroundPosition[0], backgroundPosition[0]];

}

if (isPercentage(backgroundPosition[0])){

leftPosition = (bounds.width - (backgroundSize || image).width) * (parseFloat(backgroundPosition[0]) / 100);

} else {

leftPosition = parseInt(backgroundPosition[0], 10);

}

if (backgroundPosition[1] === 'auto') {

topPosition = leftPosition / image.width * image.height;

} else if (isPercentage(backgroundPosition[1])){

topPosition = (bounds.height - (backgroundSize || image).height) * parseFloat(backgroundPosition[1]) / 100;

} else {

topPosition = parseInt(backgroundPosition[1], 10);

}

if (backgroundPosition[0] === 'auto') {

leftPosition = topPosition / image.height * image.width;

}

return {left: leftPosition, top: topPosition};

};

_html2canvas.Util.BackgroundSize = function(element, bounds, image, imageIndex) {

var backgroundSize = _html2canvas.Util.getCSS(element, 'backgroundSize', imageIndex), width, height;

if (backgroundSize.length === 1) {

backgroundSize = [backgroundSize[0], backgroundSize[0]];

}

if (isPercentage(backgroundSize[0])) {

width = bounds.width * parseFloat(backgroundSize[0]) / 100;

} else if (/contain|cover/.test(backgroundSize[0])) {

return _html2canvas.Util.resizeBounds(image.width, image.height, bounds.width, bounds.height, backgroundSize[0]);

} else {

width = parseInt(backgroundSize[0], 10);

}

if (backgroundSize[0] === 'auto' && backgroundSize[1] === 'auto') {

height = image.height;

} else if (backgroundSize[1] === 'auto') {

height = width / image.width * image.height;

} else if (isPercentage(backgroundSize[1])) {

height = bounds.height * parseFloat(backgroundSize[1]) / 100;

} else {

height = parseInt(backgroundSize[1], 10);

}

if (backgroundSize[0] === 'auto') {

width = height / image.height * image.width;

}

return {width: width, height: height};

};

_html2canvas.Util.BackgroundRepeat = function(element, imageIndex) {

var backgroundRepeat = _html2canvas.Util.getCSS(element, "backgroundRepeat").split(",").map(_html2canvas.Util.trimText);

return backgroundRepeat[imageIndex] || backgroundRepeat[0];

};

_html2canvas.Util.Extend = function (options, defaults) {

for (var key in options) {

if (options.hasOwnProperty(key)) {

defaults[key] = options[key];

}

}

return defaults;

};

/*

* Derived from jQuery.contents()

* Copyright 2010, John Resig

* Dual licensed under the MIT or GPL Version 2 licenses.

* http://jquery.org/license

*/

_html2canvas.Util.Children = function( elem ) {

var children;

try {

children = (elem.nodeName && elem.nodeName.toUpperCase() === "IFRAME") ? elem.contentDocument || elem.contentWindow.document : (function(array) {

var ret = [];

if (array !== null) {

(function(first, second ) {

var i = first.length,

j = 0;

if (typeof second.length === "number") {

for (var l = second.length; j < l; j++) {

first[i++] = second[j];

}

} else {

while (second[j] !== undefined) {

first[i++] = second[j++];

}

}

first.length = i;

return first;

})(ret, array);

}

return ret;

})(elem.childNodes);

} catch (ex) {

_html2canvas.Util.log("html2canvas.Util.Children failed with exception: " + ex.message);

children = [];

}

return children;

};

_html2canvas.Util.isTransparent = function(backgroundColor) {

return (!backgroundColor || backgroundColor === "transparent" || backgroundColor === "rgba(0, 0, 0, 0)");

};

_html2canvas.Util.Font = (function () {

var fontData = {};

return function(font, fontSize, doc) {

if (fontData[font + "-" + fontSize] !== undefined) {

return fontData[font + "-" + fontSize];

}

var container = doc.createElement('div'),

img = doc.createElement('img'),

span = doc.createElement('span'),

sampleText = 'Hidden Text',

baseline,

middle,

metricsObj;

container.style.visibility = "hidden";

container.style.fontFamily = font;

container.style.fontSize = fontSize;

container.style.margin = 0;

container.style.padding = 0;

doc.body.appendChild(container);

// http://probablyprogramming.com/2009/03/15/the-tiniest-gif-ever (handtinywhite.gif)

img.src = "data:image/gif;base64,R0lGODlhAQABAIABAP///wAAACwAAAAAAQABAAACAkQBADs=";

img.width = 1;

img.height = 1;

img.style.margin = 0;

img.style.padding = 0;

img.style.verticalAlign = "baseline";

span.style.fontFamily = font;

span.style.fontSize = fontSize;

span.style.margin = 0;

span.style.padding = 0;

span.appendChild(doc.createTextNode(sampleText));

container.appendChild(span);

container.appendChild(img);

baseline = (img.offsetTop - span.offsetTop) + 1;

container.removeChild(span);

container.appendChild(doc.createTextNode(sampleText));

container.style.lineHeight = "normal";

img.style.verticalAlign = "super";

middle = (img.offsetTop-container.offsetTop) + 1;

metricsObj = {

baseline: baseline,

lineWidth: 1,

middle: middle

};

fontData[font + "-" + fontSize] = metricsObj;

doc.body.removeChild(container);

return metricsObj;

};

})();

(function(){

var Util = _html2canvas.Util,

Generate = {};

_html2canvas.Generate = Generate;

var reGradients = [

/^(-webkit-linear-gradient)\(([a-z\s]+)([\w\d\.\s,%\(\)]+)\)$/,

/^(-o-linear-gradient)\(([a-z\s]+)([\w\d\.\s,%\(\)]+)\)$/,

/^(-webkit-gradient)\((linear|radial),\s((?:\d{1,3}%?)\s(?:\d{1,3}%?),\s(?:\d{1,3}%?)\s(?:\d{1,3}%?))([\w\d\.\s,%\(\)\-]+)\)$/,

/^(-moz-linear-gradient)\(((?:\d{1,3}%?)\s(?:\d{1,3}%?))([\w\d\.\s,%\(\)]+)\)$/,

/^(-webkit-radial-gradient)\(((?:\d{1,3}%?)\s(?:\d{1,3}%?)),\s(\w+)\s([a-z\-]+)([\w\d\.\s,%\(\)]+)\)$/,

/^(-moz-radial-gradient)\(((?:\d{1,3}%?)\s(?:\d{1,3}%?)),\s(\w+)\s?([a-z\-]*)([\w\d\.\s,%\(\)]+)\)$/,

/^(-o-radial-gradient)\(((?:\d{1,3}%?)\s(?:\d{1,3}%?)),\s(\w+)\s([a-z\-]+)([\w\d\.\s,%\(\)]+)\)$/

];

/*

* TODO: Add IE10 vendor prefix (-ms) support

* TODO: Add W3C gradient (linear-gradient) support

* TODO: Add old Webkit -webkit-gradient(radial, ...) support

* TODO: Maybe some RegExp optimizations are possible ;o)

*/

Generate.parseGradient = function(css, bounds) {

var gradient, i, len = reGradients.length, m1, stop, m2, m2Len, step, m3, tl,tr,br,bl;

for(i = 0; i < len; i+=1){

m1 = css.match(reGradients[i]);

if(m1) {

break;

}

}

if(m1) {

switch(m1[1]) {

case '-webkit-linear-gradient':

case '-o-linear-gradient':

gradient = {

type: 'linear',

x0: null,

y0: null,

x1: null,

y1: null,

colorStops: []

};

// get coordinates

m2 = m1[2].match(/\w+/g);

if(m2){

m2Len = m2.length;

for(i = 0; i < m2Len; i+=1){

switch(m2[i]) {

case 'top':

gradient.y0 = 0;

gradient.y1 = bounds.height;

break;

case 'right':

gradient.x0 = bounds.width;

gradient.x1 = 0;

break;

case 'bottom':

gradient.y0 = bounds.height;

gradient.y1 = 0;

break;

case 'left':

gradient.x0 = 0;

gradient.x1 = bounds.width;

break;

}

}

}

if(gradient.x0 === null && gradient.x1 === null){ // center

gradient.x0 = gradient.x1 = bounds.width / 2;

}

if(gradient.y0 === null && gradient.y1 === null){ // center

gradient.y0 = gradient.y1 = bounds.height / 2;

}

// get colors and stops

m2 = m1[3].match(/((?:rgb|rgba)\(\d{1,3},\s\d{1,3},\s\d{1,3}(?:,\s[0-9\.]+)?\)(?:\s\d{1,3}(?:%|px))?)+/g);

if(m2){

m2Len = m2.length;

step = 1 / Math.max(m2Len - 1, 1);

for(i = 0; i < m2Len; i+=1){

m3 = m2[i].match(/((?:rgb|rgba)\(\d{1,3},\s\d{1,3},\s\d{1,3}(?:,\s[0-9\.]+)?\))\s*(\d{1,3})?(%|px)?/);

if(m3[2]){

stop = parseFloat(m3[2]);

if(m3[3] === '%'){

stop /= 100;

} else { // px - stupid opera

stop /= bounds.width;

}

} else {

stop = i * step;

}

gradient.colorStops.push({

color: m3[1],

stop: stop

});

}

}

break;

case '-webkit-gradient':

gradient = {

type: m1[2] === 'radial' ? 'circle' : m1[2], // TODO: Add radial gradient support for older mozilla definitions

x0: 0,

y0: 0,

x1: 0,

y1: 0,

colorStops: []

};

// get coordinates

m2 = m1[3].match(/(\d{1,3})%?\s(\d{1,3})%?,\s(\d{1,3})%?\s(\d{1,3})%?/);

if(m2){

gradient.x0 = (m2[1] * bounds.width) / 100;

gradient.y0 = (m2[2] * bounds.height) / 100;

gradient.x1 = (m2[3] * bounds.width) / 100;

gradient.y1 = (m2[4] * bounds.height) / 100;

}

// get colors and stops

m2 = m1[4].match(/((?:from|to|color-stop)\((?:[0-9\.]+,\s)?(?:rgb|rgba)\(\d{1,3},\s\d{1,3},\s\d{1,3}(?:,\s[0-9\.]+)?\)\))+/g);

if(m2){

m2Len = m2.length;

for(i = 0; i < m2Len; i+=1){

m3 = m2[i].match(/(from|to|color-stop)\(([0-9\.]+)?(?:,\s)?((?:rgb|rgba)\(\d{1,3},\s\d{1,3},\s\d{1,3}(?:,\s[0-9\.]+)?\))\)/);

stop = parseFloat(m3[2]);

if(m3[1] === 'from') {

stop = 0.0;

}

if(m3[1] === 'to') {

stop = 1.0;

}

gradient.colorStops.push({

color: m3[3],

stop: stop

});

}

}

break;

case '-moz-linear-gradient':

gradient = {

type: 'linear',

x0: 0,

y0: 0,

x1: 0,

y1: 0,

colorStops: []

};

// get coordinates

m2 = m1[2].match(/(\d{1,3})%?\s(\d{1,3})%?/);

// m2[1] == 0% -> left

// m2[1] == 50% -> center

// m2[1] == 100% -> right

// m2[2] == 0% -> top

// m2[2] == 50% -> center

// m2[2] == 100% -> bottom

if(m2){

gradient.x0 = (m2[1] * bounds.width) / 100;

gradient.y0 = (m2[2] * bounds.height) / 100;

gradient.x1 = bounds.width - gradient.x0;

gradient.y1 = bounds.height - gradient.y0;

}

// get colors and stops

m2 = m1[3].match(/((?:rgb|rgba)\(\d{1,3},\s\d{1,3},\s\d{1,3}(?:,\s[0-9\.]+)?\)(?:\s\d{1,3}%)?)+/g);

if(m2){

m2Len = m2.length;

step = 1 / Math.max(m2Len - 1, 1);

for(i = 0; i < m2Len; i+=1){

m3 = m2[i].match(/((?:rgb|rgba)\(\d{1,3},\s\d{1,3},\s\d{1,3}(?:,\s[0-9\.]+)?\))\s*(\d{1,3})?(%)?/);

if(m3[2]){

stop = parseFloat(m3[2]);

if(m3[3]){ // percentage

stop /= 100;

}

} else {

stop = i * step;

}

gradient.colorStops.push({

color: m3[1],

stop: stop

});

}

}

break;

case '-webkit-radial-gradient':

case '-moz-radial-gradient':

case '-o-radial-gradient':

gradient = {

type: 'circle',

x0: 0,

y0: 0,

x1: bounds.width,

y1: bounds.height,

cx: 0,

cy: 0,

rx: 0,

ry: 0,

colorStops: []

};

// center

m2 = m1[2].match(/(\d{1,3})%?\s(\d{1,3})%?/);

if(m2){

gradient.cx = (m2[1] * bounds.width) / 100;

gradient.cy = (m2[2] * bounds.height) / 100;

}

// size

m2 = m1[3].match(/\w+/);

m3 = m1[4].match(/[a-z\-]*/);

if(m2 && m3){

switch(m3[0]){

case 'farthest-corner':

case 'cover': // is equivalent to farthest-corner

case '': // mozilla removes "cover" from definition :(

tl = Math.sqrt(Math.pow(gradient.cx, 2) + Math.pow(gradient.cy, 2));

tr = Math.sqrt(Math.pow(gradient.cx, 2) + Math.pow(gradient.y1 - gradient.cy, 2));

br = Math.sqrt(Math.pow(gradient.x1 - gradient.cx, 2) + Math.pow(gradient.y1 - gradient.cy, 2));

bl = Math.sqrt(Math.pow(gradient.x1 - gradient.cx, 2) + Math.pow(gradient.cy, 2));

gradient.rx = gradient.ry = Math.max(tl, tr, br, bl);

break;

case 'closest-corner':

tl = Math.sqrt(Math.pow(gradient.cx, 2) + Math.pow(gradient.cy, 2));

tr = Math.sqrt(Math.pow(gradient.cx, 2) + Math.pow(gradient.y1 - gradient.cy, 2));

br = Math.sqrt(Math.pow(gradient.x1 - gradient.cx, 2) + Math.pow(gradient.y1 - gradient.cy, 2));

bl = Math.sqrt(Math.pow(gradient.x1 - gradient.cx, 2) + Math.pow(gradient.cy, 2));

gradient.rx = gradient.ry = Math.min(tl, tr, br, bl);

break;

case 'farthest-side':

if(m2[0] === 'circle'){

gradient.rx = gradient.ry = Math.max(

gradient.cx,

gradient.cy,

gradient.x1 - gradient.cx,

gradient.y1 - gradient.cy

);

} else { // ellipse

gradient.type = m2[0];

gradient.rx = Math.max(

gradient.cx,

gradient.x1 - gradient.cx

);

gradient.ry = Math.max(

gradient.cy,

gradient.y1 - gradient.cy

);

}

break;

case 'closest-side':

case 'contain': // is equivalent to closest-side

if(m2[0] === 'circle'){

gradient.rx = gradient.ry = Math.min(

gradient.cx,

gradient.cy,

gradient.x1 - gradient.cx,

gradient.y1 - gradient.cy

);

} else { // ellipse

gradient.type = m2[0];

gradient.rx = Math.min(

gradient.cx,

gradient.x1 - gradient.cx

);

gradient.ry = Math.min(

gradient.cy,

gradient.y1 - gradient.cy

);

}

break;

// TODO: add support for "30px 40px" sizes (webkit only)

}

}

// color stops

m2 = m1[5].match(/((?:rgb|rgba)\(\d{1,3},\s\d{1,3},\s\d{1,3}(?:,\s[0-9\.]+)?\)(?:\s\d{1,3}(?:%|px))?)+/g);

if(m2){

m2Len = m2.length;

step = 1 / Math.max(m2Len - 1, 1);

for(i = 0; i < m2Len; i+=1){

m3 = m2[i].match(/((?:rgb|rgba)\(\d{1,3},\s\d{1,3},\s\d{1,3}(?:,\s[0-9\.]+)?\))\s*(\d{1,3})?(%|px)?/);

if(m3[2]){

stop = parseFloat(m3[2]);

if(m3[3] === '%'){

stop /= 100;

} else { // px - stupid opera

stop /= bounds.width;

}

} else {

stop = i * step;

}

gradient.colorStops.push({

color: m3[1],

stop: stop

});

}

}

break;

}

}

return gradient;

};

function addScrollStops(grad) {

return function(colorStop) {

try {

grad.addColorStop(colorStop.stop, colorStop.color);

}

catch(e) {

Util.log(['failed to add color stop: ', e, '; tried to add: ', colorStop]);

}

};

}

Generate.Gradient = function(src, bounds) {

if(bounds.width === 0 || bounds.height === 0) {

return;

}

var canvas = document.createElement('canvas'),

ctx = canvas.getContext('2d'),

gradient, grad;

canvas.width = bounds.width;

canvas.height = bounds.height;

// TODO: add support for multi defined background gradients

gradient = _html2canvas.Generate.parseGradient(src, bounds);

if(gradient) {

switch(gradient.type) {

case 'linear':

grad = ctx.createLinearGradient(gradient.x0, gradient.y0, gradient.x1, gradient.y1);

gradient.colorStops.forEach(addScrollStops(grad));

ctx.fillStyle = grad;

ctx.fillRect(0, 0, bounds.width, bounds.height);

break;

case 'circle':

grad = ctx.createRadialGradient(gradient.cx, gradient.cy, 0, gradient.cx, gradient.cy, gradient.rx);

gradient.colorStops.forEach(addScrollStops(grad));

ctx.fillStyle = grad;

ctx.fillRect(0, 0, bounds.width, bounds.height);

break;

case 'ellipse':

var canvasRadial = document.createElement('canvas'),

ctxRadial = canvasRadial.getContext('2d'),

ri = Math.max(gradient.rx, gradient.ry),

di = ri * 2;

canvasRadial.width = canvasRadial.height = di;

grad = ctxRadial.createRadialGradient(gradient.rx, gradient.ry, 0, gradient.rx, gradient.ry, ri);

gradient.colorStops.forEach(addScrollStops(grad));

ctxRadial.fillStyle = grad;

ctxRadial.fillRect(0, 0, di, di);

ctx.fillStyle = gradient.colorStops[gradient.colorStops.length - 1].color;

ctx.fillRect(0, 0, canvas.width, canvas.height);

ctx.drawImage(canvasRadial, gradient.cx - gradient.rx, gradient.cy - gradient.ry, 2 * gradient.rx, 2 * gradient.ry);

break;

}

}

return canvas;

};

Generate.ListAlpha = function(number) {

var tmp = "",

modulus;

do {

modulus = number % 26;

tmp = String.fromCharCode((modulus) + 64) + tmp;

number = number / 26;

}while((number*26) > 26);

return tmp;

};

Generate.ListRoman = function(number) {

var romanArray = ["M", "CM", "D", "CD", "C", "XC", "L", "XL", "X", "IX", "V", "IV", "I"],

decimal = [1000, 900, 500, 400, 100, 90, 50, 40, 10, 9, 5, 4, 1],

roman = "",

v,

len = romanArray.length;

if (number <= 0 || number >= 4000) {

return number;

}

for (v=0; v < len; v+=1) {

while (number >= decimal[v]) {

number -= decimal[v];

roman += romanArray[v];

}

}

return roman;

};

})();

function h2cRenderContext(width, height) {

var storage = [];

return {

storage: storage,

width: width,

height: height,

clip: function() {

storage.push({

type: "function",

name: "clip",

'arguments': arguments

});

},

translate: function() {

storage.push({

type: "function",

name: "translate",

'arguments': arguments

});

},

fill: function() {

storage.push({

type: "function",

name: "fill",

'arguments': arguments

});

},

save: function() {

storage.push({

type: "function",

name: "save",

'arguments': arguments

});

},

restore: function() {

storage.push({

type: "function",

name: "restore",

'arguments': arguments

});

},

fillRect: function () {

storage.push({

type: "function",

name: "fillRect",

'arguments': arguments

});

},

createPattern: function() {

storage.push({

type: "function",

name: "createPattern",

'arguments': arguments

});

},

drawShape: function() {

var shape = [];

storage.push({

type: "function",

name: "drawShape",

'arguments': shape

});

return {

moveTo: function() {

shape.push({

name: "moveTo",

'arguments': arguments

});

},

lineTo: function() {

shape.push({

name: "lineTo",

'arguments': arguments

});

},

arcTo: function() {

shape.push({

name: "arcTo",

'arguments': arguments

});

},

bezierCurveTo: function() {

shape.push({

name: "bezierCurveTo",

'arguments': arguments

});

},