Last active
August 29, 2015 14:10
-
-
Save klauskpm/86ada377fa9beb9b9de5 to your computer and use it in GitHub Desktop.
Plugin to create an waiting page until something is done
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
// jQuery Plugin - Loader | |
// | |
// Needs: | |
// - jQuery(2.1.1) >> http://code.jquery.com/jquery-2.1.1.js | |
// - Centralize >> https://gist.github.com/klauskpm/fc25fef2b4c94131d854 | |
(function($) { | |
/** | |
* Plugin to create an waiting page until something is done | |
* @param {Object.<array, integer, boolean>} options Object with waiting | |
* texts(texts), time span between actions(interval), and the option to | |
* kill the loader(kill) | |
* @returns {Boolean|jQuery.this} | |
*/ | |
$.fn.loader = function(options) { | |
var settings = $.extend({ | |
texts: ['Loading...', 'Waiting for Maya\'s end of the world'], | |
interval: 2000, | |
kill: false | |
}, options), | |
$loaderBackground = $('<div class="loader-background"></div>'), | |
$loaderText = $('<span class="loader-text"></span>'), | |
$loaderHtml = $('<div class="loader"></div>').append($loaderBackground, $loaderText), | |
textNumber = 0; | |
if(settings.kill) { | |
$('.loader').remove(); | |
return false; | |
} | |
$('html body').append($loaderHtml); | |
if(settings.texts.length) { | |
textNumber = Math.floor(Math.random() * settings.texts.length); | |
$('.loader-text').text(settings.texts[textNumber]); | |
$('.loader-text').centralize(true); | |
if(settings.texts.length>1) { | |
setInterval(function(){ | |
var randomNumber = Math.floor(Math.random() * settings.texts.length); | |
if(textNumber==randomNumber) { | |
if(typeof(settings.texts[textNumber+1])!=='undefined') { | |
textNumber++; | |
} else { | |
textNumber--; | |
} | |
} else { | |
textNumber = randomNumber; | |
} | |
$('.loader-text').text(settings.texts[textNumber]); | |
}, settings.interval); | |
} | |
} else { | |
console.error('There is no loader text'); | |
} | |
return this; | |
}; | |
})(jQuery); |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
/** Loader **/ | |
.loader { | |
position: fixed; | |
width: 100%; | |
height: 100%; | |
top: 0; | |
left: 0; | |
z-index: 10; | |
} | |
.loader-background { | |
background: black; | |
width: 100%; | |
height: 100%; | |
position: fixed; | |
top: 0; | |
left: 0; | |
opacity: 0.8; | |
filter: alpha(opacity=80); | |
cursor: pointer; | |
z-index: 12; | |
} | |
.loader-text { | |
cursor: default; | |
color: white; | |
text-align: center; | |
position: fixed; | |
width: 100%; | |
font-size: 28px; | |
font-weight: 400; | |
z-index: 14; | |
} |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
_ |
Sign up for free
to join this conversation on GitHub.
Already have an account?
Sign in to comment