diff --git a/build/html2canvas.js b/build/html2canvas.js index 54f8476..77c560c 100644 --- a/build/html2canvas.js +++ b/build/html2canvas.js @@ -857,7 +857,7 @@ html2canvas.prototype.newText = function(el,textNode,ctx){ var bold = this.getCSS(el,"font-weight"); var font_style = this.getCSS(el,"font-style"); - + var font_variant = this.getCSS(el,"font-variant"); var text_decoration = this.getCSS(el,"text-decoration"); @@ -882,7 +882,7 @@ html2canvas.prototype.newText = function(el,textNode,ctx){ this.setContextVariable(ctx,"fillStyle",color); - this.setContextVariable(ctx,"font",bold+" "+font_style+" "+size+" "+family); + this.setContextVariable(ctx,"font",font_variant+" "+bold+" "+font_style+" "+size+" "+family); //ctx.font = bold+" "+font_style+" "+size+" "+family; //ctx.fillStyle = color; diff --git a/build/html2canvas.min.js b/build/html2canvas.min.js index 3e76396..d00bf9b 100644 --- a/build/html2canvas.min.js +++ b/build/html2canvas.min.js @@ -29,9 +29,9 @@ html2canvas.prototype.canvasRenderer=function(a){var b=this,a=this.sortQueue(a); c.arguments[4],c.arguments[5],c.arguments[6],c.arguments[7],c.arguments[8]):this.log(c)}})})}; html2canvas.prototype.sortQueue=function(a){if(!this.opts.reorderZ||!this.needReorder)return a;var b=0;this.each(a,function(a,c){if(b<c.zIndex.length)b=c.zIndex.length});var c=0;this.each(a,function(d,e){for(var g=a.length.toString().length-c.toString().length;b>e.zIndex.length;)e.zIndex+="0";for(e.zIndex+=c;b+g+c.toString().length>e.zIndex.length;)e.zIndex+="0";c++});return a=a.sort(function(a,b){return a.zIndex<b.zIndex?-1:a.zIndex>b.zIndex?1:0})}; html2canvas.prototype.setContextVariable=function(a,b,c){a.storage?a.storage.push({type:"variable",name:b,arguments:c}):a[b]=c}; -html2canvas.prototype.newText=function(a,b,c){var d=this.getCSS(a,"font-family"),e=this.getCSS(a,"font-size"),g=this.getCSS(a,"color"),f=this.getCSS(a,"font-weight"),i=this.getCSS(a,"font-style"),h=this.getCSS(a,"text-decoration");b.nodeValue=this.textTransform(b.nodeValue,this.getCSS(a,"text-transform"));a=b.nodeValue;if(a.length>0){switch(f){case "401":f="bold"}if(h!="none")var k=this.fontMetrics(d,e);this.setContextVariable(c,"fillStyle",g);this.setContextVariable(c,"font",f+" "+i+" "+e+" "+d); -for(d=0;d<a.length;d++){e=b.splitText(1);if(this.useRangeBounds)document.createRange?(f=document.createRange(),f.selectNode(b)):f=document.body.createTextRange(),f=f.getBoundingClientRect()?f.getBoundingClientRect():{};else{var i=b.parentNode,l=document.createElement("wrapper"),m=b.cloneNode(!0);l.appendChild(b.cloneNode(!0));i.replaceChild(l,b);f=this.getBounds(l);i.replaceChild(m,l)}this.printText(b.nodeValue,f.left,f.bottom,c);switch(h){case "underline":this.newRect(c,f.left,Math.round(f.top+k.baseline+ -k.lineWidth),f.width,1,g);break;case "overline":this.newRect(c,f.left,f.top,f.width,1,g);break;case "line-through":this.newRect(c,f.left,Math.ceil(f.top+k.middle+k.lineWidth),f.width,1,g)}b=e}}}; +html2canvas.prototype.newText=function(a,b,c){var d=this.getCSS(a,"font-family"),e=this.getCSS(a,"font-size"),g=this.getCSS(a,"color"),f=this.getCSS(a,"font-weight"),i=this.getCSS(a,"font-style"),h=this.getCSS(a,"font-variant"),k=this.getCSS(a,"text-decoration");b.nodeValue=this.textTransform(b.nodeValue,this.getCSS(a,"text-transform"));a=b.nodeValue;if(a.length>0){switch(f){case "401":f="bold"}if(k!="none")var l=this.fontMetrics(d,e);this.setContextVariable(c,"fillStyle",g);this.setContextVariable(c, +"font",h+" "+f+" "+i+" "+e+" "+d);for(d=0;d<a.length;d++){e=b.splitText(1);if(this.useRangeBounds)document.createRange?(f=document.createRange(),f.selectNode(b)):f=document.body.createTextRange(),f=f.getBoundingClientRect()?f.getBoundingClientRect():{};else{var i=b.parentNode,h=document.createElement("wrapper"),m=b.cloneNode(!0);h.appendChild(b.cloneNode(!0));i.replaceChild(h,b);f=this.getBounds(h);i.replaceChild(m,h)}this.printText(b.nodeValue,f.left,f.bottom,c);switch(k){case "underline":this.newRect(c, +f.left,Math.round(f.top+l.baseline+l.lineWidth),f.width,1,g);break;case "overline":this.newRect(c,f.left,f.top,f.width,1,g);break;case "line-through":this.newRect(c,f.left,Math.ceil(f.top+l.middle+l.lineWidth),f.width,1,g)}b=e}}}; html2canvas.prototype.fontMetrics=function(a,b){var c=this.fontData.indexOf(a+"-"+b);if(c>-1)return this.fontData[c+1];c=document.createElement("div");document.getElementsByTagName("body")[0].appendChild(c);$(c).css({visibility:"hidden",fontFamily:a,fontSize:b,margin:0,padding:0});var d=document.createElement("img");d.src="http://html2canvas.hertzen.com/images/8.jpg";d.width=1;d.height=1;$(d).css({margin:0,padding:0});var e=document.createElement("span");$(e).css({fontFamily:a,fontSize:b,margin:0, padding:0});e.appendChild(document.createTextNode("Hidden Text"));c.appendChild(e);c.appendChild(d);var g=d.offsetTop-e.offsetTop+1;c.removeChild(e);c.appendChild(document.createTextNode("Hidden Text"));$(c).css("line-height","normal");$(d).css("vertical-align","super");d={baseline:g,lineWidth:1,middle:d.offsetTop-c.offsetTop+1};this.fontData.push(a+"-"+b);this.fontData.push(d);$(c).remove();return d}; html2canvas.prototype.textTransform=function(a,b){switch(b){case "lowercase":return a.toLowerCase();case "capitalize":return a.replace(/(^|\s|:|-|\(|\))([a-z])/g,function(a,b,e){return b+e.toUpperCase()});case "uppercase":return a.toUpperCase();default:return a}};html2canvas.prototype.trim=function(a){return a.replace(/^\s*/,"").replace(/\s*$/,"")}; diff --git a/src/Text.js b/src/Text.js index 8ccd317..50d4ab5 100644 --- a/src/Text.js +++ b/src/Text.js @@ -7,7 +7,7 @@ html2canvas.prototype.newText = function(el,textNode,ctx){ var bold = this.getCSS(el,"font-weight"); var font_style = this.getCSS(el,"font-style"); - + var font_variant = this.getCSS(el,"font-variant"); var text_decoration = this.getCSS(el,"text-decoration"); @@ -32,7 +32,7 @@ html2canvas.prototype.newText = function(el,textNode,ctx){ this.setContextVariable(ctx,"fillStyle",color); - this.setContextVariable(ctx,"font",bold+" "+font_style+" "+size+" "+family); + this.setContextVariable(ctx,"font",font_variant+" "+bold+" "+font_style+" "+size+" "+family); //ctx.font = bold+" "+font_style+" "+size+" "+family; //ctx.fillStyle = color; diff --git a/tests/text-underline.html b/tests/text-underline.html index 1f5c8f5..5026861 100644 --- a/tests/text-underline.html +++ b/tests/text-underline.html @@ -49,7 +49,6 @@ div{ text-decoration:underline; -position:relative; } .lineheight{ diff --git a/tests/text.html b/tests/text.html index 119c233..7b7f519 100644 --- a/tests/text.html +++ b/tests/text.html @@ -122,7 +122,7 @@ <li style="line-height:35px;">line-height:35px; <br />(same goes for line-height)</li> <li style="letter-spacing:5px;">letter-spacing:5px;</li> <li style="text-align:right;width:300px;">text-align:right;width:300px;</li> - <li style="font-variant:small-caps;">font-variant:small-caps; (not yet supported)</li> + <li style="font-variant:small-caps;">font-variant:small-caps; </li> </ul> </body>