UI.Modal = function(url, options) {

    this.options = {
        type: 'image',
        alt: '',
        loading: false,
        opacity: 30,
        width: 0, height: 0
    };
    Object.extend(this.options, options);
    var options = this.options;

    if (!UI.$('UIModalB')) UI.Modal.print();
    UI.setOpacity(UI.$('UIModalB'), options.opacity);

    UI.Modal.setB();
    if (options.loading) UI.Modal.center(UI.$('UIModalL'));

    if (options.type == 'image') {
        UI.$('UIModalF').innerHTML = '<img id="UIModalImage" src="' + url + '" alt="' + options.alt + '" />';
        if (options.loading) UI.$('UIModalImage').style.display = 'none';
        UI.addEvent(UI.$('UIModalImage'), 'load', UI.Modal.onload);
    }
    else if (options.type == 'iframe') {
        UI.$('UIModalF').innerHTML = '<iframe name="UIModalIframe" id="UIModalIframe" src="' + url + '" ' + options.status + '></iframe>';
        if (options.loading) {
            UI.$('UIModalIframe').style.display = 'none';
            UI.addEvent(UI.$('UIModalIframe'), 'load', UI.Modal.onload);
        }
        UI.Modal.center(UI.$('UIModalF'));
    }
    UI.Modal.self = this;
    UI.addEvent(UI.$('UIModalB'), 'click', UI.Modal.reset);
    if(document.getElementById('modal')) {
	UI.addEvent(window, 'resize', UI.Modal.onresize);
    UI.addEvent(window, 'scroll', UI.Modal.onscroll);
	}
};
UI.Modal.self={};
UI.Modal.onload=function(){
	UI.$('UIModalL').style.display='none';
	var pos=UI.getScroll();
	UI.Modal.center(UI.$('UIModalF'));	
	if(UI.Modal.self.options.type=='image')
	{
		UI.$('UIModalImage').style.display='block';
		UI.resizeImage(UI.$('UIModalImage'),pos.width,pos.height);	
	}
	else 
	{
		UI.$('UIModalIframe').style.display='block';
	}
	UI.Modal.center(UI.$('UIModalF'));
};
UI.Modal.print=function(){
	var d=document.createElement('div');
	var s='';
	s+='<div id="UIModalB" style="z-index:99998;width:100%;height:100%;position:absolute;display:none;background-color:#000;"></div>';
	s+='<div id="UIModalF" style="z-index:99999;position:absolute;display:none;"></div>';
	s+='<div id="UIModalL" style="z-index:99999;display:none;position:absolute;border:2px solid gray;">·ÎµùÁß..</div>';
	d.innerHTML=s;
	d.id = 'modal';
	document.getElementsByTagName('body')[0].appendChild(d);		
};
UI.Modal.setB=function(){
	var w=UI.$('UIModalB');
	var pos=UI.getScroll();
	w.style.top=pos.top+'px';
	w.style.left=pos.left+'px';
	if(document.all)
	{
		w.style.width=pos.width+'px';
		w.style.height=pos.height+'px';
	}
	w.style.display='block'	
};
UI.Modal.center=function(el){
	el.style.display='block';
	var pos=UI.getScroll();
	el.style.left=pos.width/2-el.offsetWidth/2+pos.left+'px';
	el.style.top=pos.height/2-el.offsetHeight/2+pos.top+'px';
};
UI.Modal.reset=function(){
	UI.Modal.self=null;
	UI.$('UIModalF').innerHTML='';
	UI.$('UIModalB').style.display='none';
	UI.$('UIModalF').style.display='none';
	UI.$('UIModalL').style.display='none';
	UI.delEvent(window,'resize',UI.Modal.onresize);
	UI.delEvent(window,'scroll',UI.Modal.onscroll);
};
UI.Modal.onresize=function(){
	if(!UI.$('modal')) return false;
	var pos=UI.getScroll();
	if(UI.Modal.self.options.type=='image') UI.resizeImage(UI.$('UIModalImage'),pos.width,pos.height);
	UI.Modal.center(UI.$('UIModalF'));
	UI.Modal.setB();
};
UI.Modal.onscroll=function(){
	if(!UI.$('modal')) return false;
	UI.Modal.onresize();
};