public
Description: Font detection using Javascript and Flash
Homepage:
Clone URL: git://github.com/gabriel/font-detect-js.git
font-detect-js / javascripts / font-detect.js
100644 106 lines (87 sloc) 3.086 kb
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
106
/*
* Javascript -> SWF -> Javascript font detection.
*
* @author Gabriel Handford
* @website http://rel.me
*
* @see http://www.lalit.org/lab/javascript-css-font-detect
*/
 
var FontDetect = function(swfId, swfLocation, onReady) {
  this._swfId = swfId;
  this._swfObjectId = swfId;
  this._swfLocation = swfLocation;
  this._onReady = onReady;
  this._fallbackWidthCache = null;
  
  this.loadSWF();
}
 
var FontDetectGlobal = (function() {
  var instance = {};
  return {
    register: function(id, object) {
      instance[id] = object;
    },
    remove: function(id) {
      var object = instance[id];
      instance[id] = null;
      return object;
    }
  };
})();
 
FontDetect.prototype = {
  
  loadSWF: function() {
    var flashvars = { onReady: "onFontDetectReady", swfObjectId: this._swfObjectId };
    var params = { allowScriptAccess: "always", menu: "false" };
    var attributes = { id: this._swfObjectId, name: this._swfObjectId };
    swfobject.embedSWF(this._swfLocation, this._swfId, "1", "1", "9.0.0", false, flashvars, params, attributes);
    
    FontDetectGlobal.register(this._swfObjectId, this);
    
    $(document).bind('swfLoaded', function(event, id) {
      var fontDetect = FontDetectGlobal.remove(id);
      fontDetect._onReady(fontDetect);
    });
  },
  
  checkOffsetWidth: function(family, size) {
    var node = document.createElement("p");
    $(node).css("font-family", "'" + family + "', Times New Roman");
    $(node).css("font-size", size);
    $(node).css("display", "inline");
    $(node).addClass("font-test")
    
    // This was from http://www.lalit.org/lab/javascript-css-font-detect
    $(node).html("mmmmmmmmml"); // m or w take up max width
    $("body").append(node);
    var width = node.offsetWidth;
    $("body p.font-test").remove();
    return width;
  },
 
  fallbackWidth: function() {
    if (!this._fallbackWidthCache) this._fallbackWidthCache = this.checkOffsetWidth("Times New Roman", "120px");
    return this._fallbackWidthCache;
  },
 
  checkFont: function(family) {
    // We use Times New Roman as a fallback
    if (family == "Times New Roman") return true;
  
    // Ignore fonts like: 'Arno Pro Semibold 18pt'
    if (/\d+pt\s*$/.test(family)) return false;
  
    var familyWidth = this.checkOffsetWidth("'" + family + "', Times New Roman", "120px");
    return (familyWidth != this.fallbackWidth());
  },
  
  filterFonts: function(fonts) {
    var filtered = [];
    for (var i = 0, length = fonts.length; i < length; i++) {
      if (this.checkFont(fonts[i].fontName))
        filtered.push(fonts[i]);
    }
    return filtered;
  },
    
  fonts: function() {
    // Use when doing static publishing
    //var swf = swfobject.getObjectById(this._swfObjectId);
      
    // Works with dynamic publishing
    var swfElement = document.getElementById(this._swfObjectId);
    var fonts = swfElement.fonts();
    return this.filterFonts(fonts);
  }
  
};
 
// Callback for Flash
var onFontDetectReady = function(swfObjectId) {
  $(document).trigger('swfLoaded', [ swfObjectId ]);
};