diff --git a/src/Core.js b/src/Core.js index 5e6016b..5148497 100644 --- a/src/Core.js +++ b/src/Core.js @@ -5,18 +5,17 @@ previousElement, computedCSS, html2canvas; -function h2clog(a) { +_html2canvas.Util = {}; + +_html2canvas.Util.log = function(a) { if (_html2canvas.logging && window.console && window.console.log) { window.console.log(a); } -} - -_html2canvas.Util = {}; +}; _html2canvas.Util.trimText = (function(isNative){ - return function(input){ - if(isNative) { return isNative.apply( input ); } - else { return ((input || '') + '').replace( /^\s+|\s+$/g , '' ); } + return function(input) { + return isNative ? isNative.apply(input) : ((input || '') + '').replace( /^\s+|\s+$/g , '' ); }; })(String.prototype.trim); @@ -386,7 +385,7 @@ _html2canvas.Util.Children = function( elem ) { })(elem.childNodes); } catch (ex) { - h2clog("html2canvas.Util.Children failed with exception: " + ex.message); + _html2canvas.Util.log("html2canvas.Util.Children failed with exception: " + ex.message); children = []; } return children; diff --git a/src/Generate.js b/src/Generate.js index eff6b0b..bf3c7cc 100644 --- a/src/Generate.js +++ b/src/Generate.js @@ -1,6 +1,8 @@ (function(){ + var Util = _html2canvas.Util, + Generate = {}; - _html2canvas.Generate = {}; + _html2canvas.Generate = Generate; var reGradients = [ /^(-webkit-linear-gradient)\(([a-z\s]+)([\w\d\.\s,%\(\)]+)\)$/, @@ -18,7 +20,7 @@ * TODO: Add old Webkit -webkit-gradient(radial, ...) support * TODO: Maybe some RegExp optimizations are possible ;o) */ - _html2canvas.Generate.parseGradient = function(css, bounds) { + 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){ @@ -320,14 +322,25 @@ return gradient; }; - _html2canvas.Generate.Gradient = function(src, bounds) { + 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, i, len; + gradient, grad; canvas.width = bounds.width; canvas.height = bounds.height; @@ -336,72 +349,46 @@ gradient = _html2canvas.Generate.parseGradient(src, bounds); if(gradient) { - if(gradient.type === 'linear') { - grad = ctx.createLinearGradient(gradient.x0, gradient.y0, gradient.x1, gradient.y1); + 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; - for (i = 0, len = gradient.colorStops.length; i < len; i+=1) { - try { - grad.addColorStop(gradient.colorStops[i].stop, gradient.colorStops[i].color); - } - catch(e) { - h2clog(['failed to add color stop: ', e, '; tried to add: ', gradient.colorStops[i], '; stop: ', i, '; in: ', src]); - } - } + 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; - ctx.fillStyle = grad; - ctx.fillRect(0, 0, bounds.width, bounds.height); + case 'ellipse': + var canvasRadial = document.createElement('canvas'), + ctxRadial = canvasRadial.getContext('2d'), + ri = Math.max(gradient.rx, gradient.ry), + di = ri * 2; - } else if(gradient.type === 'circle') { + canvasRadial.width = canvasRadial.height = di; - grad = ctx.createRadialGradient(gradient.cx, gradient.cy, 0, gradient.cx, gradient.cy, gradient.rx); + grad = ctxRadial.createRadialGradient(gradient.rx, gradient.ry, 0, gradient.rx, gradient.ry, ri); + gradient.colorStops.forEach(addScrollStops(grad)); - for (i = 0, len = gradient.colorStops.length; i < len; i+=1) { - try { - grad.addColorStop(gradient.colorStops[i].stop, gradient.colorStops[i].color); - } - catch(e) { - h2clog(['failed to add color stop: ', e, '; tried to add: ', gradient.colorStops[i], '; stop: ', i, '; in: ', src]); - } - } - - ctx.fillStyle = grad; - ctx.fillRect(0, 0, bounds.width, bounds.height); - - } else if(gradient.type === 'ellipse') { - - // draw circle - var canvasRadial = document.createElement('canvas'), - ctxRadial = canvasRadial.getContext('2d'), - ri = Math.max(gradient.rx, gradient.ry), - di = ri * 2, imgRadial; - - canvasRadial.width = canvasRadial.height = di; - - grad = ctxRadial.createRadialGradient(gradient.rx, gradient.ry, 0, gradient.rx, gradient.ry, ri); - - for (i = 0, len = gradient.colorStops.length; i < len; i+=1) { - try { - grad.addColorStop(gradient.colorStops[i].stop, gradient.colorStops[i].color); - } - catch(e) { - h2clog(['failed to add color stop: ', e, '; tried to add: ', gradient.colorStops[i], '; stop: ', i, '; in: ', src]); - } - } - - ctxRadial.fillStyle = grad; - ctxRadial.fillRect(0, 0, di, di); - - ctx.fillStyle = gradient.colorStops[i - 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); + 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; }; - _html2canvas.Generate.ListAlpha = function(number) { + Generate.ListAlpha = function(number) { var tmp = "", modulus; @@ -414,7 +401,7 @@ return tmp; }; - _html2canvas.Generate.ListRoman = function(number) { + 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 = "", @@ -433,7 +420,5 @@ } return roman; - }; - })(); \ No newline at end of file diff --git a/src/Parse.js b/src/Parse.js index 5ee38e4..5b9405c 100644 --- a/src/Parse.js +++ b/src/Parse.js @@ -734,7 +734,7 @@ _html2canvas.Parse = function (images, options) { valueWrap.style[property] = getCSS(el, property); } catch(e) { // Older IE has issues with "border" - h2clog("html2canvas: Parse: Exception caught in renderFormValue: " + e.message); + Util.log("html2canvas: Parse: Exception caught in renderFormValue: " + e.message); } }); @@ -791,7 +791,7 @@ _html2canvas.Parse = function (images, options) { try { elps.style[prop] = elStyle[prop]; } catch (e) { - h2clog(['Tried to assign readonly property ', prop, 'Error:', e]); + Util.log(['Tried to assign readonly property ', prop, 'Error:', e]); } }); @@ -925,7 +925,7 @@ _html2canvas.Parse = function (images, options) { if (image) { renderBackgroundRepeating(element, bounds, ctx, image, imageIndex); } else { - h2clog("html2canvas: Error loading background:", backgroundImage); + Util.log("html2canvas: Error loading background:", backgroundImage); } } } @@ -1041,7 +1041,7 @@ _html2canvas.Parse = function (images, options) { if ((image = loadImage(element.getAttribute('src')))) { renderImage(ctx, element, image, bounds, borders); } else { - h2clog("html2canvas: Error loading :" + element.getAttribute('src')); + Util.log("html2canvas: Error loading :" + element.getAttribute('src')); } break; case "INPUT": diff --git a/src/Preload.js b/src/Preload.js index 9fb176a..e826057 100644 --- a/src/Preload.js +++ b/src/Preload.js @@ -7,6 +7,7 @@ _html2canvas.Preload = function( options ) { cleanupDone: false }, pageOrigin, + Util = _html2canvas.Util, methods, i, count = 0, @@ -31,9 +32,9 @@ _html2canvas.Preload = function( options ) { } function start(){ - h2clog("html2canvas: start: images: " + images.numLoaded + " / " + images.numTotal + " (failed: " + images.numFailed + ")"); + Util.log("html2canvas: start: images: " + images.numLoaded + " / " + images.numTotal + " (failed: " + images.numFailed + ")"); if (!images.firstRun && images.numLoaded >= images.numTotal){ - h2clog("Finished loading images: # " + images.numTotal + " (failed: " + images.numFailed + ")"); + Util.log("Finished loading images: # " + images.numTotal + " (failed: " + images.numFailed + ")"); if (typeof options.complete === "function"){ options.complete(images); @@ -141,9 +142,7 @@ _html2canvas.Preload = function( options ) { // Firefox fails with permission denied on pages with iframes try { - _html2canvas.Util.Children(el).forEach(function(img) { - getImages(img); - }); + Util.Children(el).forEach(getImages); } catch( e ) {} @@ -151,15 +150,15 @@ _html2canvas.Preload = function( options ) { elNodeType = el.nodeType; } catch (ex) { elNodeType = false; - h2clog("html2canvas: failed to access some element's nodeType - Exception: " + ex.message); + Util.log("html2canvas: failed to access some element's nodeType - Exception: " + ex.message); } if (elNodeType === 1 || elNodeType === undefined) { loadPseudoElementImages(el); try { - loadBackgroundImages(_html2canvas.Util.getCSS(el, 'backgroundImage'), el); + loadBackgroundImages(Util.getCSS(el, 'backgroundImage'), el); } catch(e) { - h2clog("html2canvas: failed to get background-image - Exception: " + e.message); + Util.log("html2canvas: failed to get background-image - Exception: " + e.message); } loadBackgroundImages(el); } @@ -256,9 +255,9 @@ _html2canvas.Preload = function( options ) { var img, src; if (!images.cleanupDone) { if (cause && typeof cause === "string") { - h2clog("html2canvas: Cleanup because: " + cause); + Util.log("html2canvas: Cleanup because: " + cause); } else { - h2clog("html2canvas: Cleanup after timeout: " + options.timeout + " ms."); + Util.log("html2canvas: Cleanup after timeout: " + options.timeout + " ms."); } for (src in images) { @@ -276,7 +275,7 @@ _html2canvas.Preload = function( options ) { } images.numLoaded++; images.numFailed++; - h2clog("html2canvas: Cleaned up failed img: '" + src + "' Steps: " + images.numLoaded + " / " + images.numTotal); + Util.log("html2canvas: Cleaned up failed img: '" + src + "' Steps: " + images.numLoaded + " / " + images.numTotal); } } } @@ -308,23 +307,22 @@ _html2canvas.Preload = function( options ) { timeoutTimer = window.setTimeout(methods.cleanupDOM, options.timeout); } - h2clog('html2canvas: Preload starts: finding background-images'); + Util.log('html2canvas: Preload starts: finding background-images'); images.firstRun = true; getImages(element); - h2clog('html2canvas: Preload: Finding images'); + Util.log('html2canvas: Preload: Finding images'); // load images for (i = 0; i < imgLen; i+=1){ methods.loadImage( domImages[i].getAttribute( "src" ) ); } images.firstRun = false; - h2clog('html2canvas: Preload: Done.'); - if ( images.numTotal === images.numLoaded ) { + Util.log('html2canvas: Preload: Done.'); + if (images.numTotal === images.numLoaded) { start(); } return methods; - }; diff --git a/src/Support.js b/src/Support.js index c2db49d..34e2622 100644 --- a/src/Support.js +++ b/src/Support.js @@ -24,7 +24,7 @@ _html2canvas.Util.Support = function (options, doc) { } catch(e) { return false; } - h2clog('html2canvas: Parse: SVG powered rendering available'); + _html2canvas.Util.log('html2canvas: Parse: SVG powered rendering available'); return true; } diff --git a/src/Util.js b/src/Util.js index baa0325..861402b 100644 --- a/src/Util.js +++ b/src/Util.js @@ -71,11 +71,11 @@ window.html2canvas = function(elements, opts) { preload: function( opts ) { return _html2canvas.Preload( _html2canvas.Util.Extend(opts, options) ); }, - log: h2clog + log: _html2canvas.Util.log }; }; -window.html2canvas.log = h2clog; // for renderers +window.html2canvas.log = _html2canvas.Util.log; // for renderers window.html2canvas.Renderer = { Canvas: undefined // We are assuming this will be used }; \ No newline at end of file diff --git a/src/renderers/Canvas.js b/src/renderers/Canvas.js index ad1ccc9..1a6045b 100644 --- a/src/renderers/Canvas.js +++ b/src/renderers/Canvas.js @@ -46,7 +46,7 @@ _html2canvas.Renderer.Canvas = function(options) { ctx.fillStyle = ctx.createPattern(item['arguments'][0], "repeat"); } catch(e) { - h2clog("html2canvas: Renderer: Error creating pattern", e.message); + _html2canvas.Util.log("html2canvas: Renderer: Error creating pattern", e.message); } } } else if (item.name === "drawShape") { @@ -101,7 +101,7 @@ _html2canvas.Renderer.Canvas = function(options) { ctx.restore(); }); - h2clog("html2canvas: Renderer: Canvas renderer done - returning canvas obj"); + _html2canvas.Util.log("html2canvas: Renderer: Canvas renderer done - returning canvas obj"); if (options.elements.length === 1) { if (typeof options.elements[0] === "object" && options.elements[0].nodeName !== "BODY") { diff --git a/src/renderers/SVG.js b/src/renderers/SVG.js index 747e045..e635077 100644 --- a/src/renderers/SVG.js +++ b/src/renderers/SVG.js @@ -194,7 +194,7 @@ _html2canvas.Renderer.SVG = function( options ) { - h2clog("html2canvas: Renderer: SVG Renderer done - returning SVG DOM obj"); + _html2canvas.Util.log("html2canvas: Renderer: SVG Renderer done - returning SVG DOM obj"); return svg; }