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

Begin implementing background-image rendering

Browse Source
This commit is contained in:
MoyuScript
2014-01-21 21:41:00 +02:00
parent 1398457f7a
commit 9698eaec5f
11 changed files with 744 additions and 165 deletions
Download Patch File Download Diff File Expand all files Collapse all files

54
src/renderer.js
View File

@@ -1,8 +1,7 @@
function Renderer() {}
function NYI() {
return function() {
throw new Error("Render function not implemented");
};
function Renderer(width, height, images) {
this.width = width;
this.height = height;
this.images = images;
}
Renderer.prototype.renderBackground = function(container, bounds) {
@@ -15,13 +14,7 @@ Renderer.prototype.renderBackground = function(container, bounds) {
Renderer.prototype.renderBackgroundColor = function(container, bounds) {
var color = container.css("backgroundColor");
if (!this.isTransparent(color)) {
this.rectangle(
bounds.left,
bounds.top,
bounds.width,
bounds.height,
container.css("backgroundColor")
);
this.rectangle(bounds.left, bounds.top, bounds.width, bounds.height, container.css("backgroundColor"));
}
};
@@ -36,13 +29,42 @@ Renderer.prototype.renderBorder = function(data) {
};
Renderer.prototype.renderBackgroundImage = function(container, bounds) {
var backgroundImages = container.parseBackgroundImages();
backgroundImages.reverse().forEach(function(backgroundImage, index) {
if (backgroundImage.method === "url") {
var image = this.images.get(backgroundImage.args[0]);
if (image) {
this.renderBackgroundRepeating(container, bounds, image, index);
} else {
log("Error loading background-image", backgroundImage.args[0]);
}
}
}, this);
};
Renderer.prototype.renderBackgroundRepeating = function(container, bounds, imageContainer, index) {
var size = container.parseBackgroundSize(bounds, imageContainer.image, index);
var position = container.parseBackgroundPosition(bounds, imageContainer.image, index, size);
var repeat = container.parseBackgroundRepeat(index);
// image = resizeImage(image, backgroundSize);
switch (repeat) {
case "repeat-x":
case "repeat no-repeat":
this.backgroundRepeatShape(imageContainer, position, bounds, bounds.left, bounds.top + position.top, 99999, imageContainer.image.height);
break;
case "repeat-y":
case "no-repeat repeat":
this.backgroundRepeatShape(imageContainer, position, bounds, bounds.left + position.left, bounds.top, imageContainer.image.width, 99999);
break;
case "no-repeat":
this.backgroundRepeatShape(imageContainer, position, bounds, bounds.left + position.left, bounds.top + position.top, imageContainer.image.width, imageContainer.image.height);
break;
default:
this.renderBackgroundRepeat(imageContainer, position, {top: bounds.top, left: bounds.left});
break;
}
};
Renderer.prototype.isTransparent = function(color) {
return (!color || color === "transparent" || color === "rgba(0, 0, 0, 0)");
};
Renderer.prototype.clip = NYI();
Renderer.prototype.rectangle = NYI();
Renderer.prototype.shape = NYI();