/** * jQuery Favicon Notify * * Updates the favicon to notify the user of changes. In the original tests I * had an embedded font collection to allow any charachers - I decided that the * ~130Kb and added complexity was overkill. As such it now uses a manual glyph * set meaning that only numerical notifications are possible. * * Dual licensed under the MIT and GPL licenses: * * http://www.opensource.org/licenses/mit-license.php * http://www.gnu.org/licenses/gpl.html * * @author David King * @copyright Copyright (c) 2011 + * @url oodavid.com */ (function($){ var canvas; var bg = '#000000'; var fg = '#FFFFFF'; var pos = 'br'; $.faviconNotify = function(icon, num, myPos, myBg, myFg){ // Default the positions myPos = myPos || pos; myFg = myFg || fg; myBg = myBg || bg; // Create a canvas if we need one canvas = canvas || $('')[0]; if(canvas.getContext){ // Load the icon $('').load(function(e){ // Load the icon into the canvas canvas.height = canvas.width = 16; var ctx = canvas.getContext('2d'); ctx.clearRect(0, 0, canvas.width, canvas.height); ctx.drawImage(this, 0, 0); // We gots num? if(num !== undefined){ num = parseFloat(num, 10); // Convert the num into a glyphs array var myGlyphs = []; if(num > 99){ myGlyphs.push(glyphs['LOTS']); } else { num = num.toString().split(''); $.each(num, function(k,v){ myGlyphs.push(glyphs[v]); }); } if(num>0) { // Merge the glyphs together var combined = []; var glyphHeight = myGlyphs[0].length; $.each(myGlyphs, function(k,v){ for(y=0; y').attr('href', canvas.toDataURL('image/png'))); }).attr('src', icon) } }; var glyphs = { '0': [ ' --- ', ' -@@@- ', '-@---@-', '-@- -@-', '-@- -@-', '-@- -@-', '-@---@-', ' -@@@- ', ' --- ' ], '1': [ ' - ', ' -@- ', '-@@- ', ' -@- ', ' -@- ', ' -@- ', ' -@- ', '-@@@-', ' --- ' ], '2': [ ' --- ', ' -@@@- ', '-@---@-', ' - --@-', ' -@@- ', ' -@-- ', '-@---- ', '-@@@@@-', ' ----- ' ], '3': [ ' --- ', ' -@@@- ', '-@---@-', ' - --@-', ' -@@- ', ' - --@-', '-@---@-', ' -@@@- ', ' --- ' ], '4': [ ' -- ', ' -@@-', ' -@-@-', ' -@--@-', '-@---@-', '-@@@@@-', ' ----@-', ' -@-', ' - ' ], '5': [ ' ----- ', '-@@@@@-', '-@---- ', '-@--- ', '-@@@@- ', ' ----@-', '-@---@-', ' -@@@- ', ' --- ' ], '6': [ ' --- ', ' -@@@- ', '-@---@-', '-@---- ', '-@@@@- ', '-@---@-', '-@---@-', ' -@@@- ', ' --- ' ], '7': [ ' ----- ', '-@@@@@-', ' ----@-', ' -@- ', ' -@- ', ' -@- ', ' -@- ', ' -@- ', ' - ' ], '8': [ ' --- ', ' -@@@- ', '-@---@-', '-@---@-', ' -@@@- ', '-@---@-', '-@---@-', ' -@@@- ', ' --- ' ], '9': [ ' --- ', ' -@@@- ', '-@---@-', '-@---@-', ' -@@@@-', ' ----@-', '-@---@-', ' -@@@- ', ' --- ' ], '!': [ ' - ', '-@-', '-@-', '-@-', '-@-', '-@-', ' - ', '-@-', ' - ' ], '.': [ ' ', ' ', ' ', ' ', ' ', ' ', ' - ', '-@-', ' - ' ], 'LOTS': [ ' - -- --- -- ', '-@- -@@-@@@--@@-', '-@--@--@-@--@- ', '-@--@--@-@--@- ', '-@--@--@-@- -@- ', '-@--@--@-@- -@-', '-@--@--@-@----@-', '-@@@-@@--@-@@@- ', ' --- -- - --- ' ] }; })(jQuery);