dziegler/FontLoader.js

## FontLoader.js
/*

FontLoader version 0.1
David Ziegler, Dec 19 2010

This script checks if the browser supports font-smoothing, and adds the following classes to the html tag:

"hasFontSmoothing-true" if font smoothing is enabled
"hasFontSmoothing-false" if it isn't
"hasFontSmoothing-unknown" if it cannot detect it.

This result is cached in a cookie called 'hasSmoothing' and then Typekit.load() is called to load your Typekit fonts.

Based off TypeHelpers by Zoltan Hawryluk

Released under the MIT License. http://www.opensource.org/licenses/mit-license.php

Works for
    - IE6+ (Windows),
    - Firefox 3.5+ (Windows, Mac, Linux),
    - Safari 4+ (Windows, Mac OS X),
    - Chrome 3.0+ (Windows).
    - Opera 10.10 and under reports unknown support for font-smoothing.


Put at the top of <head>

METHODS
-------

checkSmoothing() checks if smoothing is enabled and loads the typekit fonts

insertClasses(hasSmoothing, setCache) adds the following classes to the html tag:
    "hasFontSmoothing-true" if font smoothing is enabled
    "hasFontSmoothing-false" if it isn't
    "hasFontSmoothing-unknown" if it cannot detect it.

*/


var FontLoader = new function() {
    var me = this;
    var cookie = 'hasSmoothing';

    me.checkSmoothing = function(){
        var hasSmoothing = me.getCached();
        if (hasSmoothing !== undefined) {
            me.insertClasses(hasSmoothing, false);
        } else if (typeof(screen.fontSmoothingEnabled) !== "undefined") {
            me.insertClasses(screen.fontSmoothingEnabled, true);
        } else {

            try {
                // Create a 35x35 Canvas block.
                var canvasNode = document.createElement("canvas");
                canvasNode.width = "35";
                canvasNode.height = "35";
                canvasNode.style.display = "none";

                // We must put this node into the body, otherwise
                // Safari Windows does not report correctly.

                // Wait until body is ready to insert canvas node
                var interval = setInterval(function() {
                    if (document.body) {
                        clearInterval(interval);
                        me.insertCanvas(canvasNode);
                    }
                }, 10);
            }
            catch (ex) {
                // Something went wrong (for example, Opera cannot use the
                // canvas fillText() method.  Return null (unknown).
            }
        }
    };

    me.getCached = function() {
        if (document.cookie.length > 0) {
            var c_start = document.cookie.indexOf(cookie + "=");
            if (c_start !== -1) {
                c_start = c_start + cookie.length + 1;
                var c_end = document.cookie.indexOf(";", c_start);
                if (c_end === -1) {
                    c_end = document.cookie.length;
                }
                var c_val = unescape(document.cookie.substring(c_start, c_end));
                if (c_val === 'true') {
                    return true;
                } else if (c_val === 'false') {
                    return false;
                } else {
                    return undefined;
                }
            }
        }
        return undefined;
    };

    me.insertCanvas = function(canvasNode) {
        document.body.appendChild(canvasNode);

        var ctx = canvasNode.getContext("2d");

        // draw a black letter "O", 32px Arial.
        ctx.textBaseline = "top";
        ctx.font = "32px Arial";
        ctx.fillStyle = "black";
        ctx.strokeStyle = "black";

        ctx.fillText("O", 0, 0);

        // start at (8,1) and search the canvas from left to right,
        // top to bottom to see if we can find a non-black pixel.  If
        // so we return true.
        var imageData, alpha;
        for (var j = 8; j <= 32; j++) {
            for (var i = 1; i <= 32; i++) {
                imageData = ctx.getImageData(i, j, 1, 1).data;
                alpha = imageData[3];

                if (alpha !== 255 && alpha !== 0) {
                    me.insertClasses(true, true);
                    return;
                }
            }
        }
        me.insertClasses(false, true);
    };

    me.insertClasses = function(hasSmoothing, setCache) {
        var htmlNode = document.getElementsByTagName("html")[0];
        if (hasSmoothing === true) {
            htmlNode.className += " hasFontSmoothing-true";
            me.loadFonts();
        } else if (hasSmoothing === false) {
            htmlNode.className += " hasFontSmoothing-false";
        } else {
            htmlNode.className += " hasFontSmoothing-unknown";
        }

        if (setCache) {
            me.setCached(hasSmoothing);
        }
    };

    me.loadFonts = function() {
        try{Typekit.load();}catch(e){}
    };

    me.setCached = function(value) {
        var exdate = new Date();
        exdate.setDate(exdate.getDate() + 1000);
        document.cookie = cookie + "=" + escape(value) + ";expires=" + exdate.toUTCString();
    };
};

