backgroundPosition should use backgroundSize as a baseline for %'s

This commit is contained in:
Andy Edinborough 2013-01-02 13:45:58 -06:00
parent 9b5ae9e191
commit eb57b61859
2 changed files with 18 additions and 18 deletions

View File

@ -267,7 +267,7 @@ _html2canvas.Util.resizeBounds = function( current_width, current_height, target
return { width: output_width, height: output_height }; return { width: output_width, height: output_height };
}; };
function backgroundBoundsFactory( prop, el, bounds, image, imageIndex ) { function backgroundBoundsFactory( prop, el, bounds, image, imageIndex, backgroundSize ) {
var bgposition = _html2canvas.Util.getCSS( el, prop, imageIndex ) , var bgposition = _html2canvas.Util.getCSS( el, prop, imageIndex ) ,
topPos, topPos,
left, left,
@ -287,7 +287,7 @@ function backgroundBoundsFactory( prop, el, bounds, image, imageIndex ) {
percentage = (parseFloat(bgposition[0])/100); percentage = (parseFloat(bgposition[0])/100);
left = bounds.width * percentage; left = bounds.width * percentage;
if(prop !== 'backgroundSize') { if(prop !== 'backgroundSize') {
left -= image.width*percentage; left -= (backgroundSize || image).width*percentage;
} }
} else { } else {
@ -315,7 +315,7 @@ function backgroundBoundsFactory( prop, el, bounds, image, imageIndex ) {
percentage = (parseFloat(bgposition[1])/100); percentage = (parseFloat(bgposition[1])/100);
topPos = bounds.height * percentage; topPos = bounds.height * percentage;
if(prop !== 'backgroundSize') { if(prop !== 'backgroundSize') {
topPos -= image.height * percentage; topPos -= (backgroundSize || image).height * percentage;
} }
} else { } else {
@ -326,8 +326,8 @@ function backgroundBoundsFactory( prop, el, bounds, image, imageIndex ) {
return [left, topPos]; return [left, topPos];
} }
_html2canvas.Util.BackgroundPosition = function( el, bounds, image, imageIndex ) { _html2canvas.Util.BackgroundPosition = function( el, bounds, image, imageIndex, backgroundSize ) {
var result = backgroundBoundsFactory( 'backgroundPosition', el, bounds, image, imageIndex ); var result = backgroundBoundsFactory( 'backgroundPosition', el, bounds, image, imageIndex, backgroundSize );
return { left: result[0], top: result[1] }; return { left: result[0], top: result[1] };
}; };
_html2canvas.Util.BackgroundSize = function( el, bounds, image, imageIndex ) { _html2canvas.Util.BackgroundSize = function( el, bounds, image, imageIndex ) {

View File

@ -555,28 +555,28 @@ _html2canvas.Parse = function (images, options) {
} }
function renderBackgroundNoRepeat(ctx, image, backgroundPosition, x, y, w, h) { function renderBackgroundNoRepeat(ctx, image, backgroundPosition, x, y, w, h) {
var bgdw = w, // - backgroundPosition.left, var bgdw = w - backgroundPosition.left,
bgdh = h, // - backgroundPosition.top, bgdh = h - backgroundPosition.top,
bgsx = backgroundPosition.left, bgsx = backgroundPosition.left,
bgsy = backgroundPosition.top, bgsy = backgroundPosition.top,
bgdx = backgroundPosition.left + x, bgdx = backgroundPosition.left + x,
bgdy = backgroundPosition.top + y; bgdy = backgroundPosition.top + y;
if (bgsx<0){ if (bgsx<0){
bgsx = Math.abs(bgsx); bgsx = Math.abs( bgsx );
bgdx += bgsx; bgdx += bgsx;
bgdw = Math.min(w,image.width-bgsx); bgdw = Math.min( w, image.width - bgsx );
} else { } else {
bgdw = Math.min(bgdw,image.width); bgdw = Math.min( bgdw, image.width );
bgsx = 0; bgsx = 0;
} }
if (bgsy < 0){ if (bgsy < 0){
bgsy = Math.abs(bgsy); bgsy = Math.abs( bgsy );
bgdy += bgsy; bgdy += bgsy;
bgdh = Math.min(h, image.height - bgsy); bgdh = Math.min( h, image.height - bgsy );
} else { } else {
bgdh = Math.min(bgdh, image.height); bgdh = Math.min( bgdh, image.height );
bgsy = 0; bgsy = 0;
} }
@ -590,8 +590,8 @@ _html2canvas.Parse = function (images, options) {
image.height, image.height,
bgdx, bgdx,
bgdy, bgdy,
bgdw, bgdw + backgroundPosition.left,
bgdh bgdh + backgroundPosition.top
); );
} }
} }
@ -634,9 +634,9 @@ _html2canvas.Parse = function (images, options) {
} }
function renderBackgroundRepeating(el, bounds, ctx, image, imageIndex) { function renderBackgroundRepeating(el, bounds, ctx, image, imageIndex) {
var backgroundPosition = _html2canvas.Util.BackgroundPosition(el, bounds, image, imageIndex), var backgroundSize = _html2canvas.Util.BackgroundSize(el, bounds, image, imageIndex),
backgroundRepeat = getCSS(el, "backgroundRepeat").split(","), backgroundPosition = _html2canvas.Util.BackgroundPosition(el, bounds, image, imageIndex, backgroundSize),
backgroundSize = _html2canvas.Util.BackgroundSize(el, bounds, image, imageIndex); backgroundRepeat = getCSS(el, "backgroundRepeat").split(",");
backgroundRepeat = backgroundRepeat[imageIndex] || backgroundRepeat[0]; backgroundRepeat = backgroundRepeat[imageIndex] || backgroundRepeat[0];