update tinycon to latest (#4850)

v1.18.x
Anil Mandepudi 9 years ago committed by Julian Lam
parent 3858e9c614
commit 1d100e9f42

@ -1,188 +1,200 @@
/*! /*!
* Tinycon - A small library for manipulating the Favicon * Tinycon - A small library for manipulating the Favicon
* Tom Moor, http://tommoor.com * Tom Moor, http://tommoor.com
* Copyright (c) 2012 Tom Moor * Copyright (c) 2015 Tom Moor
* MIT Licensed * @license MIT Licensed
* @version 0.6.1 * @version 0.6.4
*/ */
(function(){ (function(){
var Tinycon = {}; var Tinycon = {};
var currentFavicon = null; var currentFavicon = null;
var originalFavicon = null; var originalFavicon = null;
var originalTitle = document.title; var faviconImage = null;
var faviconImage = null; var canvas = null;
var canvas = null; var options = {};
var options = {}; var r = window.devicePixelRatio || 1;
var r = window.devicePixelRatio || 1; var size = 16 * r;
var size = 16 * r; var defaults = {
var defaults = { width: 7,
width: 7, height: 9,
height: 9, font: 10 * r + 'px arial',
font: 9 * r + 'px arial', color: '#ffffff',
colour: '#ffffff', background: '#F03D25',
background: '#F03D25', fallback: true,
fallback: true, crossOrigin: true,
crossOrigin: true, abbreviate: true
abbreviate: true };
};
var ua = (function () {
var ua = (function () { var agent = navigator.userAgent.toLowerCase();
var agent = navigator.userAgent.toLowerCase(); // New function has access to 'agent' via closure
// New function has access to 'agent' via closure return function (browser) {
return function (browser) { return agent.indexOf(browser) !== -1;
return agent.indexOf(browser) !== -1; };
}; }());
}());
var browser = {
var browser = { ie: ua('trident'),
ie: ua('msie'), chrome: ua('chrome'),
chrome: ua('chrome'), webkit: ua('chrome') || ua('safari'),
webkit: ua('chrome') || ua('safari'), safari: ua('safari') && !ua('chrome'),
safari: ua('safari') && !ua('chrome'), mozilla: ua('mozilla') && !ua('chrome') && !ua('safari')
mozilla: ua('mozilla') && !ua('chrome') && !ua('safari') };
};
// private methods
// private methods var getFaviconTag = function(){
var getFaviconTag = function(){
var links = document.getElementsByTagName('link');
var links = document.getElementsByTagName('link');
for(var i=0, len=links.length; i < len; i++) {
for(var i=0, len=links.length; i < len; i++) { if ((links[i].getAttribute('rel') || '').match(/\bicon\b/i)) {
if ((links[i].getAttribute('rel') || '').match(/\bicon\b/)) { return links[i];
return links[i]; }
} }
}
return false;
return false; };
};
var removeFaviconTag = function(){
var removeFaviconTag = function(){
var links = document.getElementsByTagName('link');
var links = document.getElementsByTagName('link'); var head = document.getElementsByTagName('head')[0];
var head = document.getElementsByTagName('head')[0];
for(var i=0, len=links.length; i < len; i++) {
for(var i=0, len=links.length; i < len; i++) { var exists = (typeof(links[i]) !== 'undefined');
var exists = (typeof(links[i]) !== 'undefined'); if (exists && (links[i].getAttribute('rel') || '').match(/\bicon\b/i)) {
if (exists && (links[i].getAttribute('rel') || '').match(/\bicon\b/)) { head.removeChild(links[i]);
head.removeChild(links[i]); }
} }
} };
};
var getCurrentFavicon = function(){
var getCurrentFavicon = function(){
if (!originalFavicon || !currentFavicon) {
if (!originalFavicon || !currentFavicon) { var tag = getFaviconTag();
var tag = getFaviconTag(); currentFavicon = tag ? tag.getAttribute('href') : '/favicon.ico';
originalFavicon = currentFavicon = tag ? tag.getAttribute('href') : '/favicon.ico'; if (!originalFavicon) {
} originalFavicon = currentFavicon;
}
return currentFavicon; }
};
return currentFavicon;
var getCanvas = function (){ };
if (!canvas) { var getCanvas = function (){
canvas = document.createElement("canvas");
canvas.width = size; if (!canvas) {
canvas.height = size; canvas = document.createElement("canvas");
} canvas.width = size;
canvas.height = size;
return canvas; }
};
return canvas;
var setFaviconTag = function(url){ };
removeFaviconTag();
var setFaviconTag = function(url){
var link = document.createElement('link'); if(url){
link.type = 'image/x-icon'; removeFaviconTag();
link.rel = 'icon';
link.href = url; var link = document.createElement('link');
document.getElementsByTagName('head')[0].appendChild(link); link.type = 'image/x-icon';
}; link.rel = 'icon';
link.href = url;
var log = function(message){ document.getElementsByTagName('head')[0].appendChild(link);
if (window.console) window.console.log(message); }
}; };
var drawFavicon = function(label, colour) { var log = function(message){
if (window.console) window.console.log(message);
// fallback to updating the browser title if unsupported };
if (!getCanvas().getContext || browser.ie || browser.safari || options.fallback === 'force') {
return updateTitle(label); var drawFavicon = function(label, color) {
}
// fallback to updating the browser title if unsupported
var context = getCanvas().getContext("2d"); if (!getCanvas().getContext || browser.ie || browser.safari || options.fallback === 'force') {
var colour = colour || '#000000'; return updateTitle(label);
var src = getCurrentFavicon(); }
faviconImage = document.createElement('img'); var context = getCanvas().getContext("2d");
faviconImage.onload = function() { var color = color || '#000000';
var src = getCurrentFavicon();
// clear canvas
context.clearRect(0, 0, size, size); faviconImage = document.createElement('img');
faviconImage.onload = function() {
// draw the favicon
context.drawImage(faviconImage, 0, 0, faviconImage.width, faviconImage.height, 0, 0, size, size); // clear canvas
context.clearRect(0, 0, size, size);
// draw the favicon
context.drawImage(faviconImage, 0, 0, faviconImage.width, faviconImage.height, 0, 0, size, size);
// draw bubble over the top
if ((label + '').length > 0) drawBubble(context, label, color);
// draw bubble over the top // refresh tag in page
if ((label + '').length > 0) drawBubble(context, label, colour); refreshFavicon();
};
// refresh tag in page // allow cross origin resource requests if the image is not a data:uri
refreshFavicon(); // as detailed here: https://github.com/mrdoob/three.js/issues/1305
}; if (!src.match(/^data/) && options.crossOrigin) {
faviconImage.crossOrigin = 'anonymous';
}
// allow cross origin resource requests if the image is not a data:uri faviconImage.src = src;
// as detailed here: https://github.com/mrdoob/three.js/issues/1305 };
if (!src.match(/^data/) && options.crossOrigin) {
faviconImage.crossOrigin = 'anonymous';
}
faviconImage.src = src; var updateTitle = function(label) {
};
var updateTitle = function(label) { if (options.fallback) {
// Grab the current title that we can prefix with the label
var originalTitle = document.title;
if (options.fallback) { // Strip out the old label if there is one
if ((label + '').length > 0) { if (originalTitle[0] === '(') {
document.title = '(' + label + ') ' + originalTitle; originalTitle = originalTitle.slice(originalTitle.indexOf(' '));
} else { }
document.title = originalTitle;
}
}
};
var drawBubble = function(context, label, colour) { if ((label + '').length > 0) {
document.title = '(' + label + ') ' + originalTitle;
} else {
document.title = originalTitle;
}
}
};
// automatic abbreviation for long (>2 digits) numbers var drawBubble = function(context, label, color) {
if (typeof label == 'number' && label > 99 && options.abbreviate) {
label = abbreviateNumber(label);
}
// bubble needs to be larger for double digits // automatic abbreviation for long (>2 digits) numbers
var len = (label + '').length-1; if (typeof label == 'number' && label > 99 && options.abbreviate) {
label = abbreviateNumber(label);
}
var width = options.width * r + (6 * r * len), // bubble needs to be larger for double digits
height = options.height * r; var len = (label + '').length-1;
var top = size - height, var width = options.width * r + (6 * r * len),
height = options.height * r;
var top = size - height,
left = size - width - r, left = size - width - r,
bottom = 16 * r, bottom = 16 * r,
right = 16 * r, right = 16 * r,
radius = 2 * r; radius = 2 * r;
// webkit seems to render fonts lighter than firefox // webkit seems to render fonts lighter than firefox
context.font = (browser.webkit ? 'bold ' : '') + options.font; context.font = (browser.webkit ? 'bold ' : '') + options.font;
context.fillStyle = options.background; context.fillStyle = options.background;
context.strokeStyle = options.background; context.strokeStyle = options.background;
context.lineWidth = r; context.lineWidth = r;
// bubble // bubble
context.beginPath(); context.beginPath();
context.moveTo(left + radius, top); context.moveTo(left + radius, top);
context.quadraticCurveTo(left, top, left, top + radius); context.quadraticCurveTo(left, top, left, top + radius);
context.lineTo(left, bottom - radius); context.lineTo(left, bottom - radius);
context.quadraticCurveTo(left, bottom, left + radius, bottom); context.quadraticCurveTo(left, bottom, left + radius, bottom);
context.lineTo(right - radius, bottom); context.lineTo(right - radius, bottom);
context.quadraticCurveTo(right, bottom, right, bottom - radius); context.quadraticCurveTo(right, bottom, right, bottom - radius);
@ -191,77 +203,85 @@
context.closePath(); context.closePath();
context.fill(); context.fill();
// bottom shadow // bottom shadow
context.beginPath(); context.beginPath();
context.strokeStyle = "rgba(0,0,0,0.3)"; context.strokeStyle = "rgba(0,0,0,0.3)";
context.moveTo(left + radius / 2.0, bottom); context.moveTo(left + radius / 2.0, bottom);
context.lineTo(right - radius / 2.0, bottom); context.lineTo(right - radius / 2.0, bottom);
context.stroke(); context.stroke();
// label // label
context.fillStyle = options.colour; context.fillStyle = options.color;
context.textAlign = "right"; context.textAlign = "right";
context.textBaseline = "top"; context.textBaseline = "top";
// unfortunately webkit/mozilla are a pixel different in text positioning // unfortunately webkit/mozilla are a pixel different in text positioning
context.fillText(label, r === 2 ? 29 : 15, browser.mozilla ? 7*r : 6*r); context.fillText(label, r === 2 ? 29 : 15, browser.mozilla ? 7*r : 6*r);
}; };
var refreshFavicon = function(){ var refreshFavicon = function(){
// check support // check support
if (!getCanvas().getContext) return; if (!getCanvas().getContext) return;
setFaviconTag(getCanvas().toDataURL()); setFaviconTag(getCanvas().toDataURL());
}; };
var abbreviateNumber = function(label) { var abbreviateNumber = function(label) {
var metricPrefixes = [ var metricPrefixes = [
['G', 1000000000], ['G', 1000000000],
['M', 1000000], ['M', 1000000],
['k', 1000] ['k', 1000]
]; ];
for(var i = 0; i < metricPrefixes.length; ++i) { for(var i = 0; i < metricPrefixes.length; ++i) {
if (label >= metricPrefixes[i][1]) { if (label >= metricPrefixes[i][1]) {
label = round(label / metricPrefixes[i][1]) + metricPrefixes[i][0]; label = round(label / metricPrefixes[i][1]) + metricPrefixes[i][0];
break; break;
} }
} }
return label; return label;
}; };
var round = function (value, precision) { var round = function (value, precision) {
var number = new Number(value); var number = new Number(value);
return number.toFixed(precision); return number.toFixed(precision);
}; };
// public methods // public methods
Tinycon.setOptions = function(custom){ Tinycon.setOptions = function(custom){
options = {}; options = {};
for(var key in defaults){ // account for deprecated UK English spelling
options[key] = custom.hasOwnProperty(key) ? custom[key] : defaults[key]; if (custom.colour) {
} custom.color = custom.colour;
return this; }
};
for(var key in defaults){
Tinycon.setImage = function(url){ options[key] = custom.hasOwnProperty(key) ? custom[key] : defaults[key];
currentFavicon = url; }
refreshFavicon(); return this;
return this; };
};
Tinycon.setImage = function(url){
Tinycon.setBubble = function(label, colour) { currentFavicon = url;
label = label || ''; refreshFavicon();
drawFavicon(label, colour); return this;
return this; };
};
Tinycon.setBubble = function(label, color) {
Tinycon.reset = function(){ label = label || '';
setFaviconTag(originalFavicon); drawFavicon(label, color);
}; return this;
};
Tinycon.setOptions(defaults);
window.Tinycon = Tinycon; Tinycon.reset = function(){
})(); currentFavicon = originalFavicon;
setFaviconTag(originalFavicon);
};
Tinycon.setOptions(defaults);
window.Tinycon = Tinycon;
})();

Loading…
Cancel
Save