diff --git a/humane.js b/humane.js
index 31b26d2..7325c66 100644
--- a/humane.js
+++ b/humane.js
@@ -8,8 +8,9 @@
*/
;(function (win,doc) {
- var on, off, isArray,
+ var humane, on, off, isArray,
eventing = false,
+ useTransitions = false,
animationInProgress = false,
humaneEl = null,
timeout = null,
@@ -17,6 +18,9 @@
vendors = { Webkit: 'webkit', Moz: '', O: 'o', ms: 'MS' },
eventPrefix = "",
isSetup = false,
+ currentMessage = {},
+ noop = function(){},
+ events = { 'add': noop, 'show': noop, 'hide': noop },
queue = [];
if ('addEventListener' in win) {
@@ -38,10 +42,9 @@
return win.humane[type][config] !== void 0 ? win.humane[type][config] : win.humane[config];
}
- on (win,'load', setup)
+ on (win,'load', setup);
function setup() {
- var useTransitions = false;
humaneEl = doc.createElement('div');
humaneEl.id = 'humane';
humaneEl.className = 'humane';
@@ -68,18 +71,17 @@
timeout = null;
}
- var next = queue.shift(),
- type = next[0],
- content = next[1];
-
- humane._lastCallback = next[2];
+ var next = queue.shift();
+ currentMessage = { type: next[0], message: next[1], callback: next[2] };
+ var content = currentMessage.message,
+ type = currentMessage.type;
if ( getConfig(type, 'clickToClose') === true ) {
on (humaneEl, 'click', remove);
on (humaneEl, 'touchstart', remove);
}
- timeoutInMillis = getConfig(type, 'timeout');
+ var timeoutInMillis = getConfig(type, 'timeout');
if (timeoutInMillis > 0) {
timeout = setTimeout(function(){ // allow notification to stay alive for timeout
@@ -89,12 +91,12 @@
on (doc.body, 'keypress', remove);
on (doc.body, 'touchstart', remove);
eventing = true;
- console.log( getConfig(type, 'waitForMove') );
if( getConfig(type, 'waitForMove') !== true ) remove();
}
}, timeoutInMillis);
}
+ events['show'](type,content,'show');
if ( isArray(content) ) content = '
';
humaneEl.innerHTML = content;
@@ -104,7 +106,6 @@
function animate (level,type) {
if (level === 1) {
humaneEl.className = "humane humane-" + type + " humane-animate";
- off ( humaneEl, normalizeEvent('TransitionEnd'), end );
}
else {
humaneEl.className = humaneEl.className.replace(" humane-animate","");
@@ -126,8 +127,11 @@
function end() {
+ // turn off animation event if supported, a little trigger happy
+ if(useTransitions) off ( humaneEl, normalizeEvent('TransitionEnd'), end );
animationInProgress = false;
- if(humane._lastCallback) humane._lastCallback()
+ if(currentMessage.callback) currentMessage.callback();
+ events['hide'](currentMessage.type, currentMessage.message,'hide');
run();
}
@@ -175,19 +179,24 @@
function notifier (type) {
return function (message, cb) {
queue.push( [type, message, cb] );
+ events['add'](type,message,'add');
if (isSetup) run();
}
}
- win.humane = notifier('log');
- win.humane.log = notifier('log');
- win.humane.error = notifier('error');
- win.humane.info = notifier('info');
- win.humane.success = notifier('success');
+ // types
+ humane = notifier('log');
+ humane.log = notifier('log');
+ humane.error = notifier('error');
+ humane.info = notifier('info');
+ humane.success = notifier('success');
// options
- win.humane.timeout = 2500;
- win.humane.waitForMove = false;
- win.humane.clickToClose = false;
+ humane.timeout = 2500;
+ humane.waitForMove = false;
+ humane.clickToClose = false;
+ // events
+ humane.on = function(type, handler){ events[type] = handler; };
+ win.humane = humane;
})( window, document );
diff --git a/humane.min.js b/humane.min.js
index dd76183..8bfe179 100644
--- a/humane.min.js
+++ b/humane.min.js
@@ -5,4 +5,4 @@
* @example
* humane('hello world');
* See more usage examples at: http://wavded.github.com/humane-js/
- */(function(a,b){function o(a){return l?l+a:a.toLowerCase()}function p(b,c){return a.humane[b][c]!==void 0?a.humane[b][c]:a.humane[c]}function q(){var a=!1;h=b.createElement("div"),h.id="humane",h.className="humane",b.body.appendChild(h);for(vendor in k)vendor+"TransitionProperty"in h.style&&(l=k[vendor],a=!0);a||(s=w),m=!0,r()}function r(){if(g)return;if(!n.length){t();return}after=null,g=!0,i&&(clearTimeout(i),i=null);var a=n.shift(),d=a[0],j=a[1];humane._lastCallback=a[2],p(d,"clickToClose")===!0&&(c(h,"click",t),c(h,"touchstart",t)),timeoutInMillis=p(d,"timeout"),timeoutInMillis>0&&(i=setTimeout(function(){f||(c(b.body,"mousemove",t),c(b.body,"click",t),c(b.body,"keypress",t),c(b.body,"touchstart",t),f=!0,console.log(p(d,"waitForMove")),p(d,"waitForMove")!==!0&&t())},timeoutInMillis)),e(j)&&(j=""),h.innerHTML=j,s(1,d)}function s(a,b){a===1?(h.className="humane humane-"+b+" humane-animate",d(h,o("TransitionEnd"),u)):(h.className=h.className.replace(" humane-animate",""),c(h,o("TransitionEnd"),u))}function t(){d(b.body,"mousemove",t),d(b.body,"click",t),d(b.body,"keypress",t),d(b.body,"touchstart",t),d(h,"click",t),d(h,"touchstart",t),f=!1,g&&s(0)}function u(){g=!1,humane._lastCallback&&humane._lastCallback(),r()}function w(a,b){var c,d;a===1?(d=0,h.className="humane humane-js-animate humane-"+b,j&&v(0),c=setInterval(function(){d<1?(d+=.1,d>1&&(d=1),v(d)):clearInterval(c)},5)):(d=1,c=setInterval(function(){d>0?(d-=.1,d<0&&(d=0),v(d)):(h.className=h.className.replace(" humane-js-animate",""),clearInterval(c),u())},5))}function x(a){return function(b,c){n.push([a,b,c]),m&&r()}}var c,d,e,f=!1,g=!1,h=null,i=null,j=/msie [678]/i.test(navigator.userAgent),k={Webkit:"webkit",Moz:"",O:"o",ms:"MS"},l="",m=!1,n=[];"addEventListener"in a?(c=function(a,b,c){a.addEventListener(b,c,!1)},d=function(a,b,c){a.removeEventListener(b,c,!1)}):(c=function(a,b,c){a.attachEvent("on"+b,c)},d=function(a,b,c){a.detachEvent("on"+b,c)}),e=Array.isArray||function(a){return Object.prototype.toString.call(a)==="[object Array]"},c(a,"load",q);var v=j?function(a){h.filters.item("DXImageTransform.Microsoft.Alpha").Opacity=a*100}:function(a){h.style.opacity=String(a)};a.humane=x("log"),a.humane.log=x("log"),a.humane.error=x("error"),a.humane.info=x("info"),a.humane.success=x("success"),a.humane.timeout=2500,a.humane.waitForMove=!1,a.humane.clickToClose=!1})(window,document);
\ No newline at end of file
+ */(function(a,b){function t(a){return n?n+a:a.toLowerCase()}function u(b,c){return a.humane[b][c]!==void 0?a.humane[b][c]:a.humane[c]}function v(){j=b.createElement("div"),j.id="humane",j.className="humane",b.body.appendChild(j);for(vendor in m)vendor+"TransitionProperty"in j.style&&(n=m[vendor],h=!0);h||(x=B),o=!0,w()}function w(){if(i)return;if(!s.length){y();return}after=null,i=!0,k&&(clearTimeout(k),k=null);var a=s.shift();p={type:a[0],message:a[1],callback:a[2]};var c=p.message,e=p.type;u(e,"clickToClose")===!0&&(d(j,"click",y),d(j,"touchstart",y));var h=u(e,"timeout");h>0&&(k=setTimeout(function(){g||(d(b.body,"mousemove",y),d(b.body,"click",y),d(b.body,"keypress",y),d(b.body,"touchstart",y),g=!0,u(e,"waitForMove")!==!0&&y())},h)),r.show(e,c,"show"),f(c)&&(c=""),j.innerHTML=c,x(1,e)}function x(a,b){a===1?j.className="humane humane-"+b+" humane-animate":(j.className=j.className.replace(" humane-animate",""),d(j,t("TransitionEnd"),z))}function y(){e(b.body,"mousemove",y),e(b.body,"click",y),e(b.body,"keypress",y),e(b.body,"touchstart",y),e(j,"click",y),e(j,"touchstart",y),g=!1,i&&x(0)}function z(){h&&e(j,t("TransitionEnd"),z),i=!1,p.callback&&p.callback(),r.hide(p.type,p.message,"hide"),w()}function B(a,b){var c,d;a===1?(d=0,j.className="humane humane-js-animate humane-"+b,l&&A(0),c=setInterval(function(){d<1?(d+=.1,d>1&&(d=1),A(d)):clearInterval(c)},5)):(d=1,c=setInterval(function(){d>0?(d-=.1,d<0&&(d=0),A(d)):(j.className=j.className.replace(" humane-js-animate",""),clearInterval(c),z())},5))}function C(a){return function(b,c){s.push([a,b,c]),r.add(a,b,"add"),o&&w()}}var c,d,e,f,g=!1,h=!1,i=!1,j=null,k=null,l=/msie [678]/i.test(navigator.userAgent),m={Webkit:"webkit",Moz:"",O:"o",ms:"MS"},n="",o=!1,p={},q=function(){},r={add:q,show:q,hide:q},s=[];"addEventListener"in a?(d=function(a,b,c){a.addEventListener(b,c,!1)},e=function(a,b,c){a.removeEventListener(b,c,!1)}):(d=function(a,b,c){a.attachEvent("on"+b,c)},e=function(a,b,c){a.detachEvent("on"+b,c)}),f=Array.isArray||function(a){return Object.prototype.toString.call(a)==="[object Array]"},d(a,"load",v);var A=l?function(a){j.filters.item("DXImageTransform.Microsoft.Alpha").Opacity=a*100}:function(a){j.style.opacity=String(a)};c=C("log"),c.log=C("log"),c.error=C("error"),c.info=C("info"),c.success=C("success"),c.timeout=2500,c.waitForMove=!1,c.clickToClose=!1,c.on=function(a,b){r[a]=b},a.humane=c})(window,document);
\ No newline at end of file
diff --git a/index.html b/index.html
index f2e3712..16d58fe 100644
--- a/index.html
+++ b/index.html
@@ -137,6 +137,21 @@ Customizing Options Per Type
humane.log('I'm up for 3 seconds');
humane.info('I'm up for 1 second');
+ Events
+ humane.js provides some events more intended for plumbing purposes, say you wanted to implement stacking or logging:
+ humane.on('add', function(type, message) { ... });
+
+ Fires when a new message is added to the queue
+
+ humane.on('show', function(type, message) { ... });
+
+ Fires when a message is about to be shown
+
+ humane.on('hide', function(type, message) { ... });
+
+ Fires when a message is hidden and removed
+
+
Browser Support
Uses CSS Transitions where available otherwise falls back to JS animation, degrades gracefully.