Current File : /home/users/barii/public_html/finansenl.com.pl/wodki/js/iosOverlay.js |
/*global $*/
/*jshint unused:false,forin:false*/
'use strict';
var iosOverlay = function(params) {
var overlayDOM;
var noop = function() {};
var defaults = {
onbeforeshow: noop,
onshow: noop,
onbeforehide: noop,
onhide: noop,
text: "",
icon: null,
spinner: null,
duration: null,
id: null,
parentEl: null
};
// helper - merge two objects together, without using $.extend
var merge = function(obj1, obj2) {
var obj3 = {};
for (var attrOne in obj1) {
obj3[attrOne] = obj1[attrOne];
}
for (var attrTwo in obj2) {
obj3[attrTwo] = obj2[attrTwo];
}
return obj3;
};
// helper - does it support CSS3 transitions/animation
var doesTransitions = (function() {
var b = document.body || document.documentElement;
var s = b.style;
var p = 'transition';
if (typeof s[p] === 'string') {
return true;
}
// Tests for vendor specific prop
var v = ['Moz', 'Webkit', 'Khtml', 'O', 'ms'];
p = p.charAt(0).toUpperCase() + p.substr(1);
for (var i = 0; i < v.length; i++) {
if (typeof s[v[i] + p] === 'string') {
return true;
}
}
return false;
}());
// setup overlay settings
var settings = merge(defaults, params);
//
var handleAnim = function(anim) {
if (anim.animationName === "ios-overlay-show") {
settings.onshow();
}
if (anim.animationName === "ios-overlay-hide") {
destroy();
settings.onhide();
}
};
// IIFE
var create = (function() {
// initial DOM creation and event binding
overlayDOM = document.createElement("div");
overlayDOM.className = "ui-ios-overlay";
overlayDOM.innerHTML += '<span class="title">' + settings.text + '</span';
if (params.icon) {
overlayDOM.innerHTML += '<img src="' + params.icon + '">';
} else if (params.spinner) {
overlayDOM.appendChild(params.spinner.el);
}
if (doesTransitions) {
overlayDOM.addEventListener("webkitAnimationEnd", handleAnim, false);
overlayDOM.addEventListener("msAnimationEnd", handleAnim, false);
overlayDOM.addEventListener("oAnimationEnd", handleAnim, false);
overlayDOM.addEventListener("animationend", handleAnim, false);
}
if (params.parentEl) {
document.getElementById(params.parentEl).appendChild(overlayDOM);
} else {
document.body.appendChild(overlayDOM);
}
settings.onbeforeshow();
// begin fade in
if (doesTransitions) {
overlayDOM.className += " ios-overlay-show";
} else if (typeof $ === "function") {
$(overlayDOM).fadeIn({
duration: 200
}, function() {
settings.onshow();
});
}
if (settings.duration) {
window.setTimeout(function() {
hide();
}, settings.duration);
}
}());
var hide = function() {
// pre-callback
settings.onbeforehide();
// fade out
if (doesTransitions) {
// CSS animation bound to classes
overlayDOM.className = overlayDOM.className.replace("show", "hide");
} else if (typeof $ === "function") {
// polyfill requires jQuery
$(overlayDOM).fadeOut({
duration: 200
}, function() {
destroy();
settings.onhide();
});
}
};
var destroy = function() {
if (params.parentEl) {
document.getElementById(params.parentEl).removeChild(overlayDOM);
} else {
document.body.removeChild(overlayDOM);
}
};
var update = function(params) {
if (params.text) {
overlayDOM.getElementsByTagName("span")[0].innerHTML = params.text;
}
if (params.icon) {
if (settings.spinner) {
// Unless we set spinner to null, this will throw on the second update
settings.spinner.el.parentNode.removeChild(settings.spinner.el);
settings.spinner = null;
}
overlayDOM.innerHTML += '<img src="' + params.icon + '">';
}
};
return {
hide: hide,
destroy: destroy,
update: update
};
};
//Added support for requirejs
if (typeof define === 'function' && define.amd) {
define([], function() {
return iosOverlay;
});
}