/**
 * **********************************************************************
 * **********************************************************************
 * Verbraucherzentrale Bundesverband: Website Behavior
 * contains:
 *      - Navigation
 *      - Tipps
 *      - Artikel: Bilder Gallerie
 *      - Link Verhalten
 *      - css behavior with enabled JS
 *
 * @author stefan kloiber, zero+ones
 * @date 2009-08
 *
 * @version 0.0.20
 *
 * @dependencies: jQuery 1.3.2
 *
 * @tested Firefox 3, IE 7
 * **********************************************************************
 * **********************************************************************
 */

/* define namespace */
var zo; // declares a global symbol
if (!zo) zo = {};
    else if (typeof zo != 'object')
        throw new Error('zo exists, but is not an object!');

/**
 * append some stylesheet to the header
 *
 * @attribute   (String)     file     url to the css file
 */
zo.css = {
    include: function(file) {
        document.write('<link rel="stylesheet" type="text/css" href="' +file+ '" />');
    }
};

/**
 * snippets
 * set with swf object
 */
zo.snippets = {
    clTips: function(duration) {
        jQuery('<div></div>')
            .attr('id', 'wndw-nfo')
            .insertAfter('div#wndw')
        ;
        var duration = duration || 0,
            show = jQuery.Event('show'),
            items = jQuery('div#cl-tps div#wndw img').not('span.rtng img'),
            pItems = jQuery('div#cl-tps div#wndw div'),
            dist = (jQuery(items[0]).width()+24),
            /** function fired if clicked on the prev button */
            prev = function(ev) {
                jQuery('div#cl-tps div.btn.prev a').unbind('click');
                jQuery('div#wndw').animate({left:"+=" +dist+ "px"}, duration);
                jQuery('div#wndw-nfo').delay(duration).fadeOut(0, function() {
                    jQuery('div#cl-tps div.btn.prev a').bind('click', prev);
                    jQuery('div#cl-tps div.wndw-brd').trigger('show', --cnt);
                });
            },
            /** function fired if clicked on the next button */
            next = function(ev) {
                jQuery('div#cl-tps div.btn.next a').unbind('click');
                jQuery('div#wndw').animate({left:"-=" +dist+ "px"}, duration);
                jQuery('div#wndw-nfo').delay(duration).fadeOut(0, function() {
                    jQuery('div#cl-tps div.btn.next a').bind('click', next);
                    jQuery('div#cl-tps div.wndw-brd').trigger('show', ++cnt);
                });
            }
            cnt = 0
        ;
        jQuery('div#wndw').css('width', (items.length * (jQuery(items[0]).width()+20) + jQuery('div#wndw').offset().left)+ 'px');
        /** create the buttons */
        jQuery('div#cl-tps')
            .append(jQuery('<div></div>')
                .addClass('btn next')
                .append(jQuery('<a></a>')
                    .attr({href: '#nx', title: 'weiter'})
                )
            )
            .append(jQuery('<div></div>')
                .addClass('btn prev')
                .append(jQuery('<a></a>')
                    .attr({href: '#pv', title: 'zurück'})
                )
            )
        ;
        /** show Event action */
        jQuery('div#cl-tps div.wndw-brd').bind('show', function(ev, pos) {
            jQuery('div#wndw-nfo')
                .html(jQuery(pItems[pos]).html())
                .hide()
                .fadeIn(0)
            ;
            if (pos === 0) {
                jQuery('div#cl-tps div.btn.prev')
                    .find('a')
                    .css({'background-position': '-4px -1010px', cursor:'default'})
                    .unbind('click')
                ;
            }
            if (pos === 1) {
                jQuery('div#cl-tps div.btn.prev')
                    .find('a')
                    .css({'background-position': '-4px -970px', cursor:'pointer'})
                    .bind('click', prev)
                ;
            }
            if (pos === (items.length - 2)) {
                jQuery('div#cl-tps div.btn.next')
                    .find('a')
                    .css({'background-position': '-974px -970px', cursor:'pointer'})
                    .bind('click', next)
                ;
            }
            if (pos === (items.length - 1)) {
                jQuery('div#cl-tps div.btn.next')
                    .find('a')
                    .css({'background-position': '-974px -1010px', cursor:'default'})
                    .unbind('click')
                ;
            }
        });
        jQuery('div#cl-tps div.btn.prev a').bind('click', prev);
        jQuery('div#cl-tps div.btn.next a').bind('click', next);
        jQuery('div#cl-tps div.wndw-brd').trigger('show', cnt);
        items.each(function(i) {
            jQuery(this).bind('click', function(ev) {
                if (i < cnt) {
                    jQuery('div#cl-tps div.btn.prev a').trigger('click');
                }
                else if (i > cnt) {
                    jQuery('div#cl-tps div.btn.next a').trigger('click');
                }
            });
            jQuery(this).bind('mouseover', function(ev) {
                jQuery(this).css('cursor', 'pointer');
            });
        });
    },
    toggleSize: function(tHeight) {
        jQuery('div#nearYou>div')
            .css('height', tHeight)
            .find('object, embed')
            .attr('height', tHeight)
        ;
    }
};

/**
 * link behavior
 * replaces the HTML 4 'target'-attribute
 *
 * @method      tab         open the link target in a new tab; replaces target=_blank
 */
