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

"center gradient BugFix"

Browse Source
This commit is contained in:
MoyuScript 2012-03-07 18:20:09 +00:00
parent 36a47e4a02
commit 2c41507d7c
3 changed files with 25 additions and 20 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

24
src/Generate.js
View File

@ -42,10 +42,10 @@ _html2canvas.Generate.parseGradient = function(css, bounds) {
gradient = { gradient = {
type: 'linear', type: 'linear',
x0: 0, x0: null,
y0: 0, y0: null,
x1: 0, x1: null,
y1: 0, y1: null,
colorStops: [] colorStops: []
}; };
@ -56,23 +56,33 @@ _html2canvas.Generate.parseGradient = function(css, bounds) {
for(i = 0; i < m2Len; i+=1){ for(i = 0; i < m2Len; i+=1){
switch(m2[i]) { switch(m2[i]) {
case 'top': case 'top':
gradient.y0 = 0;
gradient.y1 = bounds.height; gradient.y1 = bounds.height;
break; break;
case 'right': case 'right':
gradient.x0 = bounds.width; gradient.x0 = bounds.width;
gradient.x1 = 0;
break; break;
case 'bottom': case 'bottom':
gradient.y0 = bounds.height; gradient.y0 = bounds.height;
gradient.y1 = 0;
break; break;
case 'left': case 'left':
gradient.x0 = 0;
gradient.x1 = bounds.width; gradient.x1 = bounds.width;
break; break;
} }
} }
} }
if(gradient.x0 === null && gradient.x1 === null){ // center
gradient.x0 = gradient.x1 = bounds.width / 2;
}
if(gradient.y0 === null && gradient.y1 === null){ // center
gradient.y0 = gradient.y1 = bounds.height / 2;
}
// get colors and stops // get colors and stops
m2 = m1[3].match(/((?:rgb|rgba)\(\d{1,3},\s\d{1,3},\s\d{1,3}(?:,\s[0-9\.]+)?\)(?:\s\d{1,3}(?:%|px))?)+/g); m2 = m1[3].match(/((?:rgb|rgba)\(\d{1,3},\s\d{1,3},\s\d{1,3}(?:,\s[0-9\.]+)?\)(?:\s\d{1,3}(?:%|px))?)+/g);
@ -165,12 +175,6 @@ _html2canvas.Generate.parseGradient = function(css, bounds) {
gradient.y1 = bounds.height - gradient.y0; gradient.y1 = bounds.height - gradient.y0;
} }
if(gradient.x0 === gradient.x1) // center
gradient.x0 = gradient.x1 = 0;
if(gradient.y0 === gradient.y1) // center
gradient.y0 = gradient.y1 = 0;
// get colors and stops // get colors and stops
m2 = m1[3].match(/((?:rgb|rgba)\(\d{1,3},\s\d{1,3},\s\d{1,3}(?:,\s[0-9\.]+)?\)(?:\s\d{1,3}%)?)+/g); m2 = m1[3].match(/((?:rgb|rgba)\(\d{1,3},\s\d{1,3},\s\d{1,3}(?:,\s[0-9\.]+)?\)(?:\s\d{1,3}%)?)+/g);
if(m2){ if(m2){

6
tests/qunit/index.html
View File

@ -95,7 +95,7 @@
/* FF 3.6+ */ /* FF 3.6+ */
background: -moz-linear-gradient(left, #ff0000, #ffff00, #00ff00); background: -moz-linear-gradient(left, #ff0000, #ffff00, #00ff00);
/* Chrome,Safari4+ */ /* Chrome,Safari4+ */
background: -webkit-gradient(linear, left top, right top, color-stop(#ff0000), color-stop(#ffff00), color-stop(#00ff00)); background: -webkit-gradient(linear, left center, right center, color-stop(#ff0000), color-stop(#ffff00), color-stop(#00ff00));
/* Chrome 10+, Safari 5.1+ */ /* Chrome 10+, Safari 5.1+ */
background: -webkit-linear-gradient(left, #ff0000, #ffff00, #00ff00); background: -webkit-linear-gradient(left, #ff0000, #ffff00, #00ff00);
/* Opera 11.10+ */ /* Opera 11.10+ */
@ -111,7 +111,7 @@
/* FF 3.6+ */ /* FF 3.6+ */
background: -moz-linear-gradient(left, #cedbe9 0%, #aac5de 17%, #6199c7 50%, #3a84c3 51%, #419ad6 59%, #4bb8f0 71%, #3a8bc2 84%, #26558b 100%); background: -moz-linear-gradient(left, #cedbe9 0%, #aac5de 17%, #6199c7 50%, #3a84c3 51%, #419ad6 59%, #4bb8f0 71%, #3a8bc2 84%, #26558b 100%);
/* Chrome, Safari 4+ */ /* Chrome, Safari 4+ */
background: -webkit-gradient(linear, left top, right top, color-stop(0%, #cedbe9), color-stop(17%, #aac5de), color-stop(50%, #6199c7), color-stop(51%, #3a84c3), color-stop(59%, #419ad6), color-stop(71%, #4bb8f0), color-stop(84%, #3a8bc2), color-stop(100%, #26558b)); background: -webkit-gradient(linear, left center, right center, color-stop(0%, #cedbe9), color-stop(17%, #aac5de), color-stop(50%, #6199c7), color-stop(51%, #3a84c3), color-stop(59%, #419ad6), color-stop(71%, #4bb8f0), color-stop(84%, #3a8bc2), color-stop(100%, #26558b));
/* Chrome 10+, Safari 5.1+ */ /* Chrome 10+, Safari 5.1+ */
background: -webkit-linear-gradient(left, #cedbe9 0%, #aac5de 17%, #6199c7 50%, #3a84c3 51%, #419ad6 59%, #4bb8f0 71%, #3a8bc2 84%, #26558b 100%); background: -webkit-linear-gradient(left, #cedbe9 0%, #aac5de 17%, #6199c7 50%, #3a84c3 51%, #419ad6 59%, #4bb8f0 71%, #3a8bc2 84%, #26558b 100%);
/* Opera 11.10+ */ /* Opera 11.10+ */
@ -127,7 +127,7 @@
/* FF 3.6+ */ /* FF 3.6+ */
background: -moz-linear-gradient(top, #f0b7a1 0%, #8c3310 50%, #752201 51%, #bf6e4e 100%); background: -moz-linear-gradient(top, #f0b7a1 0%, #8c3310 50%, #752201 51%, #bf6e4e 100%);
/* Chrome, Safari 4+ */ /* Chrome, Safari 4+ */
background: -webkit-gradient(linear, left top, left bottom, color-stop(0%, #f0b7a1), color-stop(50%, #8c3310), color-stop(51%, #752201), color-stop(100%, #bf6e4e)); background: -webkit-gradient(linear, center top, center bottom, color-stop(0%, #f0b7a1), color-stop(50%, #8c3310), color-stop(51%, #752201), color-stop(100%, #bf6e4e));
/* Opera 11.10+ */ /* Opera 11.10+ */
background: -o-linear-gradient(top, #f0b7a1 0%, #8c3310 50%, #752201 51%, #bf6e4e 100%); background: -o-linear-gradient(top, #f0b7a1 0%, #8c3310 50%, #752201 51%, #bf6e4e 100%);
/* IE 10+ */ /* IE 10+ */

15
tests/qunit/unit/generate.js
View File

@ -19,9 +19,9 @@ $(function() {
{ {
type: 'linear', type: 'linear',
x0: 0, x0: 0,
y0: 0, y0: 25,
x1: 50, x1: 50,
y1: 0, y1: 25,
colorStops: [ colorStops: [
{ {
color: "rgb(255, 0, 0)", color: "rgb(255, 0, 0)",
@ -40,9 +40,9 @@ $(function() {
{ {
type: 'linear', type: 'linear',
x0: 0, x0: 0,
y0: 0, y0: 25,
x1: 50, x1: 50,
y1: 0, y1: 25,
colorStops: [ colorStops: [
{ {
color: "rgb(206, 219, 233)", color: "rgb(206, 219, 233)",
@ -80,9 +80,9 @@ $(function() {
}, },
{ {
type: "linear", type: "linear",
x0: 0, x0: 25,
y0: 0, y0: 0,
x1: 0, x1: 25,
y1: 50, y1: 50,
colorStops: [ colorStops: [
{ {
@ -120,7 +120,8 @@ $(function() {
height: 50 height: 50
}); });
QUnit.deepEqual(gradient, expected['Generate.parseGradient'][i], 'Parsed gradient; got: ' + JSON.stringify(gradient)); //QUnit.deepEqual(gradient, expected['Generate.parseGradient'][i], 'Parsed gradient; got: ' + JSON.stringify(gradient));
QUnit.deepEqual(gradient, expected['Generate.parseGradient'][i], 'Parsed gradient with CSS: ' + src);
} else { } else {
QUnit.ok(true, 'No CSS Background Gradient support'); QUnit.ok(true, 'No CSS Background Gradient support');
} }