var SqueezeBox={
presets:{
size:{x:600,y:450},
sizeLoading:{x:200,y:150},
marginInner:{x:20,y:20},
marginImage:{x:150,y:200},
handler:false,
adopt:null,
closeWithOverlay:true,
zIndex:65555,
overlayOpacity:0.7,
classWindow:'',
classOverlay:'',
disableFx:false,
onOpen:Class.empty,
onClose:Class.empty,
onUpdate:Class.empty,
onResize:Class.empty,
onMove:Class.empty,
onShow:Class.empty,
onHide:Class.empty,
fxOverlayDuration:250,
fxResizeDuration:750,
fxContentDuration:250,
ajaxOptions:{}
},
initialize:function(options){
if(this.options)return this;
this.presets=$merge(this.presets,options)
this.setOptions(this.presets);
this.build();
this.listeners={
window:this.reposition.bind(this,[null]),
close:this.close.bind(this),
key:this.onkeypress.bind(this)};
this.isOpen=this.isLoading=false;
this.window.close=this.listeners.close;
return this;
},
build:function(){
this.overlay=new Element('div',{
id:'sbox-overlay',
styles:{
display:'none',
zIndex:this.options.zIndex
}
});
this.content=new Element('div',{
id:'sbox-content'
});
this.btnClose=new Element('a',{
id:'sbox-btn-close',
href:'#'
});
this.window=new Element('div',{
id:'sbox-window',
styles:{
display:'none',
zIndex:this.options.zIndex+2
}
}).adopt(this.btnClose,this.content);
if(!window.ie6){
this.overlay.setStyles({
position:'fixed',
top:0,
left:0
});
this.window.setStyles({
position:'fixed',
top:'50%',
left:'50%'
});
}else{
this.overlay.style.setExpression('marginTop','document.documentElement.scrollTop + "px"');
this.window.style.setExpression('marginTop','0 - parseInt(this.offsetHeight / 2) + document.documentElement.scrollTop + "px"');
this.overlay.setStyles({
position:'absolute',
top:'0%',
left:'0%'
});
this.window.setStyles({
position:'absolute',
top:'0%',
left:'0%'
});
}
$(document.body).adopt(this.overlay,this.window);
this.fx={
overlay:this.overlay.effect('opacity',{
duration:this.options.fxOverlayDuration,
wait:false}).set(0),
window:this.window.effects({
duration:this.options.fxResizeDuration,
wait:false}),
content:this.content.effect('opacity',{
duration:this.options.fxContentDuration,
wait:false}).set(0)
};
},
addClick:function(el){
return el.addEvent('click',function(){
if(this.fromElement(el))return false;
}.bind(this));
},
fromElement:function(el,options){
this.initialize();
this.element=$(el);
if(this.element&&this.element.rel)options=$merge(options||{},Json.evaluate(this.element.rel));
this.setOptions(this.presets,options);
this.assignOptions();
this.url=(this.element?(this.options.url||this.element.href):el)||'';
if(this.options.handler){
var handler=this.options.handler;
return this.setContent(handler,this.parsers[handler].call(this,true));
}
var res=false;
for(var key in this.parsers){
if((res=this.parsers[key].call(this)))return this.setContent(key,res);
}
return this;
},
assignOptions:function(){
this.overlay.setProperty('class',this.options.classOverlay);
this.window.setProperty('class',this.options.classWindow);
},
close:function(e){
if(e)new Event(e).stop();
if(!this.isOpen)return this;
this.fx.overlay.start(0).chain(this.toggleOverlay.bind(this));
this.window.setStyle('display','none');
this.trashImage();
this.toggleListeners();
this.isOpen=null;
this.fireEvent('onClose',[this.content]).removeEvents();
this.options={};
this.setOptions(this.presets).callChain();
return this;
},
onError:function(){
if(this.image)this.trashImage();
this.setContent('Error during loading');
},
trashImage:function(){
if(this.image)this.image=this.image.onload=this.image.onerror=this.image.onabort=null;
},
setContent:function(handler,content){
this.content.setProperty('class','sbox-content-'+handler);
this.applyTimer=this.applyContent.delay(this.fx.overlay.options.duration,this,[this.handlers[handler].call(this,content)]);
if(this.overlay.opacity)return this;
this.toggleOverlay(true);
this.fx.overlay.start(this.options.overlayOpacity);
this.reposition();
return this;
},
applyContent:function(content,size){
this.applyTimer=$clear(this.applyTimer);
this.hideContent();
if(!content)this.toggleLoading(true);
else{
if(this.isLoading)this.toggleLoading(false);
this.fireEvent('onUpdate',[this.content],20);
}
this.content.empty()[['string','array',false].contains($type(content))?'setHTML':'adopt'](content||'');
this.callChain();
if(!this.isOpen){
this.toggleListeners(true);
this.resize(size,true);
this.isOpen=true;
this.fireEvent('onOpen',[this.content]);
}else this.resize(size);
},
resize:function(size,instantly){
var sizes=window.getSize();
this.size=$merge(this.isLoading?this.options.sizeLoading:this.options.size,size);
var to={
width:this.size.x,
height:this.size.y,
marginLeft:-this.size.x/2,
marginTop:-this.size.y/2
};
$clear(this.showTimer||null);
this.hideContent();
if(!instantly)this.fx.window.start(to).chain(this.showContent.bind(this));
else{
this.window.setStyles(to).setStyle('display','');
this.showTimer=this.showContent.delay(50,this);
}
this.reposition(sizes);
},
toggleListeners:function(state){
var task=state?'addEvent':'removeEvent';
this.btnClose[task]('click',this.listeners.close);
if(this.options.closeWithOverlay)this.overlay[task]('click',this.listeners.close);
document[task]('keydown',this.listeners.key);
window[task]('resize',this.listeners.window);
window[task]('scroll',this.listeners.window);
},
toggleLoading:function(state){
this.isLoading=state;
this.window[state?'addClass':'removeClass']('sbox-loading');
if(state)this.fireEvent('onLoading',[this.window]);
},
toggleOverlay:function(state){
this.overlay.setStyle('display',state?'':'none');
$(document.body)[state?'addClass':'removeClass']('body-overlayed');
},
showContent:function(){
if(this.content.opacity)this.fireEvent('onShow',[this.window]);
this.fx.content.start(1);
},
hideContent:function(){
if(!this.content.opacity)this.fireEvent('onHide',[this.window]);
this.fx.content.stop().set(0);
},
onkeypress:function(e){
switch(e.key){
case'esc':
case'x':
this.close();
break;
}
},
reposition:function(sizes){
sizes=sizes||window.getSize();
this.overlay.setStyles({
width:sizes.size.x,
height:sizes.size.y
});
this.fireEvent('onMove',[this.overlay,this.window,sizes]);
},
removeEvents:function(type){
if(!this.$events)return this;
if(!type)this.$events=null;
else if(this.$events[type])this.$events[type]=null;
return this;
},
parsers:{
'image':function(preset){
return(preset||this.url.test(/\.(jpg|jpeg|png|gif|bmp)$/i))?this.url:false;
},
'adopt':function(preset){
if($(this.options.adopt))return $(this.options.adopt);
if(preset||($(this.element)&&!this.element.parentNode))return $(this.element);
var bits=this.url.match(/#([\w-]+)$/);
return bits?$(bits[1]):false;
},
'url':function(preset){
return(preset||(this.url&&!this.url.test(/^javascript:/i)))?this.url:false;
},
'iframe':function(preset){
return(preset||this.url)?this.url:false;
},
'string':function(preset){
return true;
}
},
handlers:{
'image':function(url){
this.image=new Image();
var events={
loaded:function(){
var win={x:window.getWidth()-this.options.marginImage.x,y:window.getHeight()-this.options.marginImage.y};
var size={x:this.image.width,y:this.image.height};
for(var i=0;i<2;i++)
if(size.x>win.x){
size.y*=win.x/size.x;
size.x=win.x;
}else if(size.y>win.y){
size.x*=win.y/size.y;
size.y=win.y;
}
size={x:parseInt(size.x),y:parseInt(size.y)};
if(window.webkit419)this.image=new Element('img',{'src':this.image.src});
else $(this.image);
this.image.setProperties({
'width':size.x,
'height':size.y});
this.applyContent(this.image,size);
}.bind(this),
failed:this.onError.bind(this)
};
(function(){
this.src=url;
}).delay(10,this.image);
this.image.onload=events.loaded;
this.image.onerror=this.image.onabort=events.failed;
},
'adopt':function(el){
return el.clone();
},
'url':function(url){
this.ajax=new Ajax(url,this.options.ajaxOptions);
this.ajax.addEvent('onSuccess',function(resp){
this.applyContent(resp);
this.ajax=null;
}.bind(this));
this.ajax.addEvent('onFailure',this.onError.bind(this));
this.ajax.request.delay(10,this.ajax);
},
'iframe':function(url){
return new Element('iframe',{
'src':url,
'frameBorder':0,
'width':this.options.size.x,
'height':this.options.size.y
});
},
'string':function(str){
return str;
}
},
extend:$extend
};
SqueezeBox.extend(Events.prototype);
SqueezeBox.extend(Options.prototype);
SqueezeBox.extend(Chain.prototype);