$(function() {
var lightboxStructure = {
setHandler: function(obj) {
var $form = $(obj).filter('form'),
$notForm = $(obj).not('form');
$notForm.bind('click', function(e) {
e.preventDefault();
lightboxStructure.clickTarget(e);
});
$form.bind('submit', function(e) {
e.preventDefault();
lightboxStructure.submitForm(this);
});
$('#jsiLightboxOverlay, #jsiLightboxWrap :button').bind('click', function() {
lightboxStructure.destroy();
});
},
clickTarget: function(e) {
var targetAttr = $(e.currentTarget).attr('href'),
imgSuffix = /\.(jpg|gif|png|bmp|jpeg)(.*)?$/i;
if (targetAttr.match(imgSuffix)) {
lightboxStructure.imageFlag = true;
lightboxStructure.showPageInBox(targetAttr);
} else {
lightboxStructure.showPageInBox(targetAttr);
}
},
showPageInBox: function(href, options) {
var defaults = {
data: null,
method: 'GET'
},
settings = $.extend({}, defaults, options),
fadeInt = lightboxStructure.fade.int,
fadeSpeed = fadeInt ? fadeInt[1] : 0,
$doc = $('html, body'),
$html = $('html'),
$body = $('body'),
$wrapper, $lightBox, $lightboxWrapper, $lightboxBody, $loadImg;
lightboxStructure.scrollFlag = false;
if (lightboxStructure.imageFlag) {
$lightbox = $('
').attr('id', 'jsiLightbox').addClass('lightboxWrap yS');
$lightboxWrapper = $('').addClass('lightBoxWrapper').css('width', '800px').css('height', '600px');
$lightboxBody = $('').attr('id', 'jsiLightboxBody').css('text-align', 'center');
$loadImg = $('').attr('src', href);
lightboxStructure.imageFlag = false;
lightboxStructure.overlay();
if ($('#jsiLightboxWrap').is(':visible')) {
if (fadeSpeed === 0) {
return;
} else {
$('#jsiLightboxWrap').fadeOut(fadeSpeed);
}
}
if (!jQuery.support.style) {//IE6,7
$('#jsiLightboxWrap').find('td').append($lightbox);
} else {
$('#jsiLightboxWrap').append($lightbox);
}
if ($.browser.msie && $.browser.version < 8) {
// $html.css({overflowY: 'hidden'});
// $body.css({overflowY: 'hidden', paddingRight: '16px'});
} else {
// $body.css({overflowY: 'hidden', paddingRight: '16px'});
}
$lightbox.append($lightboxWrapper);
$lightboxWrapper.append($lightboxBody);
$lightboxBody.append($loadImg);
lightboxStructure.figureBox();
lightboxStructure.setHandler($('#jsiLightboxWrap').find('.jscLightbox'));
lightboxStructure.windowResize();
$lightboxBody.css('height', 'auto');
$lightboxBody.css('width', 'auto');
} else {
if (href !== '#') {
$.ajax({
url: href,
data: settings.data,
method: settings.method,
beforeSend: function() {
if (!jQuery.support.style) {//IE6,7
$wrapper = $('#jsiLightboxWrap').find('td');
} else {
$wrapper = $('#jsiLightboxWrap');
}
if ($wrapper.length === 0) {
lightboxStructure.overlay();
}
if ($wrapper.is(':visible')) {
if (fadeSpeed === 0) {
return;
} else {
$wrapper.fadeOut(fadeSpeed);
}
}
$.lightbox.showSpinner();
},
success: function(data) {
$.lightbox.spinnerFlag = false;
if (!jQuery.support.style) {//IE6,7
$wrapper = $('#jsiLightboxWrap').find('td');
} else {
$wrapper = $('#jsiLightboxWrap');
}
$.lightbox.hideSpinner();
if ($.browser.msie && $.browser.version < 8) {
// $html.css({overflowY: 'hidden'});
// $body.css({overflowY: 'hidden', paddingRight: '16px'});
} else {
// $body.css({overflowY: 'hidden', paddingRight: '16px'});
}
if ('wrapClass' in settings) {
$wrapper.addClass(settings.wrapClass);
}
$wrapper.html(data);
lightboxStructure.figureBox();
lightboxStructure.setHandler($wrapper.find('.jscLightbox'));
lightboxStructure.windowResize();
if ($.lightbox.callback) {
$.lightbox.callback();
}
},
error: function() {
$.lightbox.spinnerFlag = false;
$.lightbox.hideSpinner();
$.lightbox.destroy();
}
});
}
}
},
submitForm: function(obj) {
var $form = $(obj);
lightboxStructure.showPageInBox($form.attr('action'), {
data: $form.serialize(),
method: $form.attr('method') || "POST"
});
},
imageFlag: false,
destroy: function(callback) {
var $destroied = $('#jsiLightboxOverlay, #jsiLightboxWrap, #jsiLightboxIframe'),
fadeInt = lightboxStructure.fade.int,
$window = $(window),
$html = $('html'),
$body = $('body'),
fadeSpeed = fadeInt ? fadeInt[2] : 0;
$destroied.fadeOut(fadeSpeed, function() {
$(this).remove();
if (callback) {
callback();
}
});
$window.unbind('resize', lightboxStructure.windowResize);
if ($.browser.msie && $.browser.version < 8) {
// $html.css('overflow-y', '');
// $body.css({overflowY: 'visible', paddingRight: 0});
} else {
// $body.css({overflowY: 'scroll', paddingRight: 0});
}
},
overlay: function() {
if (!jQuery.support.style) {//IE6,7
var wrapper = '';
} else {
var wrapper = '';
}
var overlay = '',
iframe = '',
$document = $(document),
$window = $(window),
$body = $('body'),
winWidth = $window.width(),
docHeight = $document.height();
if ($.browser.msie && $.browser.version < 7 && !window.XMLHttpRequest) {
$body.append(iframe, overlay, wrapper);
} else {
$body.append(overlay, wrapper);
}
$('#jsiLightboxOverlay, #jsiLightboxIframe').css({
backgroundColor: '#FFFFFF',
opacity: 0.5,
height: docHeight,
width: winWidth,
position: 'absolute',
top: 0,
left: 0,
zIndex: 100,
cursor: 'pointer'
});
$('#jsiLightboxWrap').hide();
},
figureBox: function() {
var $wrapper = $('#jsiLightboxWrap'),
$window = $(window),
$document = $(document),
$body = $('body'),
docHeight = $window.height(),
docWidth = $window.width(),
docHalfHeight = Math.floor(docHeight / 2),
docHalfWidth = Math.floor(docWidth / 2),
scrollTop = $window.scrollTop(),
scrollLeft = $window.scrollLeft(),
targetHeight = Math.floor($wrapper.height() / 2),
targetWidth = Math.floor($wrapper.width() / 2),
fadeInt = lightboxStructure.fade.int,
ieTop, ieLeft, ieWidth, ieHeight,
fadeSpeed = fadeInt ? fadeInt[0] : 0;
if ($.browser.msie && $.browser.version < 7 && !window.XMLHttpRequest) {
$wrapper.fadeIn(fadeSpeed).css({
position: 'absolute',
top: scrollTop + docHalfHeight - targetHeight,
left: scrollLeft + docHalfWidth - targetWidth,
zIndex: 1000
});
$window.bind('scroll', function() {
if ($body.css('backgroundImage') === 'none') {
$body.css({
backgroundImage: 'url(#jsiLightboxWrap)',
backgroundAttachment: 'fixed'
});
}
$wrapper.css({
top: $document.scrollTop() + docHalfHeight - targetHeight,
left: $document.scrollLeft() + docHalfWidth - targetWidth
});
lightboxStructure.windowResize();
});
} else {
$wrapper.fadeIn(fadeSpeed).css({
position: 'fixed',
top: docHalfHeight - targetHeight,
left: docHalfWidth - targetWidth,
zIndex: 1000
});
}
$window.bind('resize', lightboxStructure.windowResize);
},
scrollFlag: false,
figureScrollBar: function() {
var $lightboxBody = $('#jsiLightboxBody'),
$window = $(window),
$wrapper = $('#jsiLightbox'),
lightboxBodyWidth = $lightboxBody.innerWidth();
$lightboxBody.css('height', 'auto');
if ($wrapper.height() > $window.height()) {
$lightboxBody.css({
height: $window.height() - $('#jsiLightboxTitle').height() - 80,
width: (lightboxStructure.scrollFlag) ? lightboxBodyWidth + 'px': lightboxBodyWidth + 17 + 'px',
overflowY: 'scroll',
overflowX: 'hidden'
});
lightboxStructure.scrollFlag = true;
} else if ($wrapper.height() < $window.height()) {
$lightboxBody.css({
height: 'auto',
width: (lightboxStructure.scrollFlag) ? lightboxBodyWidth - 17 + 'px' : lightboxBodyWidth + 'px',
overflowY: 'hidden',
overflowX: 'hidden'
});
lightboxStructure.scrollFlag = false;
}
lightboxStructure.figureBox();
lightboxStructure.windowResize();
},
windowResize: function() {
var $window = $(window),
$document = $(document),
$wrapper = $('#jsiLightboxWrap'),
$overlay = $('#jsiLightboxOverlay, #jsiLightboxIframe'),
winHeight = $window.height() / 2,
winWidth = $window.width() / 2,
docHeight = $document.height(),
targetHeight = $wrapper.height() / 2,
targetWidth = $wrapper.width() / 2;
// for Android's resize problem.
lightboxStructure.mobileResizeControl();
if ($.browser.msie && $.browser.version < 7 && !window.XMLHttpRequest) {
$wrapper.css({
top: $document.scrollTop() + winHeight - targetHeight,
left: $document.scrollLeft() + winWidth - targetWidth
});
} else {
$wrapper.css({
top: winHeight - targetHeight,
left: winWidth - targetWidth
});
}
$overlay.css({
height: docHeight,
width: winWidth * 2
});
},
mobileResizeControl: function() {
var androidUa = /.*Android.*/i,
$wrapper = $('#jsiLightboxWrap'),
docHalfHeight = Math.floor(screen.height / 2),
docHalfWidth = Math.floor(screen.width / 2),
targetHeight = $wrapper.height() / 2,
targetWidth = $wrapper.width() / 2;
if (androidUa.test(navigator.userAgent)) {
$wrapper.css({
position: 'absolute',
top: docHalfHeight - targetHeight,
left: docHalfWidth - targetWidth,
zIndex: 1000
});
}
},
defaults: {
init: null,
url: null
},
fade: function(int) {
//fadeIn,fadeOut option.
if (int) {
this.fade.int = int;
} else {
this.fade.int = [250, 0, 150]; //This is default array, ex:[lightbox show sp, transition sp, destroy sp]
}
return this;
},
modal: function() {
var $close = $('#jsiLightboxClose');
$('#jsiLightboxOverlay, #jsiLightboxWrap :button').unbind('click')
.css('cursor', 'default');
$close.insertAfter('#jsiLightbox .lightBoxTitle > h1')
.bind('click', function() {
lightboxStructure.destroy();
});
}
}
$.fn.extend({
lightbox: function(options) {
var settings = $.extend({}, lightboxStructure.defaults, options);
if (settings.init === true && this.selector === null) {
$.lightbox(settings);
}
return this.each(function() {
lightboxStructure.setHandler(this);
});
},
fade: function(opt) {
lightboxStructure.fade(opt);
return this;
}
});
$.extend({
lightbox: function(options, settings) {
lightboxStructure.showPageInBox(options.url, settings ? settings : {});
}
});
$.extend($.lightbox, {
defaultSpinnerUrl: '/img/spinner.gif',
initDefaultSpinner: function() {
var preloadImg = new Image();
preloadImg.src = $.lightbox.defaultSpinnerUrl;
},
spinnerFlag: true,
showSpinner: function(options) {
var defaults = {
imgUrl: $.lightbox.defaultSpinnerUrl,
wait: true,
contents: undefined
},
settings = $.extend({}, defaults, options),
$contents = settings.contents ? settings.contents : $('body'),
$viewport = settings.contents ? settings.contents : $(window),
docHeight = $viewport.height(),
docWidth = $viewport.width(),
docHalfHeight = Math.floor(docHeight / 2),
docHalfWidth = Math.floor(docWidth / 2),
scrollTop = $viewport.scrollTop(),
scrollLeft = $viewport.scrollLeft(),
$spinner = $('').attr({id: 'jsiPreloadImg', src: settings.imgUrl}),
spinnerInsert = function() {
if ($viewport === settings.contents) {
$spinner.appendTo($contents).css({
position: 'absolute',
top: scrollTop + docHalfHeight + Math.floor($spinner.height() / 2),
left: scrollLeft + docHalfWidth - Math.floor($spinner.width() / 2),
zIndex: 1500,
backgroundColor: '#FFFFFF'
});
} else {
$spinner.appendTo($contents).css({
position: 'absolute',
top: scrollTop + docHalfHeight - Math.floor($spinner.height() / 2),
left: scrollLeft + docHalfWidth - Math.floor($spinner.width() / 2),
zIndex: 1500,
backgroundColor: '#FFFFFF'
});
}
};
if (settings.wait) {
setTimeout(function() {
if ($.lightbox.spinnerFlag) {
spinnerInsert();
}
$.lightbox.spinnerFlag = true;
}, 500);
} else {
spinnerInsert();
}
},
hideSpinner: function() {
$('#jsiPreloadImg').hide().remove();
},
destroy: function(callback) {
lightboxStructure.destroy(callback);
},
figureScrollBar: function() {
lightboxStructure.figureScrollBar();
},
modal: function() {
lightboxStructure.modal();
}
});
setTimeout(function() {
$.lightbox.initDefaultSpinner();
}, 13);
});