/**
 * ändert die inhalte der seite so, dass die überschriften als tabbed navigation dienen
 */
window.addEvent('domready', function() {

$('qn_international').addEvent('mouseenter', function() {
    showInternational();
});

$('qn_international').addEvent('mouseleave', function() {
    hideInternational();
});


if($('productMainContent')) {
	
    var headlines = $$('.productCustomHeadline');
    var content = $$('.productCustomContent');
    var right = $$('.rightProductContent');

    var newHeadlines = "";
    var newContent = "";
    var firstId;
    
    headlines.each(function(hl, i) {
        first = i == 0 ? " firstHeadline activeHeadline" : "";
        if(i == 0) {
             firstId = hl.getProperty('id');
        }
        last = i == headlines.length-1 ? " lastHeadline" : "";
        newHeadlines += '<a href="javascript:viewContent('+ i +', \''+hl.getProperty('id')+'\')" class="tabbedHeadline'+ first + last +'">'+ hl.getText() +'</a> ';
    });

    // CAG JR: we need a div around the headlines
    newHeadlines = '<div class="tabbedHeadlineBox">' + newHeadlines + '</div>';
    
    content.each(function(c, i) {
        newContent += '<div class="content';
        if(i != 0) {
            newContent += ' tabbedContent"';
        }
        newContent += '">'+ c.innerHTML +'</div>';
    });
        
    right.each(function(c, i) {
        if(c.hasClass(firstId)) {
            c.setStyle('display', 'block');
        } else {
            c.setStyle('display', 'none');
        }
    });
    
    var blocker = '<br style="clear:both" />';

    $('productMainContent').setHTML(newHeadlines + blocker + newContent);
   } 
});

function viewContent(id, pid) {

    var right = $$('.rightProductContent');
    right.each(function(c, i) {
        if(c.hasClass(pid)) {
            c.setStyle('display', 'block');
        } else {
            c.setStyle('display', 'none');
        }
    });

    var content = $$('.content');
    content.each(function(c, i) {
        if(id != i) {
            c.addClass('tabbedContent');
        } else {
            if(c.hasClass('tabbedContent'))
                c.removeClass('tabbedContent');
        }
    }); 

    var headlines = $$('.tabbedHeadline');
    headlines.each(function(hl, i) {
        if(id == i) {
            hl.addClass('activeHeadline');
        } else {
            if(hl.hasClass('activeHeadline'))
                hl.removeClass('activeHeadline');
        }
    });


}



function showInternational() {
    if($('international').getStyle('display') == 'none')
        showElement('international', 300, 0.9);
}

function hideInternational() {
    if($('international').getStyle('display') != 'none')
        hideElement('international');
}



/**
 * blendet ein Element weich ein
 *
 * @param   Element 
 */
function showElement(Element, Duration, Opacity) {
	if (! Duration)	Duration	= 300;
    if (!Opacity) Opactiy = 1;
	Element	= $(Element);
	if (Element && (Element.getStyle('display') == 'none')) {
		Element.setStyle('opacity', 0);
		Element.setStyle('display', 'block');
		Element.effect('opacity', {duration: Duration}).start(Opacity);
	}
}

/**
 * blendet ein Element weich aus
 *
 * @param   Element
 */
function hideElement(Element, Duration, Opacity) {
	Element	= $(Element);
	if (! Duration)	Duration	= 300;
    if ( !Opacity) Opacity = Element.getStyle('opacity');
	if (Element) {
		Element.setStyle('opacity', Opacity);    
		Element.effect('opacity', {duration: Duration}).start(0).chain(function() {
			Element.setStyle('display', 'none');
		});
	}
}