document.observe('dom:loaded', function () { 
    if($('popupboxes')) {
        prepareBoxes();
        setInterval('fadeEfect()', 50);
    }
});
window.onload = function () {
new Effect.Fade($('popupboxesOverlay'),{from: 1.0,	to: 0.0, duration: 0.3});
}
function prepareBoxes() {

    bgimg = new Image();
    bgimg.src = "/img/popupboxes/boxbg.png";
    
	$$('#popupboxes .box').each(function(s, i){
		s.id = 'box' + i;
        elements = new Array();
		if(s.innerHTML) {
		var content = s.innerHTML;
		s.innerHTML = "";
        
		contentDiv = new Element('div',{'id':s.id+'_popup','class':'popupbox'});
		bottomDiv = new Element('div',{'class':'popupboxBottom'});
        
		contentDiv.innerHTML = content;
        
        
        if(s.positionedOffset()[0] > 650) {
          /*  rightpx = $('popupboxes').getWidth() - (s.positionedOffset()[0] + s.getWidth());
            contentDiv.setStyle({right: rightpx+'px'});
            */
            contentDiv.setStyle({right: '0px'});
        }
        else {
            contentDiv.setStyle({left: s.getStyle('left')});
        }
        if(s.positionedOffset()[1] > 1) {
            bottompx = $('popupboxes').getHeight() - (s.positionedOffset()[1] + s.getHeight());
            contentDiv.setStyle({bottom: bottompx+'px'});
        }
        else {
            contentDiv.setStyle({top: s.getStyle('top')});
        }
		
        
        
		contentDiv.insert({bottom: bottomDiv});
		$('popupboxes').insert({top: contentDiv});
		
		if(contentDiv.getHeight() > $('popupboxes').getHeight()) {
			contentDiv.setStyle({height: $('popupboxes').getHeight()+'px', overflowY: 'scroll'});
			
		}
		
		contentDiv.hide();
		popupObserve(s);
        }
        
	});
}
function popupObserve(element) {
	element.observe('mouseenter', popupbox);	
	element.observe('mouseleave', closePopupbox);	
}
function popupbox(event) {
	var element = Event.element(event);
    $(element.id+'_popup').removeClassName('deactive');
	$(element.id+'_popup').setStyle({display: 'block', opacity: '1'});

    
    $(element.id+'_popup').observe('mouseenter', function(event){
        $(element.id+'_popup').removeClassName('deactive');
        $(element.id+'_popup').setStyle({display: 'block', opacity: '1'});
    });
    $(element.id+'_popup').observe('mouseleave', function(event){
       // $(element.id+'_popup').hide();
    $(element.id+'_popup').addClassName('deactive');
    });
    
}

function closePopupbox(event) {
	var element = Event.element(event);
    $(element.id+'_popup').addClassName('deactive');
	//$(element.id+'_popup').hide();
}


function fadeEfect() {
    $$('.popupbox').each(function(s){
        if(s.hasClassName('deactive')) {
            s.fade({duration:0.3});
            s.removeClassName('deactive');
           }
       });
}