FontLoader.checkSmoothing();
	/*

	FontLoader version 0.1
	David Ziegler, Dec 19 2010

	This script checks if the browser supports font-smoothing, and adds the following classes to the html tag:

	"hasFontSmoothing-true" if font smoothing is enabled
	"hasFontSmoothing-false" if it isn't
	"hasFontSmoothing-unknown" if it cannot detect it.

	This result is cached in a cookie called 'hasSmoothing' and then Typekit.load() is called to load your Typekit fonts.

	Based off TypeHelpers by Zoltan Hawryluk

	Released under the MIT License. http://www.opensource.org/licenses/mit-license.php

	Works for
	- IE6+ (Windows),
	- Firefox 3.5+ (Windows, Mac, Linux),
	- Safari 4+ (Windows, Mac OS X),
	- Chrome 3.0+ (Windows).
	- Opera 10.10 and under reports unknown support for font-smoothing.


	Put at the top of <head>

	METHODS
	-------

	checkSmoothing() checks if smoothing is enabled and loads the typekit fonts

	insertClasses(hasSmoothing, setCache) adds the following classes to the html tag:
	"hasFontSmoothing-true" if font smoothing is enabled
	"hasFontSmoothing-false" if it isn't
	"hasFontSmoothing-unknown" if it cannot detect it.

	*/


	var FontLoader = new function() {
	var me = this;
	var cookie = 'hasSmoothing';

	me.checkSmoothing = function(){
	var hasSmoothing = me.getCached();
	if (hasSmoothing !== undefined) {
	me.insertClasses(hasSmoothing, false);
	} else if (typeof(screen.fontSmoothingEnabled) !== "undefined") {
	me.insertClasses(screen.fontSmoothingEnabled, true);
	} else {

	try {
	// Create a 35x35 Canvas block.
	var canvasNode = document.createElement("canvas");
	canvasNode.width = "35";
	canvasNode.height = "35";
	canvasNode.style.display = "none";

	// We must put this node into the body, otherwise
	// Safari Windows does not report correctly.

	// Wait until body is ready to insert canvas node
	var interval = setInterval(function() {
	if (document.body) {
	clearInterval(interval);
	me.insertCanvas(canvasNode);
	}
	}, 10);
	}
	catch (ex) {
	// Something went wrong (for example, Opera cannot use the
	// canvas fillText() method. Return null (unknown).
	}
	}
	};

	me.getCached = function() {
	if (document.cookie.length > 0) {
	var c_start = document.cookie.indexOf(cookie + "=");
	if (c_start !== -1) {
	c_start = c_start + cookie.length + 1;
	var c_end = document.cookie.indexOf(";", c_start);
	if (c_end === -1) {
	c_end = document.cookie.length;
	}
	var c_val = unescape(document.cookie.substring(c_start, c_end));
	if (c_val === 'true') {
	return true;
	} else if (c_val === 'false') {
	return false;
	} else {
	return undefined;
	}
	}
	}
	return undefined;
	};

	me.insertCanvas = function(canvasNode) {
	document.body.appendChild(canvasNode);

	var ctx = canvasNode.getContext("2d");

	// draw a black letter "O", 32px Arial.
	ctx.textBaseline = "top";
	ctx.font = "32px Arial";
	ctx.fillStyle = "black";
	ctx.strokeStyle = "black";

	ctx.fillText("O", 0, 0);

	// start at (8,1) and search the canvas from left to right,
	// top to bottom to see if we can find a non-black pixel. If
	// so we return true.
	var imageData, alpha;
	for (var j = 8; j <= 32; j++) {
	for (var i = 1; i <= 32; i++) {
	imageData = ctx.getImageData(i, j, 1, 1).data;
	alpha = imageData[3];

	if (alpha !== 255 && alpha !== 0) {
	me.insertClasses(true, true);
	return;
	}
	}
	}
	me.insertClasses(false, true);
	};

	me.insertClasses = function(hasSmoothing, setCache) {
	var htmlNode = document.getElementsByTagName("html")[0];
	if (hasSmoothing === true) {
	htmlNode.className += " hasFontSmoothing-true";
	me.loadFonts();
	} else if (hasSmoothing === false) {
	htmlNode.className += " hasFontSmoothing-false";
	} else {
	htmlNode.className += " hasFontSmoothing-unknown";
	}

	if (setCache) {
	me.setCached(hasSmoothing);
	}
	};

	me.loadFonts = function() {
	try{Typekit.load();}catch(e){}
	};

	me.setCached = function(value) {
	var exdate = new Date();
	exdate.setDate(exdate.getDate() + 1000);
	document.cookie = cookie + "=" + escape(value) + ";expires=" + exdate.toUTCString();
	};
	};

	FontLoader.checkSmoothing();