diff options
Diffstat (limited to 'themes')
| -rw-r--r-- | themes/default/js/plugins/piecon.js | 189 | ||||
| -rw-r--r-- | themes/default/js/plugins/piecon.min.js | 1 |
2 files changed, 189 insertions, 1 deletions
diff --git a/themes/default/js/plugins/piecon.js b/themes/default/js/plugins/piecon.js new file mode 100644 index 000000000..f606706ac --- /dev/null +++ b/themes/default/js/plugins/piecon.js @@ -0,0 +1,189 @@ +// +// piecon.js +// +// https://github.com/lipka/piecon +// +// Copyright (c) 2015 Lukas Lipka <lukaslipka@gmail.com>. All rights reserved. +// + +(function(){ + var Piecon = {}; + + var currentFavicon = null; + var originalFavicon = null; + var originalTitle = null; + var canvas = null; + var options = {}; + var defaults = { + color: '#ff0084', + background: '#bbb', + shadow: '#fff', + fallback: false + }; + + var isRetina = window.devicePixelRatio > 1; + + var ua = (function () { + var agent = navigator.userAgent.toLowerCase(); + return function (browser) { + return agent.indexOf(browser) !== -1; + }; + }()); + + var browser = { + ie: ua('msie'), + chrome: ua('chrome'), + webkit: ua('chrome') || ua('safari'), + safari: ua('safari') && !ua('chrome'), + mozilla: ua('mozilla') && !ua('chrome') && !ua('safari') + }; + + var getFaviconTag = function() { + var links = document.getElementsByTagName('link'); + + for (var i = 0, l = links.length; i < l; i++) { + if (links[i].getAttribute('rel') === 'icon' || links[i].getAttribute('rel') === 'shortcut icon') { + return links[i]; + } + } + + return false; + }; + + var removeFaviconTag = function() { + var links = Array.prototype.slice.call(document.getElementsByTagName('link'), 0); + var head = document.getElementsByTagName('head')[0]; + + for (var i = 0, l = links.length; i < l; i++) { + if (links[i].getAttribute('rel') === 'icon' || links[i].getAttribute('rel') === 'shortcut icon') { + head.removeChild(links[i]); + } + } + }; + + var setFaviconTag = function(url) { + removeFaviconTag(); + + var link = document.createElement('link'); + link.type = 'image/x-icon'; + link.rel = 'icon'; + link.href = url; + + document.getElementsByTagName('head')[0].appendChild(link); + }; + + var getCanvas = function () { + if (!canvas) { + canvas = document.createElement("canvas"); + if (isRetina) { + canvas.width = 32; + canvas.height = 32; + } else { + canvas.width = 16; + canvas.height = 16; + } + } + + return canvas; + }; + + var drawFavicon = function(percentage) { + var canvas = getCanvas(); + var context = canvas.getContext("2d"); + + percentage = percentage || 0; + + if (context) { + context.clearRect(0, 0, canvas.width, canvas.height); + + // Draw shadow + context.beginPath(); + context.moveTo(canvas.width / 2, canvas.height / 2); + context.arc(canvas.width / 2, canvas.height / 2, Math.min(canvas.width / 2, canvas.height / 2), 0, Math.PI * 2, false); + context.fillStyle = options.shadow; + context.fill(); + + // Draw background + context.beginPath(); + context.moveTo(canvas.width / 2, canvas.height / 2); + context.arc(canvas.width / 2, canvas.height / 2, Math.min(canvas.width / 2, canvas.height / 2) - 2, 0, Math.PI * 2, false); + context.fillStyle = options.background; + context.fill(); + + // Draw pie + if (percentage > 0) { + context.beginPath(); + context.moveTo(canvas.width / 2, canvas.height / 2); + context.arc(canvas.width / 2, canvas.height / 2, Math.min(canvas.width / 2, canvas.height / 2) - 2, (-0.5) * Math.PI, (-0.5 + 2 * percentage / 100) * Math.PI, false); + context.lineTo(canvas.width / 2, canvas.height / 2); + context.fillStyle = options.color; + context.fill(); + } + + setFaviconTag(canvas.toDataURL()); + } + }; + + var updateTitle = function(percentage) { + if (percentage > 0) { + document.title = '(' + percentage + '%) ' + originalTitle; + } else { + document.title = originalTitle; + } + }; + + Piecon.setOptions = function(custom) { + options = {}; + + for (var key in defaults){ + options[key] = custom.hasOwnProperty(key) ? custom[key] : defaults[key]; + } + + return this; + }; + + Piecon.setProgress = function(percentage) { + if (!originalTitle) { + originalTitle = document.title; + } + + if (!originalFavicon || !currentFavicon) { + var tag = getFaviconTag(); + originalFavicon = currentFavicon = tag ? tag.getAttribute('href') : '/favicon.ico'; + } + + if (!isNaN(parseFloat(percentage)) && isFinite(percentage)) { + if (!getCanvas().getContext || browser.ie || browser.safari || options.fallback === true) { + // Fallback to updating the browser title if unsupported + return updateTitle(percentage); + } else if (options.fallback === 'force') { + updateTitle(percentage); + } + + return drawFavicon(percentage); + } + + return false; + }; + + Piecon.reset = function() { + if (originalTitle) { + document.title = originalTitle; + } + + if (originalFavicon) { + currentFavicon = originalFavicon; + setFaviconTag(currentFavicon); + } + }; + + Piecon.setOptions(defaults); + + if(typeof define === 'function' && define.amd) { + define(Piecon); + } else if (typeof module !== 'undefined') { + module.exports = Piecon; + } else { + window.Piecon = Piecon; + } +})(); diff --git a/themes/default/js/plugins/piecon.min.js b/themes/default/js/plugins/piecon.min.js deleted file mode 100644 index bc2aa1adf..000000000 --- a/themes/default/js/plugins/piecon.min.js +++ /dev/null @@ -1 +0,0 @@ -!function(){var a={},b=null,c=null,d=null,e=null,f={},g={color:"#ff0084",background:"#bbb",shadow:"#fff",fallback:!1},h=window.devicePixelRatio>1,i=function(){var a=navigator.userAgent.toLowerCase();return function(b){return-1!==a.indexOf(b)}}(),j={ie:i("msie"),chrome:i("chrome"),webkit:i("chrome")||i("safari"),safari:i("safari")&&!i("chrome"),mozilla:i("mozilla")&&!i("chrome")&&!i("safari")},k=function(){for(var a=document.getElementsByTagName("link"),b=0,c=a.length;c>b;b++)if("icon"===a[b].getAttribute("rel")||"shortcut icon"===a[b].getAttribute("rel"))return a[b];return!1},l=function(){for(var a=document.getElementsByTagName("link"),b=document.getElementsByTagName("head")[0],c=0,d=a.length;d>c;c++)("icon"===a[c].getAttribute("rel")||"shortcut icon"===a[c].getAttribute("rel"))&&b.removeChild(a[c])},m=function(a){l();var b=document.createElement("link");b.type="image/x-icon",b.rel="icon",b.href=a,document.getElementsByTagName("head")[0].appendChild(b)},n=function(){return e||(e=document.createElement("canvas"),h?(e.width=32,e.height=32):(e.width=16,e.height=16)),e},o=function(a){var b=n(),c=b.getContext("2d");a=a||0,c&&(c.clearRect(0,0,b.width,b.height),c.beginPath(),c.moveTo(b.width/2,b.height/2),c.arc(b.width/2,b.height/2,Math.min(b.width/2,b.height/2),0,2*Math.PI,!1),c.fillStyle=f.shadow,c.fill(),c.beginPath(),c.moveTo(b.width/2,b.height/2),c.arc(b.width/2,b.height/2,Math.min(b.width/2,b.height/2)-2,0,2*Math.PI,!1),c.fillStyle=f.background,c.fill(),a>0&&(c.beginPath(),c.moveTo(b.width/2,b.height/2),c.arc(b.width/2,b.height/2,Math.min(b.width/2,b.height/2)-2,-.5*Math.PI,(-.5+2*a/100)*Math.PI,!1),c.lineTo(b.width/2,b.height/2),c.fillStyle=f.color,c.fill()),m(b.toDataURL()))},p=function(a){document.title=a>0?"("+a+"%) "+d:d};a.setOptions=function(a){f={};for(var b in g)f[b]=a.hasOwnProperty(b)?a[b]:g[b];return this},a.setProgress=function(a){if(d||(d=document.title),!c||!b){var e=k();c=b=e?e.getAttribute("href"):"/favicon.ico"}return!isNaN(parseFloat(a))&&isFinite(a)?!n().getContext||j.ie||j.safari||f.fallback===!0?p(a):("force"===f.fallback&&p(a),o(a)):!1},a.reset=function(){d&&(document.title=d),c&&(b=c,m(b))},a.setOptions(g),window.Piecon=a}(); |