summaryrefslogtreecommitdiff
path: root/js/jquery.joverlay.js
diff options
context:
space:
mode:
Diffstat (limited to 'js/jquery.joverlay.js')
-rw-r--r--js/jquery.joverlay.js203
1 files changed, 123 insertions, 80 deletions
diff --git a/js/jquery.joverlay.js b/js/jquery.joverlay.js
index e4effec8e..cf4e15998 100644
--- a/js/jquery.joverlay.js
+++ b/js/jquery.joverlay.js
@@ -1,6 +1,6 @@
/* Copyright (c) 2009 Alvaro A. Lima Jr http://alvarojunior.com/jquery/joverlay.html
* Licensed under the MIT (http://www.opensource.org/licenses/mit-license.php)
- * Version: 0.7.1 (JUN 15, 2009)
+ * Version: 0.8 (OUT 19, 2009)
* Requires: jQuery 1.3+
*/
@@ -9,43 +9,54 @@
// Global vars
var isIE6 = $.browser.msie && $.browser.version == 6.0; // =(
var JOVERLAY_TIMER = null;
- var JOVERLAY_ELEMENT_PREV = null;
$.fn.jOverlay = function(options) {
// Element exist?
if ( $('#jOverlay').length ) {$.closeOverlay();}
- // Clear Element Prev
- JOVERLAY_ELEMENT_PREV = null;
-
// Clear Timer
if (JOVERLAY_TIMER !== null) {
clearTimeout( JOVERLAY_TIMER );
}
// Set Options
- var options = $.extend({}, $.fn.jOverlay.options, options);
+ var options = $.extend({}, $.fn.jOverlay.options, options || {});
- // private function
- function center(id) {
- if (options.center) {
- $.center(id);
- }
- }
+ // success deprecated !!! Use onSuccess
+ var onSuccess = options.onSuccess || options.success;
var element = this.is('*') ? this : '#jOverlayContent';
+
var position = isIE6 ? 'absolute' : 'fixed';
+
var isImage = /([^\/\\]+)\.(png|gif|jpeg|jpg|bmp)$/i.test( options.url );
var imgLoading = options.imgLoading ? "<img id='jOverlayLoading' src='"+options.imgLoading+"' style='position:"+position+"; z-index:"+(options.zIndex + 9)+";'/>" : '';
+ // private function
+ function center(id) {
+ if (options.center) {
+ $.center(id);
+ } else if( isIE6 ) {
+ $.center('#jOverlayContent',{
+ 'top' : $(window).scrollTop() + 'px',
+ 'marginLeft' : '',
+ 'marginTop' : '',
+ 'left' : ''
+ });
+ }
+ }
+
$('body').prepend(imgLoading + "<div id='jOverlay' />"
+ "<div id='jOverlayContent' style='position:"+position+"; z-index:"+(options.zIndex + 5)+"; display:none;'/>"
);
+ // Cache options
+ $('#jOverlayContent').data('options', options);
+
// Loading Centered
- $('#jOverlayLoading').load(function(){
+ $('#jOverlayLoading').load(function() {
center(this);
});
@@ -57,35 +68,42 @@
// Overlay Style
$('#jOverlay').css({
- backgroundColor : options.color,
- position : position,
- top : '0px',
- left : '0px',
- filter : 'alpha(opacity='+ (options.opacity * 100) +')', // IE =(
- opacity : options.opacity, // Good Browser =D
- zIndex : options.zIndex,
- width : !isIE6 ? '100%' : $(window).width() + 'px',
- height : !isIE6 ? '100%' : $(document).height() + 'px'
+ 'backgroundColor' : options.color,
+ 'position' : position,
+ 'top' : '0px',
+ 'left' : '0px',
+ 'filter' : 'alpha(opacity='+ (options.opacity * 100) +')', // IE =(
+ 'opacity' : options.opacity, // Good Browser =D
+ '-khtml-opacity' : options.opacity,
+ '-moz-opacity' : options.opacity,
+ 'zIndex' : options.zIndex,
+ 'width' : !isIE6 ? '100%' : $(window).width() + 'px',
+ 'height' : !isIE6 ? '100%' : $(document).height() + 'px'
}).show();
+ // INNER HTML
+ if ( $.trim(options.html) ) {
+ $(element).html(options.html);
+ }
+
// ELEMENT
if ( this.is('*') ) {
- JOVERLAY_ELEMENT_PREV = this.prev();
+ $('#jOverlayContent').data('jOverlayElementPrev', this.prev() );
$('#jOverlayContent').html(
- this.show().attr('display', options.autoHide ? 'none' : this.css('display') )
+ this.show().data('display', options.autoHide ? 'none' : this.css('display') )
);
-
+
if ( !isImage ) {
center('#jOverlayContent');
$('#jOverlayContent').show();
-
+
// Execute callback
- if ( !options.url && $.isFunction( options.success ) ) {
- options.success( this );
+ if ( !options.url && $.isFunction( onSuccess ) ) {
+ onSuccess( this );
}
}
@@ -106,13 +124,14 @@
$( element ).html(this);
center('#jOverlayContent');
+ center('#jOverlayLoading');
$('#jOverlayLoading').fadeOut(500);
$('#jOverlayContent').show();
// Execute callback
- if ( $.isFunction( options.success ) ) {
- options.success( this );
+ if ( $.isFunction( onSuccess ) ) {
+ onSuccess( $(element) );
}
}).error(function(){
@@ -138,8 +157,8 @@
center('#jOverlayContent');
// Execute callback
- if ($.isFunction( options.success )) {
- options.success(responseText);
+ if ( $.isFunction( onSuccess ) ) {
+ onSuccess( responseText );
}
},
@@ -163,8 +182,8 @@
$(window).resize(function(){
$('#jOverlay').css({
- width: $(window).width() + 'px',
- height: $(document).height() + 'px'
+ 'width' : $(window).width() + 'px',
+ 'height' : $(document).height() + 'px'
});
center('#jOverlayContent');
@@ -174,11 +193,15 @@
}
// Press ESC to close
- $(document).keydown(function(event){
- if (event.keyCode == 27) {
- $.closeOverlay();
- }
- });
+ if ( options.closeOnEsc ) {
+ $(document).keydown(function(event){
+ if ( event.keyCode == 27 ) {
+ $.closeOverlay();
+ }
+ });
+ } else {
+ $(document).unbind('keydown');
+ }
// Click to close
if ( options.bgClickToClose ) {
@@ -188,12 +211,13 @@
// Timeout (auto-close)
// time in millis to wait before auto-close
// set to 0 to disable
- if ( Number(options.timeout) > 0 ) {
- jOverlayTimer = setTimeout( $.closeOverlay, Number(options.timeout) );
+ if ( options.timeout && Number(options.timeout) > 0 ) {
+ JOVERLAY_TIMER = window.setTimeout( $.closeOverlay, Number(options.timeout) );
}
// ADD CSS
$('#jOverlayContent').css(options.css || {});
+
};
// Resizing large images - orginal by Christian Montoya.
@@ -202,68 +226,87 @@
var x = $(window).width() - 150;
var y = $(window).height() - 150;
if (imageWidth > x) {
- imageHeight = imageHeight * (x / imageWidth);
- imageWidth = x;
- if (imageHeight > y) {
- imageWidth = imageWidth * (y / imageHeight);
- imageHeight = y;
+ imageHeight = imageHeight * (x / imageWidth);
+ imageWidth = x;
+ if (imageHeight > y) {
+ imageWidth = imageWidth * (y / imageHeight);
+ imageHeight = y;
}
- } else if (imageHeight > y) {
- imageWidth = imageWidth * (y / imageHeight);
- imageHeight = y;
- if (imageWidth > x) {
- imageHeight = imageHeight * (x / imageWidth);
+ } else if (imageHeight > y) {
+ imageWidth = imageWidth * (y / imageHeight);
+ imageHeight = y;
+ if (imageWidth > x) {
+ imageHeight = imageHeight * (x / imageWidth);
imageWidth = x;
}
}
- return {width:imageWidth, height:imageHeight};
+ return {'width':imageWidth, 'height':imageHeight};
};
// Centered Element
- $.center = function(element) {
+ $.center = function(element, css) {
var element = $(element);
var elemWidth = element.width();
- element.css({
- width : elemWidth + 'px',
- marginLeft : '-' + (elemWidth / 2) + 'px',
- marginTop : '-' + element.height() / 2 + 'px',
- height : 'auto',
- top : !isIE6 ? '50%' : $(window).scrollTop() + ($(window).height() / 2) + 'px',
- left : '50%'
- });
+ element.css($.extend({},{
+ 'width' : elemWidth + 'px',
+ 'marginLeft' : '-' + (elemWidth / 2) + 'px',
+ 'marginTop' : '-' + element.height() / 2 + 'px',
+ 'height' : 'auto',
+ 'top' : !isIE6 ? '50%' : $(window).scrollTop() + ($(window).height() / 2) + 'px',
+ 'left' : '50%'
+ }, css || {}));
};
// Options default
$.fn.jOverlay.options = {
- method : 'GET',
- data : '',
- url : '',
- color : '#000',
- opacity : '0.6',
- zIndex : 9999,
- center : true,
- imgLoading : '',
- bgClickToClose : true,
- success : null,
- timeout : 0,
- autoHide : true,
- css : {}
+ 'method' : 'GET',
+ 'data' : '',
+ 'url' : '',
+ 'color' : '#000',
+ 'opacity' : '0.6',
+ 'zIndex' : 9999,
+ 'center' : true,
+ 'imgLoading' : '',
+ 'bgClickToClose' : true,
+ 'success' : null, // Deprecated : use onSuccess
+ 'onSuccess' : null,
+ 'timeout' : 0,
+ 'autoHide' : true,
+ 'css' : {},
+ 'html' : '',
+ 'closeOnEsc' : true
+ };
+
+ // Set default options (GLOBAL)
+ // Overiding the default values.
+ $.fn.jOverlay.setDefaults = function(options) {
+ $.fn.jOverlay.options = $.extend({}, $.fn.jOverlay.options, options || {});
};
// Close
$.closeOverlay = function() {
+ var content = $('#jOverlayContent');
+ var options = content.data('options');
+ var elementPrev = content.data('jOverlayElementPrev');
+
+ // Fix IE6 (SELECT)
if (isIE6) { $("select").show(); }
- if ( JOVERLAY_ELEMENT_PREV !== null ) {
- if ( JOVERLAY_ELEMENT_PREV !== null ) {
- var element = $('#jOverlayContent').children();
- JOVERLAY_ELEMENT_PREV.after( element.css('display', element.attr('display') ) );
- element.removeAttr('display');
- }
+ // Restore position
+ if ( elementPrev ) {
+ var contentChildren = content.children();
+ elementPrev.after( contentChildren.css('display', contentChildren.data('display') ) );
+ // Clear cache
+ contentChildren.removeData('display');
+ content.removeData('jOverlayElementPrev');
}
+ // Clear options cache
+ content.removeData('options');
+
+ // Remove joverlay elements
$('#jOverlayLoading, #jOverlayContent, #jOverlay').remove();
};