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

Correctly assign image loading method for <img> elements

Browse Source
This commit is contained in:
MoyuScript 2014-02-08 14:07:20 +02:00
parent 69390d6b8f
commit f1482b8c2f
6 changed files with 195 additions and 179 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

186
build/html2canvas.js
View File

@ -22,8 +22,8 @@ window.html2canvas = function(nodeList, options) {
}); });
}; };
function renderDocument(document, options, width, height) { function renderDocument(document, options, windowWidth, windowHeight) {
return createWindowClone(document, width, height).then(function(container) { return createWindowClone(document, windowWidth, windowHeight).then(function(container) {
log("Document cloned"); log("Document cloned");
var clonedWindow = container.contentWindow; var clonedWindow = container.contentWindow;
//var element = (nodeList === undefined) ? document.body : nodeList[0]; //var element = (nodeList === undefined) ? document.body : nodeList[0];
@ -31,8 +31,8 @@ function renderDocument(document, options, width, height) {
var support = new Support(); var support = new Support();
var imageLoader = new ImageLoader(options, support); var imageLoader = new ImageLoader(options, support);
var bounds = NodeParser.prototype.getBounds(node); var bounds = NodeParser.prototype.getBounds(node);
var width = options.type === "view" ? Math.min(bounds.width, width) : documentWidth(); var width = options.type === "view" ? Math.min(bounds.width, windowWidth) : documentWidth();
var height = options.type === "view" ? Math.min(bounds.height, height) : documentHeight(); var height = options.type === "view" ? Math.min(bounds.height, windowHeight) : documentHeight();
var renderer = new CanvasRenderer(width, height, imageLoader); var renderer = new CanvasRenderer(width, height, imageLoader);
var parser = new NodeParser(node, renderer, support, imageLoader, options); var parser = new NodeParser(node, renderer, support, imageLoader, options);
return parser.ready.then(function() { return parser.ready.then(function() {
@ -208,7 +208,7 @@ function ImageLoader(options, support) {
ImageLoader.prototype.findImages = function(nodes) { ImageLoader.prototype.findImages = function(nodes) {
var images = []; var images = [];
nodes.filter(isImage).map(src).forEach(this.addImage(images, this.loadImage), this); nodes.filter(isImage).map(urlImage).forEach(this.addImage(images, this.loadImage), this);
return images; return images;
}; };
@ -294,8 +294,11 @@ function isImage(container) {
return container.node.nodeName === "IMG"; return container.node.nodeName === "IMG";
} }
function src(container) { function urlImage(container) {
return container.node.src; return {
args: [container.node.src],
method: "url"
};
} }
function LinearGradientContainer(imageData) { function LinearGradientContainer(imageData) {
@ -390,101 +393,104 @@ NodeContainer.prototype.fontWeight = function() {
}; };
NodeContainer.prototype.parseBackgroundImages = function() { NodeContainer.prototype.parseBackgroundImages = function() {
var whitespace = ' \r\n\t', function parseBackgrounds(backgroundImage) {
method, definition, prefix, prefix_i, block, results = [], var whitespace = ' \r\n\t',
mode = 0, numParen = 0, quote, args; method, definition, prefix, prefix_i, block, results = [],
var appendResult = function() { mode = 0, numParen = 0, quote, args;
if(method) { var appendResult = function() {
if (definition.substr(0, 1) === '"') { if(method) {
definition = definition.substr(1, definition.length - 2); 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,
image: null
});
} }
if (definition) { args = [];
args.push(definition); method = prefix = definition = block = '';
} };
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,
image: null
});
}
args = []; args = [];
method = prefix = definition = block = ''; method = prefix = definition = block = '';
}; backgroundImage.split("").forEach(function(c) {
args = []; if (mode === 0 && whitespace.indexOf(c) > -1) {
method = prefix = definition = block = ''; return;
this.css("backgroundImage").split("").forEach(function(c) { }
if (mode === 0 && whitespace.indexOf(c) > -1) { switch(c) {
return; case '"':
} if(!quote) {
switch(c) { quote = c;
case '"': }
if(!quote) { else if(quote === c) {
quote = c; quote = null;
} }
else if(quote === c) {
quote = null;
}
break;
case '(':
if(quote) {
break; break;
} else if(mode === 0) { case '(':
mode = 1; if(quote) {
block += c; break;
return; } else if(mode === 0) {
} else { mode = 1;
numParen++;
}
break;
case ')':
if (quote) {
break;
} else if(mode === 1) {
if(numParen === 0) {
mode = 0;
block += c; block += c;
appendResult();
return; return;
} else { } else {
numParen--; numParen++;
} }
}
break;
case ',':
if (quote) {
break; break;
} else if(mode === 0) { case ')':
appendResult(); if (quote) {
return; break;
} else if (mode === 1) { } else if(mode === 1) {
if (numParen === 0 && !method.match(/^url$/i)) { if(numParen === 0) {
args.push(definition); mode = 0;
definition = ''; block += c;
block += c; appendResult();
return; return;
} else {
numParen--;
}
} }
} break;
break;
}
block += c; case ',':
if (mode === 0) { if (quote) {
method += c; break;
} else { } else if(mode === 0) {
definition += c; appendResult();
} return;
}); } else if (mode === 1) {
if (numParen === 0 && !method.match(/^url$/i)) {
args.push(definition);
definition = '';
block += c;
return;
}
}
break;
}
appendResult(); block += c;
if (mode === 0) {
method += c;
} else {
definition += c;
}
});
return this.backgroundImages || (this.backgroundImages = results); appendResult();
return results;
}
return this.backgroundImages || (this.backgroundImages = parseBackgrounds(this.css("backgroundImage")));
}; };
NodeContainer.prototype.cssList = function(property, index) { NodeContainer.prototype.cssList = function(property, index) {
@ -1225,6 +1231,8 @@ Renderer.prototype.renderBackgroundImage = function(container, bounds) {
log("Error loading background-image", backgroundImage.args[0]); log("Error loading background-image", backgroundImage.args[0]);
} }
break; break;
case "none":
break;
default: default:
log("Unknown background-image type", backgroundImage.args[0]); log("Unknown background-image type", backgroundImage.args[0]);
} }

2
build/html2canvas.min.js vendored
View File

File diff suppressed because one or more lines are too long

8
src/core.js
View File

@ -13,8 +13,8 @@ window.html2canvas = function(nodeList, options) {
}); });
}; };
function renderDocument(document, options, width, height) { function renderDocument(document, options, windowWidth, windowHeight) {
return createWindowClone(document, width, height).then(function(container) { return createWindowClone(document, windowWidth, windowHeight).then(function(container) {
log("Document cloned"); log("Document cloned");
var clonedWindow = container.contentWindow; var clonedWindow = container.contentWindow;
//var element = (nodeList === undefined) ? document.body : nodeList[0]; //var element = (nodeList === undefined) ? document.body : nodeList[0];
@ -22,8 +22,8 @@ function renderDocument(document, options, width, height) {
var support = new Support(); var support = new Support();
var imageLoader = new ImageLoader(options, support); var imageLoader = new ImageLoader(options, support);
var bounds = NodeParser.prototype.getBounds(node); var bounds = NodeParser.prototype.getBounds(node);
var width = options.type === "view" ? Math.min(bounds.width, width) : documentWidth(); var width = options.type === "view" ? Math.min(bounds.width, windowWidth) : documentWidth();
var height = options.type === "view" ? Math.min(bounds.height, height) : documentHeight(); var height = options.type === "view" ? Math.min(bounds.height, windowHeight) : documentHeight();
var renderer = new CanvasRenderer(width, height, imageLoader); var renderer = new CanvasRenderer(width, height, imageLoader);
var parser = new NodeParser(node, renderer, support, imageLoader, options); var parser = new NodeParser(node, renderer, support, imageLoader, options);
return parser.ready.then(function() { return parser.ready.then(function() {

9
src/imageloader.js
View File

@ -7,7 +7,7 @@ function ImageLoader(options, support) {
ImageLoader.prototype.findImages = function(nodes) { ImageLoader.prototype.findImages = function(nodes) {
var images = []; var images = [];
nodes.filter(isImage).map(src).forEach(this.addImage(images, this.loadImage), this); nodes.filter(isImage).map(urlImage).forEach(this.addImage(images, this.loadImage), this);
return images; return images;
}; };
@ -93,6 +93,9 @@ function isImage(container) {
return container.node.nodeName === "IMG"; return container.node.nodeName === "IMG";
} }
function src(container) { function urlImage(container) {
return container.node.src; return {
args: [container.node.src],
method: "url"
};
} }

167
src/nodecontainer.js
View File

@ -50,101 +50,104 @@ NodeContainer.prototype.fontWeight = function() {
}; };
NodeContainer.prototype.parseBackgroundImages = function() { NodeContainer.prototype.parseBackgroundImages = function() {
var whitespace = ' \r\n\t', function parseBackgrounds(backgroundImage) {
method, definition, prefix, prefix_i, block, results = [], var whitespace = ' \r\n\t',
mode = 0, numParen = 0, quote, args; method, definition, prefix, prefix_i, block, results = [],
var appendResult = function() { mode = 0, numParen = 0, quote, args;
if(method) { var appendResult = function() {
if (definition.substr(0, 1) === '"') { if(method) {
definition = definition.substr(1, definition.length - 2); 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,
image: null
});
} }
if (definition) { args = [];
args.push(definition); method = prefix = definition = block = '';
} };
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,
image: null
});
}
args = []; args = [];
method = prefix = definition = block = ''; method = prefix = definition = block = '';
}; backgroundImage.split("").forEach(function(c) {
args = []; if (mode === 0 && whitespace.indexOf(c) > -1) {
method = prefix = definition = block = ''; return;
this.css("backgroundImage").split("").forEach(function(c) { }
if (mode === 0 && whitespace.indexOf(c) > -1) { switch(c) {
return; case '"':
} if(!quote) {
switch(c) { quote = c;
case '"': }
if(!quote) { else if(quote === c) {
quote = c; quote = null;
} }
else if(quote === c) {
quote = null;
}
break;
case '(':
if(quote) {
break; break;
} else if(mode === 0) { case '(':
mode = 1; if(quote) {
block += c; break;
return; } else if(mode === 0) {
} else { mode = 1;
numParen++;
}
break;
case ')':
if (quote) {
break;
} else if(mode === 1) {
if(numParen === 0) {
mode = 0;
block += c; block += c;
appendResult();
return; return;
} else { } else {
numParen--; numParen++;
} }
}
break;
case ',':
if (quote) {
break; break;
} else if(mode === 0) { case ')':
appendResult(); if (quote) {
return; break;
} else if (mode === 1) { } else if(mode === 1) {
if (numParen === 0 && !method.match(/^url$/i)) { if(numParen === 0) {
args.push(definition); mode = 0;
definition = ''; block += c;
block += c; appendResult();
return; return;
} else {
numParen--;
}
} }
} break;
break;
}
block += c; case ',':
if (mode === 0) { if (quote) {
method += c; break;
} else { } else if(mode === 0) {
definition += c; appendResult();
} return;
}); } else if (mode === 1) {
if (numParen === 0 && !method.match(/^url$/i)) {
args.push(definition);
definition = '';
block += c;
return;
}
}
break;
}
appendResult(); block += c;
if (mode === 0) {
method += c;
} else {
definition += c;
}
});
return this.backgroundImages || (this.backgroundImages = results); appendResult();
return results;
}
return this.backgroundImages || (this.backgroundImages = parseBackgrounds(this.css("backgroundImage")));
}; };
NodeContainer.prototype.cssList = function(property, index) { NodeContainer.prototype.cssList = function(property, index) {

2
src/renderer.js
View File

@ -69,6 +69,8 @@ Renderer.prototype.renderBackgroundImage = function(container, bounds) {
log("Error loading background-image", backgroundImage.args[0]); log("Error loading background-image", backgroundImage.args[0]);
} }
break; break;
case "none":
break;
default: default:
log("Unknown background-image type", backgroundImage.args[0]); log("Unknown background-image type", backgroundImage.args[0]);
} }