if ( typeof Kawatsuku == 'undefined' ) Kawatsuku = {};
new function(){
Kawatsuku.lightbox = (function(){
var config;
var next_btn;
var prev_btn;
var current = 1;
var limit = 1;
var fileinfo = {};
return {
setup : function(settings){
config = settings;
this.show_thumb_event();
},
show_thumb_event : function(){
var self = this;
$(config.target.single).click(function(){
if ( (fileinfo = self.get_fileinfo(this)) == null ) return;
current = 1;
var src = fileinfo.path + fileinfo.filename + '.png';
fileinfo.src = src;
fileinfo.type = config.type.single;
self.show();
});
$(config.target.multi).click(function(){
if ( (fileinfo = self.get_fileinfo(this)) == null ) return;
current = 1;
var src = fileinfo.path + fileinfo.filename + '_0' + current + '.png';
var class_name = $(this).attr('class').split('_');
fileinfo.src = src;
fileinfo.type = config.type.multi;
limit = ( class_name.length == 2 ) ? parseInt(class_name[1],10) : 1;
self.show();
});
},
get_fileinfo : function(node){
var src = $(node).attr('src');
var match;
var fileinfo = {};
if ( match = src.match(/(.*\/)(.*?)(_o)?(\.jpg)$/) ) {
if ( match.length == 5 ) {
return {
path : match[1] + 'lightbox/',
filename : match[2],
extension : match[4]
}
}
}
return null;
},
show : function(){
this.write();
this.chk_btn();
this.set_btn_events();
this.hover_btn();
},
set_btn_events : function(){
this.set_close();
if ( fileinfo.type == config.type.single ) return;
this.set_next();
this.set_prev();
},
set_next : function(){
var self = this;
$('#'+config.content.next_btn).unbind().click(function(){
current++;
var src = fileinfo.path + fileinfo.filename + '_0' + current + '.png';
$('#'+config.content.thumb_image).attr('src', src);
self.chk_btn();
});
},
set_prev : function(){
var self = this;
$('#'+config.content.prev_btn).unbind().click(function(){
current--;
var src = fileinfo.path + fileinfo.filename + '_0' + current + '.png';
$('#'+config.content.thumb_image).attr('src', src);
self.chk_btn();
});
},
set_close : function(){
var overlay = $('#'+config.overlay.id);
var lightbox = $('#'+config.content.container_id);
$('#'+config.content.close_btn+', #'+config.overlay.id).unbind().click(function(){
if ($.browser.msie && $.browser.version <= 6) {
if ( overlay.get(0).style.getExpression('behavior') )
overlay.get(0).style.removeExpression('behavior');
if ( lightbox.get(0).getExpression('behavior') )
lightbox.get(0).style.removeExpression('behavior');
}
overlay.unbind('.overlay').remove();
lightbox.unbind('.lightbox').remove();
});
},
chk_btn : function(){
var next_btn = $('#'+config.content.next_btn);
var prev_btn = $('#'+config.content.prev_btn);
next_btn.hide();
prev_btn.hide();
if ( fileinfo.type == config.type.single ) return;
if ( current == 1 ) {
next_btn.show();
} else if ( current == limit ) {
prev_btn.show();
} else {
next_btn.show();
prev_btn.show();
}
},
hover_btn : function(){
var s = [
'#'+config.content.prev_btn,
'#'+config.content.next_btn,
'#'+config.content.close_btn
].join(',')
var un_hover;
var hover;
if (!($.browser.msie && $.browser.version <= 6)) {
un_hover = config.content.un_hover_img;
hover = config.content.hover_img;
$(s).hover(
function(){
$(un_hover, this).hide();
$(hover, this).show();
},
function(){
$(un_hover, this).show();
$(hover, this).hide();
}
);
} else {
un_hover = config.content.un_hover_span;
hover = config.content.hover_span;
$(s).hover(
function(){
$(un_hover, this).parent().hide();
$(hover, this).parent().show();
},
function(){
$(un_hover, this).parent().show();
$(hover, this).parent().hide();
}
);
}
},
write : function(){
this.write_lightbox();
this.write_overlay();
},
write_lightbox : function(){
var template = config.template.lightbox;
var html = template.replace(/\{\#(\w+)\}/g, function(){
if (arguments[1] === 'img_uri') return fileinfo.src;
});
$(config.insert.node).prepend(html);
if (!($.browser.msie && $.browser.version <= 6)) return;
this.trace($('#'+config.content.container_id), 'center');
$(window).resize();
$.Meca.pngfix.exec();
},
write_overlay : function(){
$(config.insert.node).prepend(config.template.overlay);
if ( $.browser.msie ) {
$('#'+config.overlay.id).css({
'filter' : 'alpha(opacity=80)'
});
}
if (!($.browser.msie && $.browser.version <= 6)) return;
$('#'+config.overlay.id).css({
'position' : 'absolute',
'width' : $(window).width(),
'height' : $(window).height(),
'filter' : 'alpha(opacity=80)'
});
this.trace($('#'+config.overlay.id));
},
trace : function(node, type){
var self = this;
if ( type == 'center' ) {
var margin_top = - Math.round((config.content.height)/2);
var margin_left = - Math.round((config.content.width)/2);
$(window).bind('resize.lightbox', function(){
if ( node.get(0).style.getExpression('behavior') )
node.get(0).style.removeExpression('behavior');
$(node).css({
'position' : 'absolute',
'margin-left' : margin_left,
'margin-top' : margin_top
});
self.scroll_trace(node, 'center');
});
} else {
$(window).bind('resize.overlay', function(){
$(node).css({
'position' : 'absolute',
'width' : $(window).width(),
'height' : $(window).height()
});
});
self.scroll_trace(node);
}
},
scroll_trace : function(node, type){
var top = 0;
var left = 0;
if ( type == 'center' ) {
top = Math.round($(window).height()/2);
left = Math.round($(window).width()/2);
}
node.get(0).style.setExpression(
'behavior', 'Kawatsuku.lightbox.fixed(this,'+top+','+left+')'
);
},
fixed : function(el, top, left){
el.style.top = (document.body.scrollTop || document.documentElement.scrollTop) + top + 'px';
el.style.left = (document.body.scrollLeft || document.documentElement.scrollLeft) + left + 'px';
}
}
})();
};
$(function(){
var config = {};
config.content = {};
config.overlay = {};
config.insert = {};
config.target = {
single : 'img.single',
multi : 'img[class*=multi]'
}
config.group = '.thumbGroup';
config.single = '.thumbSingle';
config.image = '.thumbnail';
config.type = {
single : 'single',
multi : 'multi'
}
var content = config.content;
content.container_id = 'lbImage';
content.inner_id = 'lbImageInner';
content.thumb_image = 'lbThumImg';
content.prev_btn = 'btnPrevImage';
content.next_btn = 'btnNextImage';
content.close_btn = 'btnCloseLbLogin';
content.width = 455;
content.height = 490;
content.un_hover_img = 'img[class!=hover]';
content.hover_img = 'img[class*=hover]';
content.un_hover_span = 'img:not(img[class*=hover])';
content.hover_span = 'img[class*=hover]';
var overlay = config.overlay;
overlay.id = 'overlay';
var insert = config.insert;
insert.node = 'body';
config.template = {
lightbox : [
'',
'
',
'
',
'
',
'
',
'
',
'
',
'
',
'
',
'
',
'
',
'
',
'
',
'
',
'
',
'
',
'