diff --git a/bower.json b/bower.json index 14b354f..d4d0cc6 100644 --- a/bower.json +++ b/bower.json @@ -1,6 +1,6 @@ { "name": "please-wait", - "version": "0.0.3", + "version": "0.0.4", "homepage": "https://github.com/Pathgather/please-wait", "authors": [ "Pathgather " diff --git a/build/please-wait.js b/build/please-wait.js index f5b4d48..64dcff8 100644 --- a/build/please-wait.js +++ b/build/please-wait.js @@ -1,13 +1,13 @@ /** -* PleaseWait +* please-wait * Display a nice loading screen while your app loads * @author Pathgather * @copyright Pathgather 2015 * @license MIT * @link https://github.com/Pathgather/please-wait -* @module pleaseWait -* @version 0.0.3 +* @module please-wait +* @version 0.0.4 */ (function(root, factory) { if (typeof exports === "object") { @@ -18,7 +18,7 @@ factory(root); } })(this, function(exports) { - var PleaseWait, animationEvent, animationSupport, domPrefixes, elm, key, pfx, pleaseWait, transEndEventNames, transitionEvent, transitionSupport, val, _i, _len; + var PleaseWait, addClass, animationEvent, animationSupport, domPrefixes, elm, key, pfx, pleaseWait, removeClass, transEndEventNames, transitionEvent, transitionSupport, val, _i, _len; elm = document.createElement('fakeelement'); animationSupport = false; transitionSupport = false; @@ -65,6 +65,20 @@ } } } + addClass = function(classname, elem) { + if (elem.classList) { + return elem.classList.add(classname); + } else { + return elem.className += " " + classname; + } + }; + removeClass = function(classname, elem) { + if (elem.classList) { + return elem.classList.remove(classname); + } else { + return elem.className = elem.className.replace(classname, "").trim(); + } + }; PleaseWait = (function() { PleaseWait._defaultOptions = { backgroundColor: null, @@ -100,15 +114,16 @@ if (this._logoElem != null) { this._logoElem.src = this.options.logo; } - document.body.className += " pg-loading"; + removeClass("pg-loaded", document.body); + addClass("pg-loading", document.body); document.body.appendChild(this._loadingElem); - this._loadingElem.className += " pg-loading"; + addClass("pg-loading", this._loadingElem); this._onLoadedCallback = this.options.onLoadedCallback; listener = (function(_this) { return function(evt) { _this.loaded = true; _this._readyToShowLoadingHtml = true; - _this._loadingHtmlElem.className += " pg-loaded"; + addClass("pg-loaded", _this._loadingHtmlElem); if (animationSupport) { _this._loadingHtmlElem.removeEventListener(animationEvent, listener); } @@ -132,7 +147,7 @@ this._loadingHtmlListener = (function(_this) { return function() { _this._readyToShowLoadingHtml = true; - _this._loadingHtmlElem.className = _this._loadingHtmlElem.className.replace(" pg-loading ", ""); + removeClass("pg-loading", _this._loadingHtmlElem); if (transitionSupport) { _this._loadingHtmlElem.removeEventListener(transitionEvent, _this._loadingHtmlListener); } @@ -144,7 +159,8 @@ this._removingHtmlListener = (function(_this) { return function() { _this._loadingHtmlElem.innerHTML = _this._loadingHtmlToDisplay.shift(); - _this._loadingHtmlElem.className = _this._loadingHtmlElem.className.replace(" pg-removing ", " pg-loading "); + removeClass("pg-removing", _this._loadingHtmlElem); + addClass("pg-loading", _this._loadingHtmlElem); if (transitionSupport) { _this._loadingHtmlElem.removeEventListener(transitionEvent, _this._removingHtmlListener); return _this._loadingHtmlElem.addEventListener(transitionEvent, _this._loadingHtmlListener); @@ -222,9 +238,10 @@ this._readyToShowLoadingHtml = false; this._loadingHtmlElem.removeEventListener(transitionEvent, this._loadingHtmlListener); this._loadingHtmlElem.removeEventListener(transitionEvent, this._removingHtmlListener); - this._loadingHtmlElem.className = this._loadingHtmlElem.className.replace(" pg-loading ", "").replace(" pg-removing ", ""); + removeClass("pg-loading", this._loadingHtmlElem); + removeClass("pg-removing", this._loadingHtmlElem); if (transitionSupport) { - this._loadingHtmlElem.className += " pg-removing "; + addClass("pg-removing", this._loadingHtmlElem); return this._loadingHtmlElem.addEventListener(transitionEvent, this._removingHtmlListener); } else { return this._removingHtmlListener(); @@ -239,14 +256,14 @@ if (this._loadingElem == null) { return; } - document.body.className += " pg-loaded"; + addClass("pg-loaded", document.body); if (typeof this._onLoadedCallback === "function") { this._onLoadedCallback.apply(this); } listener = (function(_this) { return function() { document.body.removeChild(_this._loadingElem); - document.body.className = document.body.className.replace("pg-loading", ""); + removeClass("pg-loading", document.body); if (animationSupport) { _this._loadingElem.removeEventListener(animationEvent, listener); } @@ -254,7 +271,7 @@ }; })(this); if (!immediately && animationSupport) { - this._loadingElem.className += " pg-loaded"; + addClass("pg-loaded", document.body); return this._loadingElem.addEventListener(animationEvent, listener); } else { return listener(); diff --git a/build/please-wait.min.js b/build/please-wait.min.js index 1e88c9d..e3fbe25 100644 --- a/build/please-wait.min.js +++ b/build/please-wait.min.js @@ -1,12 +1,12 @@ /** -* PleaseWait +* please-wait * Display a nice loading screen while your app loads * @author Pathgather * @copyright Pathgather 2015 * @license MIT * @link https://github.com/Pathgather/please-wait -* @module pleaseWait -* @version 0.0.3 +* @module please-wait +* @version 0.0.4 */ -!function(a,b){"object"==typeof exports?b(exports):"function"==typeof define&&define.amd?define(["exports"],b):b(a)}(this,function(a){var b,c,d,e,f,g,h,i,j,k,l,m,n,o;f=document.createElement("fakeelement"),d=!1,l=!1,c="animationend",k=null,e="Webkit Moz O ms".split(" "),j={WebkitTransition:"webkitTransitionEnd",MozTransition:"transitionend",OTransition:"oTransitionEnd",msTransition:"MSTransitionEnd",transition:"transitionend"};for(g in j)if(m=j[g],null!=f.style[g]){k=m,l=!0;break}if(null!=f.style.animationName&&(d=!0),!d)for(n=0,o=e.length;o>n;n++)if(h=e[n],null!=f.style[""+h+"AnimationName"]){switch(h){case"Webkit":c="webkitAnimationEnd";break;case"Moz":c="animationend";break;case"O":c="oanimationend";break;case"ms":c="MSAnimationEnd"}d=!0;break}return b=function(){function a(a){var b,e,f,g;b=this.constructor._defaultOptions,this.options={},this.loaded=!1,this.finishing=!1;for(e in b)g=b[e],this.options[e]=null!=a[e]?a[e]:g;this._loadingElem=document.createElement("div"),this._loadingHtmlToDisplay=[],this._loadingElem.className="pg-loading-screen",null!=this.options.backgroundColor&&(this._loadingElem.style.backgroundColor=this.options.backgroundColor),this._loadingElem.innerHTML=this.options.template,this._loadingHtmlElem=this._loadingElem.getElementsByClassName("pg-loading-html")[0],null!=this._loadingHtmlElem&&(this._loadingHtmlElem.innerHTML=this.options.loadingHtml),this._readyToShowLoadingHtml=!1,this._logoElem=this._loadingElem.getElementsByClassName("pg-loading-logo")[0],null!=this._logoElem&&(this._logoElem.src=this.options.logo),document.body.className+=" pg-loading",document.body.appendChild(this._loadingElem),this._loadingElem.className+=" pg-loading",this._onLoadedCallback=this.options.onLoadedCallback,f=function(a){return function(b){return a.loaded=!0,a._readyToShowLoadingHtml=!0,a._loadingHtmlElem.className+=" pg-loaded",d&&a._loadingHtmlElem.removeEventListener(c,f),a._loadingHtmlToDisplay.length>0&&a._changeLoadingHtml(),a.finishing?(null!=b&&b.stopPropagation(),a._finish()):void 0}}(this),null!=this._loadingHtmlElem&&(d?this._loadingHtmlElem.addEventListener(c,f):f(),this._loadingHtmlListener=function(a){return function(){return a._readyToShowLoadingHtml=!0,a._loadingHtmlElem.className=a._loadingHtmlElem.className.replace(" pg-loading ",""),l&&a._loadingHtmlElem.removeEventListener(k,a._loadingHtmlListener),a._loadingHtmlToDisplay.length>0?a._changeLoadingHtml():void 0}}(this),this._removingHtmlListener=function(a){return function(){return a._loadingHtmlElem.innerHTML=a._loadingHtmlToDisplay.shift(),a._loadingHtmlElem.className=a._loadingHtmlElem.className.replace(" pg-removing "," pg-loading "),l?(a._loadingHtmlElem.removeEventListener(k,a._removingHtmlListener),a._loadingHtmlElem.addEventListener(k,a._loadingHtmlListener)):a._loadingHtmlListener()}}(this))}return a._defaultOptions={backgroundColor:null,logo:null,loadingHtml:null,template:"
\n
\n
\n

\n \n

\n
\n
\n
\n
\n
",onLoadedCallback:null},a.prototype.finish=function(a,b){return null==a&&(a=!1),window.document.hidden&&(a=!0),this.finishing=!0,null!=b&&this.updateOption("onLoadedCallback",b),this.loaded||a?this._finish(a):void 0},a.prototype.updateOption=function(a,b){switch(a){case"backgroundColor":return this._loadingElem.style.backgroundColor=b;case"logo":return this._logoElem.src=b;case"loadingHtml":return this.updateLoadingHtml(b);case"onLoadedCallback":return this._onLoadedCallback=b;default:throw new Error("Unknown option '"+a+"'")}},a.prototype.updateOptions=function(a){var b,c,d;null==a&&(a={}),d=[];for(b in a)c=a[b],d.push(this.updateOption(b,c));return d},a.prototype.updateLoadingHtml=function(a,b){if(null==b&&(b=!1),null==this._loadingHtmlElem)throw new Error("The loading template does not have an element of class 'pg-loading-html'");return b?(this._loadingHtmlToDisplay=[a],this._readyToShowLoadingHtml=!0):this._loadingHtmlToDisplay.push(a),this._readyToShowLoadingHtml?this._changeLoadingHtml():void 0},a.prototype._changeLoadingHtml=function(){return this._readyToShowLoadingHtml=!1,this._loadingHtmlElem.removeEventListener(k,this._loadingHtmlListener),this._loadingHtmlElem.removeEventListener(k,this._removingHtmlListener),this._loadingHtmlElem.className=this._loadingHtmlElem.className.replace(" pg-loading ","").replace(" pg-removing ",""),l?(this._loadingHtmlElem.className+=" pg-removing ",this._loadingHtmlElem.addEventListener(k,this._removingHtmlListener)):this._removingHtmlListener()},a.prototype._finish=function(a){var b;return null==a&&(a=!1),null!=this._loadingElem?(document.body.className+=" pg-loaded","function"==typeof this._onLoadedCallback&&this._onLoadedCallback.apply(this),b=function(a){return function(){return document.body.removeChild(a._loadingElem),document.body.className=document.body.className.replace("pg-loading",""),d&&a._loadingElem.removeEventListener(c,b),a._loadingElem=null}}(this),!a&&d?(this._loadingElem.className+=" pg-loaded",this._loadingElem.addEventListener(c,b)):b()):void 0},a}(),i=function(a){return null==a&&(a={}),new b(a)},a.pleaseWait=i,i}); \ No newline at end of file +!function(a,b){"object"==typeof exports?b(exports):"function"==typeof define&&define.amd?define(["exports"],b):b(a)}(this,function(a){var b,c,d,e,f,g,h,i,j,k,l,m,n,o,p,q;g=document.createElement("fakeelement"),e=!1,n=!1,d="animationend",m=null,f="Webkit Moz O ms".split(" "),l={WebkitTransition:"webkitTransitionEnd",MozTransition:"transitionend",OTransition:"oTransitionEnd",msTransition:"MSTransitionEnd",transition:"transitionend"};for(h in l)if(o=l[h],null!=g.style[h]){m=o,n=!0;break}if(null!=g.style.animationName&&(e=!0),!e)for(p=0,q=f.length;q>p;p++)if(i=f[p],null!=g.style[""+i+"AnimationName"]){switch(i){case"Webkit":d="webkitAnimationEnd";break;case"Moz":d="animationend";break;case"O":d="oanimationend";break;case"ms":d="MSAnimationEnd"}e=!0;break}return c=function(a,b){return b.classList?b.classList.add(a):b.className+=" "+a},k=function(a,b){return b.classList?b.classList.remove(a):b.className=b.className.replace(a,"").trim()},b=function(){function a(a){var b,f,g,h;b=this.constructor._defaultOptions,this.options={},this.loaded=!1,this.finishing=!1;for(f in b)h=b[f],this.options[f]=null!=a[f]?a[f]:h;this._loadingElem=document.createElement("div"),this._loadingHtmlToDisplay=[],this._loadingElem.className="pg-loading-screen",null!=this.options.backgroundColor&&(this._loadingElem.style.backgroundColor=this.options.backgroundColor),this._loadingElem.innerHTML=this.options.template,this._loadingHtmlElem=this._loadingElem.getElementsByClassName("pg-loading-html")[0],null!=this._loadingHtmlElem&&(this._loadingHtmlElem.innerHTML=this.options.loadingHtml),this._readyToShowLoadingHtml=!1,this._logoElem=this._loadingElem.getElementsByClassName("pg-loading-logo")[0],null!=this._logoElem&&(this._logoElem.src=this.options.logo),k("pg-loaded",document.body),c("pg-loading",document.body),document.body.appendChild(this._loadingElem),c("pg-loading",this._loadingElem),this._onLoadedCallback=this.options.onLoadedCallback,g=function(a){return function(b){return a.loaded=!0,a._readyToShowLoadingHtml=!0,c("pg-loaded",a._loadingHtmlElem),e&&a._loadingHtmlElem.removeEventListener(d,g),a._loadingHtmlToDisplay.length>0&&a._changeLoadingHtml(),a.finishing?(null!=b&&b.stopPropagation(),a._finish()):void 0}}(this),null!=this._loadingHtmlElem&&(e?this._loadingHtmlElem.addEventListener(d,g):g(),this._loadingHtmlListener=function(a){return function(){return a._readyToShowLoadingHtml=!0,k("pg-loading",a._loadingHtmlElem),n&&a._loadingHtmlElem.removeEventListener(m,a._loadingHtmlListener),a._loadingHtmlToDisplay.length>0?a._changeLoadingHtml():void 0}}(this),this._removingHtmlListener=function(a){return function(){return a._loadingHtmlElem.innerHTML=a._loadingHtmlToDisplay.shift(),k("pg-removing",a._loadingHtmlElem),c("pg-loading",a._loadingHtmlElem),n?(a._loadingHtmlElem.removeEventListener(m,a._removingHtmlListener),a._loadingHtmlElem.addEventListener(m,a._loadingHtmlListener)):a._loadingHtmlListener()}}(this))}return a._defaultOptions={backgroundColor:null,logo:null,loadingHtml:null,template:"
\n
\n
\n

\n \n

\n
\n
\n
\n
\n
",onLoadedCallback:null},a.prototype.finish=function(a,b){return null==a&&(a=!1),window.document.hidden&&(a=!0),this.finishing=!0,null!=b&&this.updateOption("onLoadedCallback",b),this.loaded||a?this._finish(a):void 0},a.prototype.updateOption=function(a,b){switch(a){case"backgroundColor":return this._loadingElem.style.backgroundColor=b;case"logo":return this._logoElem.src=b;case"loadingHtml":return this.updateLoadingHtml(b);case"onLoadedCallback":return this._onLoadedCallback=b;default:throw new Error("Unknown option '"+a+"'")}},a.prototype.updateOptions=function(a){var b,c,d;null==a&&(a={}),d=[];for(b in a)c=a[b],d.push(this.updateOption(b,c));return d},a.prototype.updateLoadingHtml=function(a,b){if(null==b&&(b=!1),null==this._loadingHtmlElem)throw new Error("The loading template does not have an element of class 'pg-loading-html'");return b?(this._loadingHtmlToDisplay=[a],this._readyToShowLoadingHtml=!0):this._loadingHtmlToDisplay.push(a),this._readyToShowLoadingHtml?this._changeLoadingHtml():void 0},a.prototype._changeLoadingHtml=function(){return this._readyToShowLoadingHtml=!1,this._loadingHtmlElem.removeEventListener(m,this._loadingHtmlListener),this._loadingHtmlElem.removeEventListener(m,this._removingHtmlListener),k("pg-loading",this._loadingHtmlElem),k("pg-removing",this._loadingHtmlElem),n?(c("pg-removing",this._loadingHtmlElem),this._loadingHtmlElem.addEventListener(m,this._removingHtmlListener)):this._removingHtmlListener()},a.prototype._finish=function(a){var b;return null==a&&(a=!1),null!=this._loadingElem?(c("pg-loaded",document.body),"function"==typeof this._onLoadedCallback&&this._onLoadedCallback.apply(this),b=function(a){return function(){return document.body.removeChild(a._loadingElem),k("pg-loading",document.body),e&&a._loadingElem.removeEventListener(d,b),a._loadingElem=null}}(this),!a&&e?(c("pg-loaded",document.body),this._loadingElem.addEventListener(d,b)):b()):void 0},a}(),j=function(a){return null==a&&(a={}),new b(a)},a.pleaseWait=j,j}); \ No newline at end of file diff --git a/package.json b/package.json index 684c8f8..a6dfc1d 100644 --- a/package.json +++ b/package.json @@ -12,7 +12,8 @@ "type": "git", "url": "git://github.com/Pathgather/please-wait.git" }, - "version": "0.0.3", + "main": "build/please-wait.js", + "version": "0.0.4", "devDependencies": { "grunt": "~0.4.5", "grunt-contrib-jshint": "~0.10.0",