zo.target = {
    tab: function(selector) {
        jQuery(selector).click(function(ev) {
            ev.preventDefault();
            window.open(jQuery(this).attr('href'));
        });
    },
    popup: function(selector) {
        jQuery(selector).click(function(ev) {
            ev.preventDefault();
            var options = "",
                windowName = "";
            switch(true) {
                case (jQuery(this).hasClass('co2rechner')):
                    windowName = "co2rechner";
                    options = "width=700,height=670,status=yes,resizable=yes";
                    break;
            }
            window.open(jQuery(this).attr('href'), windowName, options);
        });
    },
    buildTal: function() {
        var headline = jQuery('div#taf h3').text(),
            rtclHdg = jQuery('div.rtcl p.heading').clone(),
            rtclH1 = jQuery('div.rtcl h1').clone(),
            rtclHdl = jQuery('div.rtcl h3.hdl').clone(),
            errMsg = jQuery('div#taf p.error').clone(),
            form = jQuery('div#taf form')
                .clone()
                .find('div')
                .wrapAll('<div class="wrapper"></div>')
                .each(function(i) {
                    if (i === 0) jQuery(this).addClass('hl-left');
                    else jQuery(this).addClass('hl-right');
                })
                .end()
                .submit(function(ev) {
                    var recpField = jQuery(this).find('input#tafMlRecp'),
                        sendField = jQuery(this).find('input#tafMlSend')
                    ;
                    if ((!recpField.val().match(/^[\d\w!\#\$%&\'*+\-/=?\^_`{|}~]+(\.?([\d\w!\#\$%&\'*+\-/=?\^_`{|}~]+\.)*[\d\w!\#\$%&\'*+\-/=?\^_`{|}~]+)?\@(([a-zA-Z0-9]+-?)*[a-zA-Z0-9]+\.)+[a-zA-Z]{2,6}$/) || recpField.val() === "") ||
                        (!sendField.val().match(/^[\d\w!\#\$%&\'*+\-/=?\^_`{|}~]+(\.?([\d\w!\#\$%&\'*+\-/=?\^_`{|}~]+\.)*[\d\w!\#\$%&\'*+\-/=?\^_`{|}~]+)?\@(([a-zA-Z0-9]+-?)*[a-zA-Z0-9]+\.)+[a-zA-Z]{2,6}$/) || sendField.val() === ""))
                    {
                        if (!recpField.val().match(/^[\d\w!\#\$%&\'*+\-/=?\^_`{|}~]+(\.?([\d\w!\#\$%&\'*+\-/=?\^_`{|}~]+\.)*[\d\w!\#\$%&\'*+\-/=?\^_`{|}~]+)?\@(([a-zA-Z0-9]+-?)*[a-zA-Z0-9]+\.)+[a-zA-Z]{2,6}$/) || recpField.val() === "") {
                            recpField
                                .css({'border-color': '#cd0716'})
                                .animate({backgroundColor: '#f9d0d3'}, 500)
                                .animate({backgroundColor: '#fff'}, 500)
                            ;
                        } else {
                            recpField.css('border-color', '#444');
                        }
                        if (!sendField.val().match(/^[\d\w!\#\$%&\'*+\-/=?\^_`{|}~]+(\.?([\d\w!\#\$%&\'*+\-/=?\^_`{|}~]+\.)*[\d\w!\#\$%&\'*+\-/=?\^_`{|}~]+)?\@(([a-zA-Z0-9]+-?)*[a-zA-Z0-9]+\.)+[a-zA-Z]{2,6}$/) || sendField.val() === "") {
                            sendField
                                .css({'border-color': '#cd0716'})
                                .animate({backgroundColor: '#f9d0d3'}, 500)
                                .animate({backgroundColor: '#fff'}, 500)
                            ;
                        } else {
                            sendField.css('border-color', '#444');
                        }
                        return false;
                    } else {
                        recpField.css('border-color', '#444');
                        sendField.css('border-color', '#444');
                        return true;
                    }
                })
            ,
            content = jQuery('<div></div>').addClass('tsr blue')
        ;
        content
            .append(rtclHdg)
            .append(rtclH1)
            .append(rtclHdl)
            .append(form.prepend(errMsg))
        ;
        return content;
    },
    /**
     * create the lightbox
     *
     * @attribute   (Object)     content     lightbox content
     */
    openLightBox: function(content) {
        var cgSelect, cgSelectSubmit;
        // remove legacy layers
        jQuery('div.zoLightBoxBG, div#zoLightBox').remove();
        // create lightbox background
        jQuery('<div></div>')
            .addClass('zoLightBoxBG')
            .css({
                'position': 'absolute',
                'top': 0,
                'left': 0,
                'width': jQuery(document).width() +'px',
                'height': jQuery(document).height() +'px',
                'z-index': 99998,
                'background': '#004687',
                'opacity': 0.0})
            .bind('click', function(ev) {
                ev.stopPropagation();
                jQuery('div.zoLightBoxBG, div#zoLightBox').animate({opacity:0.0},400);
                setTimeout(function() { jQuery('div.zoLightBoxBG, div#zoLightBox').remove(); },500);
            })
            .animate({opacity:0.7},400)
            .appendTo(jQuery('body'));
        // create the lightbox and append the content
        jQuery('<div></div>')
            .attr('id', 'zoLightBox')
            .addClass('zoLightBoxContainer')
            .css({
                'position': 'absolute',
                'top': jQuery('div.inner').offset().top +'px',
                'left': jQuery('div.inner').offset().left +'px',
                'width': '42.25em',
                'z-index': 99999,
                'opacity': 0.0,
                'background': '#fff'})
            .append(jQuery('<div></div>')
                .addClass('zoLightBoxTitleBar')
                .append(jQuery('<h1></h1>').text('Seite empfehlen'))
            )
            .append(content)
            .animate({opacity:1.0}, 500)
            .draggable({
                containment: 'document',
                handle: 'div.zoLightBoxTitleBar'
            })
            .appendTo(jQuery('body'))
            .end()
            .find(':text:first').focus()
            .end()
        ;
        // ESC: escape key pressed quits the lightbox
        jQuery(document)
            .bind('keydown', function(ev) {
                if (ev.keyCode === 27) {
                    jQuery('div.zoLightBoxBG, div#zoLightBox').animate({opacity:0.0},400);
                    setTimeout(function() { jQuery('div.zoLightBoxBG, div#zoLightBox').remove(); },500);
                    jQuery(this).unbind('keydown');
                }
            })
        ;
        // create the cancel button and append it to the titlebar of the lightbox
        jQuery('<div></div>')
            .addClass('zoLightBoxCancelButton')
            .append(jQuery('<a></a>')
                .attr({
                    href: '#close',
                    title: 'Fenster schließen'
                })
                .addClass('close')
                .html('Fenster schließen')
                .bind('click', function(ev) {
                    ev.preventDefault();
                    jQuery('div.zoLightBoxBG, div#zoLightBox').animate({opacity:0.0},400);
                    setTimeout(function() { jQuery('div.zoLightBoxBG, div#zoLightBox').remove(); },500);
                    jQuery(document).unbind('keydown');
                })
            )
            .appendTo(jQuery('div#zoLightBox div.zoLightBoxTitleBar'));
    }
};
zo.toolbar = {
    print: function() {
        jQuery('li[id=print]')
            .append(jQuery('<a></a>')
                .attr({
                    title: 'Seite drucken',
                    href: '#print'
                })
                .addClass('print')
                .text('Seite drucken')
                .bind('click', function(ev) {
                    ev.preventDefault();
                    window.print();
                })
            )
        ;
    }
}
zo.form = {
    // default email address used as example for email address fill-ins
    defEmailAddr: "name@provider.com",
    // default search value used as example for search fields
    defSearch: "Suche",
    // clears the input field value if the default value is set
    clearFieldDef: function(selector, defVal) {
        if (jQuery(selector).val() === defVal) {
            jQuery(selector).val('');
        }
        jQuery(selector).blur(function(ev) {
            if (jQuery(selector).val() === "") {
                jQuery(selector).val(defVal);
            }
        });
    },
    validate: {
        // comments
        cmtForm: function() {
            jQuery('form#wrtCmt').submit(function(ev) {
                var nameField = jQuery('input#wrtCmtName'),
                    msgArea = jQuery('textarea#wrtCmtMsg')
                ;
                if (nameField.val() === "" || msgArea.val() === "") {
                    if (nameField.val() === "") {
                        nameField
                            .css({'border-color': '#cd0716'})
                            .animate({backgroundColor: '#f9d0d3'}, 500)
                            .animate({backgroundColor: '#fff'}, 500)
                        ;
                    } else {
                        nameField.css('border-color', '#444');
                    }
                    if (msgArea.val() === "") {
                        msgArea
                            .css({'border-color': '#cd0716'})
                            .animate({backgroundColor: '#f9d0d3'}, 500)
                            .animate({backgroundColor: '#fff'}, 500)
                        ;
                    } else {
                        msgArea.css('border-color', '#444');
                    }
                    return false;
                } else {
                    nameField.css('border-color', '#444');
                    msgArea.css('border-color', '#444');
                    return true;
                }
            });
        }
    }
};
zo.toggle = function() {
    jQuery('h3.link').each(function(k, v) {
        // display the box marked as shown
        if (jQuery(this).next().hasClass('shown') === true) {
            jQuery(this)
                .next()
                .removeClass('shown')
                .show()
                .append(
                    jQuery('<p></p>')
                        .addClass('cls')
                        .append(
                            jQuery('<a></a>')
                                .attr({title:'Schließen', href:'#close'})
                                .text('Zurücksetzen')
                                .bind('click', function(ev) {
                                    ev.preventDefault();
                                    jQuery(this).parent().closest('div.tg').prev('h3').trigger('click');
                                })
                        )
                )
            ;
        }
        jQuery(this)
            .addClass('js')
            // wrap the inner text with a link to provide the possibility to set the focus for users navigating through the page with the keyboard
            .wrapInner('<a href="' +location.href+ '" title="' +jQuery(this).text()+ '"></a>')
            .click(function(ev) {
                ev.preventDefault();
                jQuery(this)
                    .next()
                    // toggle visibility
                    .slideToggle(500,
                        // callback: change the icon
                        function() {
                            jQuery(this)
                                .prev()
                                .hasClass('closed')
                            ? jQuery(this)
                                .prev()
                                .removeClass('closed')
                                .addClass('open')
                            : jQuery(this)
                                .prev()
                                .removeClass('open')
                                .addClass('closed')
                            ;
                            // add an additional closing link at the end of the opened box
                            // link will not be added for article relatives on overview pages
                            if (jQuery(this).parent().hasClass('rtcl-rel') === false) {
                                jQuery(this)
                                    .find('p.cls')
                                    .remove()
                                    .end()
                                    .append(
                                        jQuery('<p></p>')
                                            .addClass('cls')
                                            .append(
                                                jQuery('<a></a>')
                                                    .attr({title:'Schließen', href:'#close'})
                                                    .text('Zurücksetzen')
                                                    .bind('click', function(ev) {
                                                        ev.preventDefault();
                                                        // trigger the click event on the headline
                                                        jQuery(this)
                                                            .parent()
                                                            .closest('div.tg')
                                                            .prev('h3')
                                                            .trigger('click')
                                                        ;
                                                    })
                                            )
                                    )
                                ;
                            }
                        }
                    )
                ;
            })
        ;
    });
};
zo.toggleRating = function() {
    jQuery('h3.toggleRating').each(function(k, v) {
        // display the box marked as shown
        if (jQuery(this).parent().next('div.rtng-tl').hasClass('shown') === true) {
            jQuery(this)
                .parent()
                .parent()
                .next('div.rtng-tl')
                .removeClass('shown')
                .show()
            ;
        }
        jQuery(this)
            // wrap the inner text with a link to provide the possibility to set the focus for users navigating through the page with the keyboard
            .wrapInner('<a href="' +location.href+ '#toggle" title="' +jQuery(this).text()+ '"></a>')
            .click(function(ev) {
                ev.preventDefault();
                jQuery(this)
                    .parent()
                    .parent()
                    .next('div.rtng-tl')
                    // toggle visibility
                    .slideToggle(500,
                        // callback: change the icon
                        function() {
                            jQuery(this)
                                .prev('div.mk-rtng')
                                .find('h3')
                                .hasClass('closed')
                            ? jQuery(this)
                                .prev('div.mk-rtng')
                                .find('h3')
                                .removeClass('closed')
                                .addClass('open')
                            : jQuery(this)
                                .prev('div.mk-rtng')
                                .find('h3')
                                .removeClass('open')
                                .addClass('closed')
                            ;
                        }
                    )
                ;
            })
        ;
    });
};
zo.slideshow = {
    init: function() {
        this.slides().each(function(i) {
            jQuery(this).attr('id', 'sld-' +i);
        });
        this.slidesWidth();
        //this.centerImage();
        this.buildControlPanel();
        this.buildButtons();
    },
    container: function() {
        return jQuery('div#sldshw');
    },
    slides: function() {
        return jQuery('div#sldshw div.sld');
    },
    slidesLength: function() {
        return this.slides().length;
    },
    slidesWidth: function() {
        jQuery('div#slds').css('width', this.slidesLength() * jQuery(this.slides()[0]).width());
    },
    centerImage: function() {
        var contHeight = this.slides().find('div.img').height(),
            marginTop = 0;
        jQuery(this.slides())
            .find('div.img img')
            .each(function(i) {
                if (jQuery(this).height() !== 0
                    && jQuery(this).height() < contHeight)
                {
                    marginTop = (contHeight - jQuery(this).height())/2;
                    jQuery(this).css({
                        position: 'absolute',
                        'top': marginTop+ 'px'
                    });
                }
            })
        ;
    },
    buildControlPanel: function() {
        var controlPanel = jQuery('<ul></ul>').addClass('cp');
        jQuery(this.slides()).each(function(i) {
            i += 1;
            controlPanel
                .append(jQuery('<li></li>')
                    .append(jQuery('<a></a>')
                        .attr({
                            'title': jQuery(this).find('img').attr('alt'),
                            'href': '#' +jQuery(this).attr('id'),
                            'class': ((i === 1) ? 'active' : '')
                        })
                        .addClass(jQuery(this).attr('id'))
                        .text(i)
                        .bind('click', function(ev) {
                            ev.preventDefault();
                            zo.slideshow.slide(this, ev);
                            var attrId = jQuery(ev.target).attr('href');
                            // prev button
                            if (typeof jQuery('div' +attrId).prev().attr('id') !== 'undefined') {
                                jQuery('div#sldshw div.buttonPrev a').attr('href', '#' +jQuery('div' +attrId).prev().attr('id'));
                            } else {
                                jQuery('div#sldshw div.buttonPrev a').attr('href', '#' +jQuery(zo.slideshow.slides()[zo.slideshow.slidesLength()-1]).attr('id'));
                            }
                            // next button
                            if (typeof jQuery('div' +attrId).next().attr('id') !== 'undefined') {
                                jQuery('div#sldshw div.buttonNext a').attr('href', '#' +jQuery('div' +attrId).next().attr('id'));
                            } else {
                                jQuery('div#sldshw div.buttonNext a').attr('href', '#' +jQuery(zo.slideshow.slides()[0]).attr('id'));
                            }
                            jQuery('div#sldshw ul.cp li a')
                                .removeClass('active')
                                .filter('a.' +attrId.substr(1))
                                .addClass('active')
                            ;
                        })
                    )
                )
            ;
        });
        if (controlPanel.find('li').length > 1) {
            this.container().append(controlPanel);
        }
    },
    buildButtons: function() {
        var active = jQuery(this.slides()[0]),
            prev = jQuery(this.slides()[this.slidesLength()-1]),
            next = active.next();
        this.container()
            .append(jQuery('<div></div>').addClass('buttonPrev')
                .append(jQuery('<a></a>')
                    .attr({
                        title:'Zurück',
                        href:'#' +prev.attr('id')
                    })
                    .bind('click', function(ev) {
                        ev.preventDefault();
                        zo.slideshow.slide(this, ev);
                        var attrId = jQuery(ev.target).attr('href');
                        // prev button
                        if (typeof jQuery('div' +attrId).prev().attr('id') !== 'undefined') {
                            jQuery(ev.target).attr('href', '#' +jQuery('div' +jQuery(ev.target).attr('href')).prev().attr('id'));
                        } else {
                            jQuery(ev.target).attr('href', '#' +jQuery(zo.slideshow.slides()[zo.slideshow.slidesLength()-1]).attr('id'));
                        }
                        // next button
                        if (typeof jQuery('div' +attrId).next().attr('id') !== 'undefined') {
                            jQuery('div#sldshw div.buttonNext a').attr('href', '#' +jQuery('div' +attrId).next().attr('id'));
                        } else {
                            jQuery('div#sldshw div.buttonNext a').attr('href', '#' +jQuery(zo.slideshow.slides()[0]).attr('id'));
                        }
                        jQuery('div#sldshw ul.cp li a')
                            .removeClass('active')
                            .filter('a.' +attrId.substr(1))
                            .addClass('active')
                        ;
                    })
                )
            )
            .append(jQuery('<div></div>').addClass('buttonNext')
                .append(jQuery('<a></a>')
                    .attr({
                        title:'Weiter',
                        href:'#' +next.attr('id')
                    })
                    .bind('click', function(ev) {
                        ev.preventDefault();
                        zo.slideshow.slide(this, ev);
                        var attrId = jQuery(ev.target).attr('href');
                        // next button
                        if (typeof jQuery('div' +attrId).next().attr('id') !== 'undefined') {
                            jQuery(ev.target).attr('href', '#' +jQuery('div' +attrId).next().attr('id'));
                        } else {
                            jQuery(ev.target).attr('href', '#' +jQuery(zo.slideshow.slides()[0]).attr('id'));
                        }
                        // prev button
                        if (typeof jQuery('div' +attrId).prev().attr('id') !== 'undefined') {
                            jQuery('div#sldshw div.buttonPrev a').attr('href', '#' +jQuery('div' +attrId).prev().attr('id'));
                        } else {
                            jQuery('div#sldshw div.buttonPrev a').attr('href', '#' +jQuery(zo.slideshow.slides()[zo.slideshow.slidesLength()-1]).attr('id'));
                        }
                        jQuery('div#sldshw ul.cp li a')
                            .removeClass('active')
                            .filter('a.' +attrId.substr(1))
                            .addClass('active')
                        ;
                    })
                )
            )
        ;
    },
    slide: function(targetObj, ev) {
        var chSlide = jQuery(targetObj).attr('href'),
            chPos = jQuery('div' +chSlide).position().left,
            duration = 700;
        jQuery('div#slds').animate({left:'-' +chPos+ 'px'}, duration);
    }
};
zo.imageMap = {
    toggleItems: function(selector) {
        var overlay = jQuery('div#map div.overlay');
        overlay.css({'background-image': 'url(' +jQuery('div#map img.overlay').attr('src')+ ')'});
        jQuery(selector)
            .children()
            .hover(
                // hover
                function() {
                    overlay.addClass(jQuery(this).attr('id'));
                    if (jQuery(this).attr('id').indexOf('map-') > -1) {
                        var link = 'link' +jQuery(this).attr('id').substring(jQuery(this).attr('id').indexOf('-'), jQuery(this).attr('id').length);
                        jQuery('li#' +link+ ' a').css('text-decoration', 'underline');
                    } else {
                        jQuery(this).find('a').css('text-decoration', 'underline');
                    }
                },
                // out
                function() {
                    overlay.removeClass(jQuery(this).attr('id'));
                    if (jQuery(this).attr('id').indexOf('map-') > -1) {
                        var link = 'link' +jQuery(this).attr('id').substring(jQuery(this).attr('id').indexOf('-'), jQuery(this).attr('id').length);
                        jQuery('li#' +link+ ' a').css('text-decoration', 'none');
                    } else {
                        jQuery(this).find('a').css('text-decoration', 'none');
                    }
                }
            )
        ;
    }
};

zo.lexicon = {
    init: function() {
        var jumpTarget = location.hash.substring(1);
        // if no hash is set display the first item content
        if (jumpTarget === "") {
            setTimeout(function() { jQuery('div#dct h3.link:first').trigger('click') }, 100);
        }
        else {
            setTimeout(function() { jQuery('a[name=' +jumpTarget+ ']').next('h3.link').trigger('click') }, 100);
        }
    }
};

zo.gallery = {
    init: function() {
        this.buildControlPanel();
        this.article();
    },
    buildControlPanel: function() {
        var cnt = jQuery('div.rtcl-gl'),
            controlPanel = jQuery('<ul></ul>').addClass('pgn');
        cnt.find('img').each(function(i) {
            i += 1;
            jQuery(this)
                .attr('id', 'gl-' +i)
                .addClass('gl-' +i)
                .next('p')
                .addClass('gl-' +i)
            ;
            controlPanel
                .append(jQuery('<li></li>')
                    .append(jQuery('<a></a>')
                        .attr({
                            title: jQuery(this).attr('alt'),
                            href: '#' +jQuery(this).attr('id')
                        })
                        .text(i)
                    )
                )
            ;
            if (i === 1) {
                jQuery('a', controlPanel).addClass('active');
            }
        });
        if (controlPanel.find('li').length > 1) {
            cnt.append(controlPanel);
        }
    },
    article: function() {
        jQuery('div.rtcl-gl ul.pgn li a').click(function(ev) {
            ev.preventDefault();
            try {
                if (jQuery(this).hasClass('active') === false) {
                    var currentId = jQuery('div.rtcl-gl>img').attr('id'),
                        currentSrc = jQuery('div.rtcl-gl>img').attr('src'),
                        currentAlt = jQuery('div.rtcl-gl>img').attr('alt'),
                        currentText = jQuery('div.rtcl-gl>p').html(),
                        changeLink = jQuery(this).attr('href'),
                        changeId = changeLink.substring(changeLink.indexOf('#')+1, changeLink.length),
                        changeSrc = jQuery('div.rtcl-gl img.' +changeId).attr('src'),
                        changeAlt = jQuery('div.rtcl-gl img.' +changeId).attr('alt'),
                        changeText = jQuery('div.rtcl-gl p.' +changeId).html();
                    jQuery('div.rtcl-gl')
                        .find('>img')
                        .attr({'src':changeSrc, 'alt':changeAlt, 'id':changeId, 'class':changeId})
                        .end()
                        .find('>p')
                        .html(changeText)
                        .removeClass(currentId)
                        .addClass(changeId)
                        .end()
                        .find('ul.pgn a')
                        .removeClass('active')
                    ;
                    jQuery('div.rtcl-gl div.strg')
                        .find('img.' +changeId)
                        .attr({'src':currentSrc, 'id':currentId, 'class':currentId})
                        .end()
                        .find('p.' +changeId)
                        .removeClass(changeId)
                        .addClass(currentId)
                        .html(currentText)
                    ;
                    jQuery(this).addClass('active');
                }
            } catch(e) {}
        });
    }
};
zo.peDropDown = {
    init: function(navJSON) {
        this.getNav('div#level1Navi ul', {file:navJSON, delay:500}, function() { zo.peDropDown.navi.slideDown(); });
    },
    getNav: function(navId, optMap, callback) {
        // load the JSON data
        jQuery.getJSON(optMap.file, function(data, textStatus) {
            if (textStatus === 'success') {
                // wait till the dom is ready
                jQuery(document).ready(function() {
                    // get the active navigation items
                    var actNav = jQuery(navId+ ' a.active'),
                        // render the whole navigation tree with the JSON data
                        fullNav = zo.peDropDown.buildNav(data);
                    // walk through the active nav items and mark the equivalent item in the whole nav tree
                    actNav.each(function(i) {
                        fullNav
                            .find('a[id="' +jQuery(actNav[i]).attr('id')+ '"]')
                            .addClass('active')
                            .closest('li')
                            .addClass('activeLi')
                        ;
                    });
                    // replace the static navigation with the rendered nav
                    jQuery(navId).replaceWith(fullNav);
                    // dispatch the dropdown ability
                    callback();
                });
            }
        });
    },
    /**
     * render the navigation from a json structure
     *
     * @attribute   (Object)     data       the navigation array
     * @attribute   (String)     depth      navigation level, default "1"
     * @attribute   (Number)     z          numerical navigation level, default 0
     */
    buildNav: function(data, depth, z) {
        var tmpUl, tmpLi,
            depth = depth || "1",
            z = z || 0,
            rdDepth = 2; // render depth
        $.each(data, function(i) {
            if(typeof data[i].id !== "undefined") {
                // create the list container
                if (i === 0) {
                    tmpUl = jQuery('<ul></ul>').addClass('level' +depth);
                }
                // create the list item
                tmpLi = jQuery('<li></li>')
                    .addClass(data[i].li_class)
                    .append(jQuery('<a></a>')
                        .attr({
                            href: data[i].href,
                            id: data[i].id
                        })
                        .html(data[i].headline)
                        .attr('title', function() { return jQuery(this).text(); })
                    )
                ;
                // got children?
                if (typeof data[i].nav === 'object' && data[i].nav.length > 0 && z < rdDepth) {
                    // raise depth
                    depth += "_1";
                    z++;
                    // recursive call
                    tmpLi.append(zo.peDropDown.buildNav(data[i].nav, depth, z));
                    // change depth back
                    depth = depth.substring(0, depth.length-2);
                    z--;
                }
                // mount list items
                tmpUl.append(tmpLi);
            }
        });
        return tmpUl;
    },
    /**
     * drop down ability
     *
     */
    elem: "",
    zindex: 100,
    increaseZIndex: function() {
        zo.peDropDown.zindex++;
        return zo.peDropDown.zindex;
    },
    decreaseZIndex: function() {
        zo.peDropDown.zindex--;
        return zo.peDropDown.zindex;
    },
    navi: {
        slideDown: function() {
            var focused;
            jQuery('*').bind('focus', function(ev) {
                focused = ev.target;
            });
            // handle the navigation with the keyboard
            jQuery('div#level1Navi ul a')
                .bind('focus', function(ev) {
                    if (jQuery(this).closest('ul').hasClass('level1_1')) {
                        var posLeft = parseInt(jQuery(this).closest('li').offset().left - jQuery('div#level1Navi ul').offset().left - 10, 10);
                        jQuery(this)
                            .closest('li')
                            .find('>ul')
                            .css({
                                left:posLeft,
                                'z-index':100
                            })
                            .show()
                        ;
                    } else {
                        jQuery(this)
                            .closest('li')
                            .find('>ul')
                            .css({'z-index':100})
                            .show()
                        ;
                    }
                })
                .bind('blur', function(ev) {
                    // start new thread through setTimeout call
                    setTimeout(function() {
                        // from third level to second level
                        if ((jQuery(focused).closest('ul').attr('class') == "level1_1"
                            && jQuery(ev.target).closest('ul').attr('class') == "level1_1_1")
                            && jQuery.inArray(ev.target, jQuery(focused).closest('li').find('ul').find('a')) == -1)
                        {
                            jQuery(ev.target)
                                .closest('ul')
                                .closest('li')
                                .find('>ul')
                                .hide()
                            ;
                        }
                        // jump back from second level to second level or from second level to first level
                        else if ((jQuery(focused).closest('ul').attr('class') == "level1_1"
                            && jQuery(ev.target).closest('ul').attr('class') == "level1_1")
                            || (jQuery(focused).closest('ul').attr('class') == "level1"
                            && jQuery(ev.target).closest('ul').attr('class') == "level1_1"))
                        {
                            jQuery(ev.target)
                                .closest('li')
                                .find('>ul')
                                .hide()
                            ;
                        }
                        // jump from last third level to next first level
                        else if (jQuery(focused).closest('ul').attr('class') == "level1"
                            && jQuery(ev.target).closest('ul').attr('class') == "level1_1_1")
                        {
                            jQuery(ev.target)
                                .parents('ul.level1_1')
                                .find('li>ul')
                                .hide()
                            ;
                            jQuery(focused)
                                .closest('li')
                                .prev()
                                .find('>ul')
                                .hide()
                            ;
                        }
                        // jump back from first level to first level
                        else if (jQuery(focused).closest('ul').attr('class') == "level1"
                            && jQuery(ev.target).closest('ul').attr('class') == "level1")
                        {
                            jQuery(focused)
                                .find('li>ul')
                                .show()
                                .end()
                                .closest('li')
                                .next()
                                .find('>ul')
                                .hide()
                            ;
                        }
                        // jumping out the navigation box
                        else if (jQuery.inArray(focused, jQuery('div#level1Navi ul').find('a')) == -1) {
                            jQuery('div#level1Navi ul li>ul')
                                .hide()
                            ;
                        }
                    }, 0);
                })
            ;
            // handle the navigation with the mouse
            var duration = {slideDown:500, slideDownTimeout:500, slideUp:500, slideUpTimeout:500};
            jQuery('div#level1Navi li').hover(
                // mouseover action
                function() {
                    // save the event target (this) to a variable to use it in another scope (in this case inside the setTimeout method)
                    var self = jQuery(this),
                        zindex, posLeft;
                    // proceed if the event target is not the current active element or lays not in the third navigation level
                    if (self.hasClass('activeLi') === false || self.parent().hasClass('level1_1')) {
                        // increase z-index
                        zindex = zo.peDropDown.increaseZIndex();
                        // first navigation level
                        if (self.closest('ul').hasClass('level1'))
                        {
                            jQuery(document).bind('mouseover', function(ev) {
                                zo.peDropDown.elem = ev.target;
                            });
                            // use a delay to avoid direct changes in the second level
                            setTimeout(function() {
                                // change the navigation only if the mouse is still over the same navigation element
                                if (jQuery(zo.peDropDown.elem).closest('li')[0] === self[0]) {
                                    self
                                        .find('>ul')
                                        .css({'z-index':zindex})
                                        .slideDown(duration.slideDown);
                                }
                                jQuery(document).unbind('mouseover');
                            },duration.slideDownTimeout);
                        }
                        // second navigation level
                        // show the third navigation level (drop down) without any delay
                        else
                        {
                            var posLeft = parseInt(self.offset().left - jQuery('div#level1Navi ul').offset().left - 10, 10);
                            self
                                .find('>ul')
                                .css({
                                    left:posLeft,
                                    'z-index':zindex
                                })
                                .slideDown(0)
                            ;
                        }
                    }
                },
                // mouseout action
                function() {
                    // save the event target (this) to a variable to use it in another scope (in this case inside the setTimeout method)
                    var self = jQuery(this);
                    if (self.hasClass('activeLi') === false || self.parent().hasClass('level1_1')) {
                        // first navigation level
                        if (self.closest('ul').hasClass('level1')) {
                            jQuery(document).bind('mouseover', function(ev) {
                                zo.peDropDown.elem = ev.target;
                            });
                            // use a delay to avoid direct changes in the second level
                            setTimeout(function() {
                                // hide the second navigation layer in case of not equal and in first level or if the mouse position is not inside the navigation element
                                if ((jQuery(zo.peDropDown.elem).closest('li')[0] !== self[0] && jQuery(zo.peDropDown.elem).closest('ul').hasClass('level1'))
                                    || (jQuery(zo.peDropDown.elem).parents('div#level1Navi').length < 1))
                                {
                                    self
                                        .find('>ul')
                                        .animate({opacity:1.0},duration.slideUp)
                                        .slideUp(duration.slideUp)
                                        .animate({opacity:1.0},0);
                                }
                                jQuery(document).unbind('mouseover');
                            },duration.slideUpTimeout);
                        }
                        // second navigation level
                        else
                        {
                            self
                                .find('>ul')
                                .slideUp(0);
                        }
                    }
                }
            );
        }
    }
};

/**
 * toggle the visibility of the meta navigation
 *
 */
zo.toggleMeta = {
    slideUp: function() {
        var pTop = jQuery('#vzbv-logo').offset().top - jQuery('div#metaNavi').offset().top,
            pLeft = jQuery('#vzbv-logo').offset().left - jQuery('div#metaNavi').offset().left
        ;
        jQuery('#vzbv-logo')
            .find('img')
            .clone()
            .attr({
                'alt': '',
                'id': 'vzbv-logo-clone'
            })
            .css({
                'position': 'absolute',
                'top': pTop,
                'left': pLeft
            })
            .appendTo('div#headerArea')
        ;
        jQuery('div#metaNavi').slideUp(1000);
    },
    slideDown: function() {
        jQuery('div#metaNavi').slideDown(1000, function() {
            jQuery('img#vzbv-logo-clone').remove();
        });
    }
};
/**
 * visual rating tool
 * this method creates the hover effect for the rating line
 *
 */
jQuery.fn.rating = function() {
    jQuery(this)
        .find('a')
        .hover(
            // over
            function() {
                // activate this and all previous items
                jQuery(this)
                    .find('img')
                    .attr('src', '')
                    .parent()
                    .prevAll('a')
                    .find('img')
                    .attr('src', '')
                ;
            },
            // out
            function() {
                // deactivate all
                jQuery(this)
                    .parent()
                    .siblings('a')
                    .andSelf()
                    .find('img')
                    .attr('src', '')
                ;
            }
        )
    ;
    return this;
};
/**
 * zebra stripes
 * this method extends jQuery to make chaining possible
 *
 * @attribute   (Object)     even     map with the css properties for all even elements
 * @attribute   (Object)     odd      map with the css properties for all odd elements
 */
jQuery.fn.zebraStripes = function(even, odd) {
    jQuery(this)
        .filter(':even')
        .css(even)
        .end()
        .filter(':odd')
        .css(odd)
    ;
    return this;
};
jQuery.fn.markLinksInRnText = function() {
    if (navigator.userAgent.indexOf('MSIE') > -1) {
        jQuery(this).each(function(i) {
            var anchor = jQuery(this),
                aText = anchor.text().split(' '),
                aClass = anchor.attr('class'),
                aFirstWord = aText.shift(),
                aOffcut = aText.join(' '),
                aTarget = jQuery.trim(aClass.replace(/rntxt/, ''));
            anchor
                .removeClass('rntxt')
                .html(jQuery('<span></span>')
                    .addClass(aTarget)
                    .text(aFirstWord)
                )
                .append(' ' +aOffcut)
            ;
        });
    }
    return this;
};
/** init level1 navigation */
zo.peDropDown.init('/cps/rde/xchg/projektklima/hs.xsl/naviJSON_V2.js');
/** include extra stylesheet */
zo.css.include('/cps/rde/xchg/projektklima/hs.xsl/behavior.css');
/** things to do when the dom is ready */
jQuery(document).ready(function()
{
    /** include extra stylesheet for meta pages */
    if (jQuery('div#level1Navi ul li.activeLi').length === 0) {
        jQuery('div#breadcrumbNavi').css('margin', '0.5em 0 1em');
    }
    zo.target.tab('a.extern, a.extrn, a.pdf, div#vzbv-foot a');
    zo.target.popup('a.popup');
    zo.toggle();
    // klimalexikon
    if (jQuery('div#dct').length) zo.lexicon.init();
    // widget: artikel fotostrecke
    if (jQuery('div.rtcl-gl').length) zo.gallery.init();
    // widget: fotostrecke
    if (jQuery('div#sldshw').length) zo.slideshow.init();
    jQuery('a[href=#taf]').click(function(ev) {
        ev.preventDefault();
        var lbContent = zo.target.buildTal();
        zo.target.openLightBox(lbContent);
    });
    if (jQuery('div#taf p.error').length) {
        jQuery('a[href=#taf]').trigger('click');
    }
    if (jQuery('li[id=print]').length) {
        zo.toolbar.print();
    }
    // widget: klimatipps
    if (jQuery('div#cl-tps').length) zo.snippets.clTips(700);
    // widget: image map
    if (jQuery('div#map').length) {
        zo.imageMap.toggleItems('map#img-map');
        zo.imageMap.toggleItems('ul#stt');
    }
    // rating tool
    jQuery('div.rtng-tl').rating();
    zo.toggleRating();
    // clearing the search fields default value
    if (jQuery('input#search_textfield').length) {
        jQuery('input#search_textfield').focus(function(ev) {
            zo.form.clearFieldDef(jQuery(this), zo.form.defSearch);
        });
    }
    // hack for background-images in inline elemtens
    jQuery('a.rntxt').markLinksInRnText();
    // form validation
    // comments
    if (jQuery('form#wrtCmt').length) zo.form.validate.cmtForm();
    jQuery('div.rd div.cmt')
        .css({padding:'10px'})
        .zebraStripes({'background-color':'#f9f9f9'}, {'background-color':'#f1f1f1'})
    ;
});