Moved font metrics to seperate file

src/Font.js

@@ -0,0 +1,64 @@
+_html2canvas.Util.Font = (function () {
+
+  var fontData = {};
+
+  return function(font, fontSize, doc) {
+    if (fontData[font + "-" + fontSize] !== undefined) {
+      return fontData[font + "-" + fontSize];
+    }
+
+    var container = doc.createElement('div'),
+    img = doc.createElement('img'),
+    span = doc.createElement('span'),
+    sampleText = 'Hidden Text',
+    baseline,
+    middle,
+    metricsObj;
+
+    container.style.visibility = "hidden";
+    container.style.fontFamily = font;
+    container.style.fontSize = fontSize;
+    container.style.margin = 0;
+    container.style.padding = 0;
+
+    doc.body.appendChild(container);
+
+    // http://probablyprogramming.com/2009/03/15/the-tiniest-gif-ever (handtinywhite.gif)
+    img.src = "data:image/gif;base64,R0lGODlhAQABAIABAP///wAAACwAAAAAAQABAAACAkQBADs=";
+    img.width = 1;
+    img.height = 1;
+
+    img.style.margin = 0;
+    img.style.padding = 0;
+    img.style.verticalAlign = "baseline";
+
+    span.style.fontFamily = font;
+    span.style.fontSize = fontSize;
+    span.style.margin = 0;
+    span.style.padding = 0;
+
+    span.appendChild(doc.createTextNode(sampleText));
+    container.appendChild(span);
+    container.appendChild(img);
+    baseline = (img.offsetTop - span.offsetTop) + 1;
+
+    container.removeChild(span);
+    container.appendChild(doc.createTextNode(sampleText));
+
+    container.style.lineHeight = "normal";
+    img.style.verticalAlign = "super";
+
+    middle = (img.offsetTop-container.offsetTop) + 1;
+    metricsObj = {
+      baseline: baseline,
+      lineWidth: 1,
+      middle: middle
+    };
+
+    fontData[font + "-" + fontSize] = metricsObj;
+
+    doc.body.removeChild(container);
+
+    return metricsObj;
+  };
+})();

src/Parse.js

@@ -3,7 +3,6 @@ _html2canvas.Parse = function (images, options) {
 
   var element = (( options.elements === undefined ) ? document.body : options.elements[0]), // select body by default
   numDraws = 0,
-  fontData = {},
   doc = element.ownerDocument,
   support = _html2canvas.Util.Support(options, doc),
   ignoreElementsRegExp = new RegExp("(" + options.ignoreElements + ")"),
@@ -66,67 +65,6 @@ _html2canvas.Parse = function (images, options) {
     return text.replace(/^\s*/g, "").replace(/\s*$/g, "");
   }
 
-  function fontMetrics (font, fontSize) {
-
-    if (fontData[font + "-" + fontSize] !== undefined) {
-      return fontData[font + "-" + fontSize];
-    }
-
-    var container = doc.createElement('div'),
-    img = doc.createElement('img'),
-    span = doc.createElement('span'),
-    sampleText = 'Hidden Text',
-    baseline,
-    middle,
-    metricsObj;
-
-    container.style.visibility = "hidden";
-    container.style.fontFamily = font;
-    container.style.fontSize = fontSize;
-    container.style.margin = 0;
-    container.style.padding = 0;
-
-    body.appendChild(container);
-
-    // http://probablyprogramming.com/2009/03/15/the-tiniest-gif-ever (handtinywhite.gif)
-    img.src = "data:image/gif;base64,R0lGODlhAQABAIABAP///wAAACwAAAAAAQABAAACAkQBADs=";
-    img.width = 1;
-    img.height = 1;
-
-    img.style.margin = 0;
-    img.style.padding = 0;
-    img.style.verticalAlign = "baseline";
-
-    span.style.fontFamily = font;
-    span.style.fontSize = fontSize;
-    span.style.margin = 0;
-    span.style.padding = 0;
-
-    span.appendChild(doc.createTextNode(sampleText));
-    container.appendChild(span);
-    container.appendChild(img);
-    baseline = (img.offsetTop - span.offsetTop) + 1;
-
-    container.removeChild(span);
-    container.appendChild(doc.createTextNode(sampleText));
-
-    container.style.lineHeight = "normal";
-    img.style.verticalAlign = "super";
-
-    middle = (img.offsetTop-container.offsetTop) + 1;
-    metricsObj = {
-      baseline: baseline,
-      lineWidth: 1,
-      middle: middle
-    };
-
-    fontData[font + "-" + fontSize] = metricsObj;
-
-    body.removeChild(container);
-
-    return metricsObj;
-  }
-
   function drawText(currentText, x, y, ctx){
     if (currentText !== null && trimText(currentText).length > 0) {
       ctx.fillText(currentText, x, y);
@@ -136,11 +74,9 @@ _html2canvas.Parse = function (images, options) {
 
   function setTextVariables(ctx, el, text_decoration, color) {
     var align = false,
-    font_style = getCSS(el, "fontStyle"),
     bold = getCSS(el, "fontWeight"),
     family = getCSS(el, "fontFamily"),
-    size = getCSS(el, "fontSize"),
+    size = getCSS(el, "fontSize");
-    font_variant = getCSS(el, "fontVariant");
 
     switch(parseInt(bold, 10)){
       case 401:
@@ -152,11 +88,11 @@ _html2canvas.Parse = function (images, options) {
     }
 
     ctx.setVariable("fillStyle", color);
-    ctx.setVariable("font", [font_style, font_variant, bold, size, family].join(" "));
+    ctx.setVariable("font", [getCSS(el, "fontStyle"), getCSS(el, "fontVariant"), bold, size, family].join(" "));
     ctx.setVariable("textAlign", (align) ? "right" : "left");
 
     if (text_decoration !== "none"){
-      return fontMetrics(family, size);
+      return _html2canvas.Util.Font(family, size, doc);
     }
   }
 

tests/test.js

@@ -11,7 +11,7 @@ var h2cSelector, h2cOptions;
 
     document.write(srcStart + '/tests/assets/jquery-1.6.2.js' + scrEnd);
     document.write(srcStart + '/tests/assets/jquery.plugin.html2canvas.js' + scrEnd);
-    var html2canvas = ['Core', 'Generate', 'Parse', 'Preload', 'Queue', 'Renderer', 'Util', 'Support', 'renderers/Canvas'], i;
+    var html2canvas = ['Core', 'Generate', 'Parse', 'Preload', 'Queue', 'Renderer', 'Util', 'Support', 'Font', 'renderers/Canvas'], i;
     for (i = 0; i < html2canvas.length; ++i) {
         document.write(srcStart + '/src/' + html2canvas[i] + '.js' + scrEnd);
     }