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

added support for font-variant

Browse Source
This commit is contained in:
Niklas von Hertzen 2011-07-17 23:52:11 +03:00
parent 1192795bd5
commit a27290caae
5 changed files with 8 additions and 9 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

4
build/html2canvas.js
View File

@ -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;

6
build/html2canvas.min.js vendored
View File

@ -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*$/,"")};

4
src/Text.js
View File

@ -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;

1
tests/text-underline.html
View File

@ -49,7 +49,6 @@
div{
text-decoration:underline;
position:relative;
}
.lineheight{

2
tests/text.html
View File

@ -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>