mirror/html2canvas
1
0
Fork 0
mirror of https://github.com/niklasvh/html2canvas.git synced 2023-08-10 21:13:10 +03:00
Code Issues Projects Releases Wiki Activity

Refactoring logging and gradients

Browse Source
This commit is contained in:
MoyuScript 2013-08-06 18:55:04 +03:00
parent 965104be57
commit 6aa73c3b93
8 changed files with 77 additions and 95 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

15
src/Core.js
View File

@ -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;

107
src/Generate.js
View File

@ -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;
};
})();

8
src/Parse.js
View File

@ -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 <img>:" + element.getAttribute('src'));
Util.log("html2canvas: Error loading <img>:" + element.getAttribute('src'));
}
break;
case "INPUT":

30
src/Preload.js
View File

@ -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 <img> 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;
};

2
src/Support.js
View File

@ -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;
}

4
src/Util.js
View File

@ -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
};

4
src/renderers/Canvas.js
View File

@ -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") {

2
src/renderers/SVG.js
View File

@ -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;
}