font.js
// https://www.samclarke.com/2013/06/javascript-is-font-available/
/**
* Checks if a font is available to be used on a web page.
*
* @param {String} fontName The name of the font to check
* @return {Boolean}
* @license MIT
* @copyright Sam Clarke 2013
* @author Sam Clarke <sam@samclarke.com>
*/
(function (document) {
var calculateWidth, monoWidth, serifWidth, sansWidth, width;
var body = document.body;
var container = document.createElement('div');
var containerCss = [
'position:absolute',
'width:auto',
'font-size:128px',
'left:-99999px'
];
// Create a span element to contain the test text.
// Use innerHTML instead of createElement as it's smaller
container.innerHTML = '<span style="' + containerCss.join(' !important;') + '">' +
Array(100).join('wi') +
'</span>';
container = container.firstChild;
calculateWidth = function (fontFamily) {
container.style.fontFamily = fontFamily;
body.appendChild(container);
width = container.clientWidth;
body.removeChild(container);
return width;
};
// Pre calculate the widths of monospace, serif & sans-serif
// to improve performance.
monoWidth = calculateWidth('monospace');
serifWidth = calculateWidth('serif');
sansWidth = calculateWidth('sans-serif');
window.isFontAvailable = function (fontName) {
return monoWidth !== calculateWidth(fontName + ',monospace') ||
sansWidth !== calculateWidth(fontName + ',sans-serif') ||
serifWidth !== calculateWidth(fontName + ',serif');
};
})(document);
// http://download.remysharp.com/font.js
var font = (function () {
var test_string = 'mmmmmmmmmwwwwwww';
var test_font = '"Comic Sans MS"';
var notInstalledWidth = 0;
var testbed = null;
var guid = 0;
return {
// must be called when the dom is ready
setup : function () {
if ($('#fontInstalledTest').length) return;
$('head').append('<' + 'style> #fontInstalledTest, #fontTestBed { position: absolute; left: -9999px; top: 0; visibility: hidden; } #fontInstalledTest { font-size: 50px!important; font-family: ' + test_font + ';}</' + 'style>');
$('body').append('<div id="fontTestBed"></div>').append('<span id="fontInstalledTest" class="fonttest">' + test_string + '</span>');
testbed = $('#fontTestBed');
notInstalledWidth = $('#fontInstalledTest').width();
},
isInstalled : function(font) {
guid++;
var style = '<' + 'style id="fonttestStyle"> #fonttest' + guid + ' { font-size: 50px!important; font-family: ' + font + ', ' + test_font + '; } <' + '/style>';
$('head').find('#fonttestStyle').remove().end().append(style);
testbed.empty().append('<span id="fonttest' + guid + '" class="fonttest">' + test_string + '</span>');
return (testbed.find('span').width() != notInstalledWidth);
}
};
})();