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

fixed image search for iframes + added default content for iframes and flash content

Browse Source
This commit is contained in:
Niklas von Hertzen 2011-07-17 02:19:26 +03:00
parent 4e19e99756
commit ead984a1f1
6 changed files with 89 additions and 34 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

50
build/html2canvas.js
View File

@ -43,6 +43,7 @@ function html2canvas(el, userOptions) {
ready: function (canvas) {
document.body.appendChild(canvas);
},
iframeDefault: "default",
flashCanvasPath: "http://html2canvas.hertzen.com/external/flashcanvas/flashcanvas.js",
renderViewport: false
});
@ -60,7 +61,7 @@ function html2canvas(el, userOptions) {
this.fontData = [];
this.ignoreElements = "IFRAME|OBJECT|PARAM";
this.ignoreRe = new RegExp("("+this.ignoreElements+")");
// test how to measure text bounding boxes
this.useRangeBounds = false;
@ -434,8 +435,8 @@ html2canvas.prototype.newElement = function(el){
/*
* TODO add support for different border-style's than solid
*/
* TODO add support for different border-style's than solid
*/
var borders = this.getBorderData(el);
this.each(borders,function(borderSide,borderData){
@ -473,7 +474,18 @@ html2canvas.prototype.newElement = function(el){
});
if (this.ignoreRe.test(el.nodeName) && this.opts.iframeDefault != "transparent"){
if (this.opts.iframeDefault=="default"){
bgcolor = "#efefef";
/*
* TODO write X over frame
*/
}else{
bgcolor = this.opts.iframeDefault;
}
}
// draw base element bgcolor
this.newRect(
@ -546,13 +558,15 @@ html2canvas.prototype.getImages = function(el) {
var self = this;
// TODO remove jQuery dependancy
this.each($(el).contents(),function(i,element){
var ignRe = new RegExp("("+this.ignoreElements+")");
if (!ignRe.test(element.nodeName)){
self.getImages(element);
}
})
if (!this.ignoreRe.test(el.nodeName)){
// TODO remove jQuery dependancy
this.each($(el).contents(),function(i,element){
var ignRe = new RegExp("("+this.ignoreElements+")");
if (!ignRe.test(element.nodeName)){
self.getImages(element);
}
})
}
if (el.nodeType==1 || typeof el.nodeType == "undefined"){
var background_image = this.getCSS(el,'background-image');
@ -826,8 +840,8 @@ html2canvas.prototype.trim = function(text) {
html2canvas.prototype.parseElement = function(element){
var _ = this;
this.each(element.children,function(index,el){
var _ = this;
this.each(element.children,function(index,el){
_.parsing(el);
});
@ -838,13 +852,15 @@ html2canvas.prototype.parseElement = function(element){
html2canvas.prototype.parsing = function(el){
var ignRe = new RegExp("("+this.ignoreElements+")");
var _ = this;
if (!ignRe.test(el.nodeName)){
this.newElement(el);
if (!this.ignoreRe.test(el.nodeName)){
this.newElement(el);
// TODO remove jQuery dependancy
var contents = $(el).contents();

3
src/Core.js
View File

@ -13,6 +13,7 @@ function html2canvas(el, userOptions) {
ready: function (canvas) {
document.body.appendChild(canvas);
},
iframeDefault: "default",
flashCanvasPath: "http://html2canvas.hertzen.com/external/flashcanvas/flashcanvas.js",
renderViewport: false
});
@ -30,7 +31,7 @@ function html2canvas(el, userOptions) {
this.fontData = [];
this.ignoreElements = "IFRAME|OBJECT|PARAM";
this.ignoreRe = new RegExp("("+this.ignoreElements+")");
// test how to measure text bounding boxes
this.useRangeBounds = false;

17
src/Draw.js
View File

@ -18,8 +18,8 @@ html2canvas.prototype.newElement = function(el){
/*
* TODO add support for different border-style's than solid
*/
* TODO add support for different border-style's than solid
*/
var borders = this.getBorderData(el);
this.each(borders,function(borderSide,borderData){
@ -57,7 +57,18 @@ html2canvas.prototype.newElement = function(el){
});
if (this.ignoreRe.test(el.nodeName) && this.opts.iframeDefault != "transparent"){
if (this.opts.iframeDefault=="default"){
bgcolor = "#efefef";
/*
* TODO write X over frame
*/
}else{
bgcolor = this.opts.iframeDefault;
}
}
// draw base element bgcolor
this.newRect(

16
src/Images.js
View File

@ -5,13 +5,15 @@ html2canvas.prototype.getImages = function(el) {
var self = this;
// TODO remove jQuery dependancy
this.each($(el).contents(),function(i,element){
var ignRe = new RegExp("("+this.ignoreElements+")");
if (!ignRe.test(element.nodeName)){
self.getImages(element);
}
})
if (!this.ignoreRe.test(el.nodeName)){
// TODO remove jQuery dependancy
this.each($(el).contents(),function(i,element){
var ignRe = new RegExp("("+this.ignoreElements+")");
if (!ignRe.test(element.nodeName)){
self.getImages(element);
}
})
}
if (el.nodeType==1 || typeof el.nodeType == "undefined"){
var background_image = this.getCSS(el,'background-image');

14
src/Traversing.js
View File

@ -1,8 +1,8 @@
html2canvas.prototype.parseElement = function(element){
var _ = this;
this.each(element.children,function(index,el){
var _ = this;
this.each(element.children,function(index,el){
_.parsing(el);
});
@ -13,13 +13,15 @@ html2canvas.prototype.parseElement = function(element){
html2canvas.prototype.parsing = function(el){
var ignRe = new RegExp("("+this.ignoreElements+")");
var _ = this;
if (!ignRe.test(el.nodeName)){
this.newElement(el);
if (!this.ignoreRe.test(el.nodeName)){
this.newElement(el);
// TODO remove jQuery dependancy
var contents = $(el).contents();

23
tests/external-content.html Normal file
View File

@ -0,0 +1,23 @@
<!DOCTYPE html>
<html>
<head>
<title>External content tests</title>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
<link href="#" type="text/css" rel="stylesheet">
<script type="text/javascript" src="../external/jquery-1.6.2.js"></script>
<script type="text/javascript" src="../build/html2canvas.js"></script>
<script type="text/javascript" src="../build/jquery.plugin.html2canvas.js"></script>
<script type="text/javascript">
$(window).ready(function() {
$('body').html2canvas();
});
</script>
</head>
<body>
<h1>Iframe</h1>
<iframe src="http://www.google.com" style="width:400px;height:300px;border:5px solid black;"></iframe>
</body>
</html>