
var Site = {


    init: function(){
    
        Site.myScroller;
        Site.isActive = false;
        if ($('outer_border')) 
            $('outer_border').setStyle('opacity', .1);
        
        if ($('rightColumnContent')) {
            Site.startEffect();
        }
        if ($('footer')) 
            Site.setMenu($$('#footer li a'));
        if ($$('div#mainContent a.link_with_plus')) 
            Site.setMenu($$('div#mainContent a.link_with_plus'));
		
		if($$('p.basket a'))
			Site.ajaxOtherLinks($$('p.basket a'));
    },
    
    ajaxOtherLinks: function(otherLinks){
        otherLinks.each(function(otherLink, i){

			otherLink.addEvent('click', function(e){
                
				var e = new Event(e);
                e.stop();
                curLink = otherLink;
                Site.getContent(curLink);                
            });
        })
    },
    
    getContent: function(link){
        
		$('basket').empty();
        new Ajax(link, {
            method: 'GET',
			update: $('basket'),
			onComplete: Site.showResponse
        }).request()
        /*
         * 	onFailure: '',
         onComplete: Site.showResponse
         *
         */
    },
    
	showResponse: function(request) {
		
	},
	
    mooScroller: function(){
        /*Site.myScroller = new MooScroller($E('div.scroller div.contentScroller'), $E('div.scroller .scrollKnob'), {
         mode: 'vertical'
         });*/
    },
    
    updateScroller: function(){
        //alert(Site.myScroller);
        //Site.myScroller.update();
        Site.isActive = false;
    },
    
    
    /*
     *
     *
     */
    setProjectAccordion: function(){
        if ($$('div.tx-sschproject-pi1')) {
            var list = $$('div.tx-sschproject-pi1 dl dd');
            var headings = $$('div.tx-sschproject-pi1 dl dt');
            var images = $$('div.tx-sschproject-pi1 div.dataWrapper p.image');
            
            var header = $('header');
            var defaultImage = header.innerHTML;
            
            var collapsibles = new Array();
            var imagesArray = new Array();
            var selectedId;
            var settings = new Array();
            
            
            images.each(function(image, i){
                imagesArray[i] = image.innerHTML;
                image.setStyle('display', 'none');
            });
            
            headings.each(function(heading, i){
            
                var collapsible = new Fx.Slide(list[i], {
                    duration: 500,
                    transition: Fx.Transitions.quadIn
                });
                
                collapsibles[i] = collapsible;
                headings[i].open = false;
                heading.addEvent('click', function(event){
                    e = new Event(event);
                    e.stop();
                    
                    if (!Site.isActive) {
                        Site.isActive = true;
                        for (var j = 0; j < collapsibles.length; j++) {
                            if (j != i) {
                                collapsibles[j].slideOut();
                                headings[j].open = false;
                            }
                            else {
                                if (headings[i].open == false) {
                                    headings[i].open = true;
                                    Site.changeImage(imagesArray[i]);
                                }
                                else {
                                    headings[i].open = false;
                                    
                                    
                                    Site.changeImage(defaultImage);
                                    
                                }
                            }
                            
                            
                        }
                        collapsible.toggle();
                        
                    }
                    
                });
                
                
                collapsible.hide();
                
                
            });
        }
        if ($('mainContent')) 
            Site.mooScroller();
    },
    
    
    /*
     *
     *
     */
    changeImage: function(image){
        var headerHolder = $('header');
        var parentWidth = headerHolder.getStyle('width').toInt();
        var durationTime = 1000;
        
        if ($('imageHolder')) {
            //SET THE EFFECT FOR THE IMAGE-HOLDER
            var myEffect = new Fx.Styles($('imageHolder'), {
                duration: durationTime,
                transition: Fx.Transitions.Quad.easeOut,
                wait: false
            });
            
            //START THE EFFECT FOR THE IMAGE-HOLDER
            myEffect.start({
                'opacity': 0,
                'left': -450
            }).chain(function(){
                Site.changeImageNow(image, durationTime, $('imageHolder'), parentWidth);
            });
        }
        else {
            var imageHolder = new Element('div', {
                id: 'imageHolder'
            });
            imageHolder.setStyle('position', 'relative');
            imageHolder.setStyle('left', -parentWidth);
            imageHolder.setStyle
            headerHolder.empty();
            imageHolder.setHTML(image);
            imageHolder.injectInside(headerHolder);
            Site.changeImageNow(image, durationTime, imageHolder, parentWidth);
        }
        
        
        
        
    },
    
    /*
     *
     *
     */
    changeImageNow: function(image, durationTime, imageHolder, parentWidth){
        imageHolder.empty();
        imageHolder.setHTML(image);
        //SET THE EFFECT FOR THE IMAGE-HOLDER
        var myEffect = new Fx.Styles(imageHolder, {
            duration: durationTime,
            transition: Fx.Transitions.Quad.easeOut,
            wait: false
        });
        
        //START THE EFFECT FOR THE IMAGE-HOLDER
        
        myEffect.start({
            'opacity': 1,
            'width': parentWidth,
            'left': 0
        }).chain(function(){
            Site.updateScroller();
        });
        
    },
    
    
    /*
     *
     */
    setMenu: function(menuItems){
        //var menuItems = $$('#footer li a');
        menuItems.each(function(el, i){
            Site.createClick(el, i);
        }, this);
    },
    
    /*
     *
     */
    createClick: function(el, i){
        el.addEvent('click', function(event){
            e = new Event(event);
            e.stop();
            Site.hideMainContent(el);
            
            
        });
    },
    
    /*
     * This functions hides the mainContent and load the clicked Link
     */
    hideMainContent: function(el){
    
        //GET THE CONTENT-HOLDER
        var contentHolder = $('rightColumnContent');
        
        //GET THE MAIN CONTENT-HOLDER
        var mainContentHolder = $('mainContent');
        mainContentHolder.setStyle('overflow', 'hidden');
        
        //hide all Object-Elements first
        Site.hideObjects();
        
        
        //TIMER AND DURATION (TIME OF THE EFFECT)
        var timer = 100;
        var durationTime = 300;
        
        //GET THE VERY INITIAL PROPERTIES OF THE CONTENT HOLDER
        var initWidth = contentHolder.getStyle('width').toInt();
        
        var setLeft = (initWidth / 2);
        //alert(setLeft);
        //SET THE EFFECT FOR THE CONTENT-HOLDER
        var myEffect = new Fx.Styles(contentHolder, {
            duration: durationTime,
            transition: Fx.Transitions.Quad.easeOut,
            wait: false
        });
        
        //START THE EFFECT FOR THE CONTENT-HOLDER		
        myEffect.start({
            'width': 0,
            'left': setLeft,
            'opacity': 0
        }).chain(function(){
            Site.goToLink(el);
        });
        
        
    },
    
    
    hideObjects: function(){
        //hide all Object elements
        var allObjects = document.getElementsByTagName('object');
        
        if (allObjects) {
            var lengthOfObjects = allObjects.length;
            for (var i = 0; i < lengthOfObjects; i++) {
                var myObject = allObjects[i];
                myObject.setStyle('visibility', 'hidden');
            }
        }
    },
    /*
     *
     *
     */
    goToLink: function(el){
        link = el.href;
        document.location = link;
    },
    
    /*
     * This function initalizes the effect of the beginning, when the page is loaded.
     *
     * return void
     */
    startEffect: function(){
        //GET THE MAIN CONTENT-HOLDER
        var mainContentHolder = $('mainContent');
        mainContentHolder.setStyle('overflow', 'hidden');
        
        
        //GET THE CONTENT-HOLDER
        var contentHolder = $('rightColumnContent');
        
        //GET THE VERY INITIAL PROPERTIES OF THE CONTENT HOLDER
        var initWidth = window.getWidth();
        var initHeight = contentHolder.getStyle('height').toInt();
        var initTop = contentHolder.getStyle('top').toInt();
        var initLeft = contentHolder.getStyle('left').toInt();
        
        //TIMER AND DURATION (TIME OF THE EFFECT)
        var timer = 100;
        var durationTime = 500;
        
        //TO CENTER THE SCALE EFFECT, WE HAVE TO 
        var setTop = (initTop + (initHeight / 3));
        var setLeft = (initWidth / 2);
        
        //SET THE INITIAL PROPERTIES OF THE CONTENT HOLDER
        contentHolder.setStyle('width', 0);
        contentHolder.setStyle('opacity', 0);
        contentHolder.setStyle('left', setLeft);
        contentHolder.setStyle('display', 'block');
        
        //GET THE MENU HOLDER
        var menu = $('footer');
        
        if (Site.getCookie()) {
        }
        else {
            var cookie = false;
            menu.setStyle('top', -50);
        }
        
        //GET THE MAINCONTENT-HOLDER
        var mainContent = $('mainContent');
        
        //SET THE INITIAL PROPERTIES OF THE MAINCONTENT-HOLDER
        mainContent.setStyle('opacity', 0);
        
        //SET THE EFFECT FOR THE CONTENT-HOLDER
        var myEffect = new Fx.Styles(contentHolder, {
            duration: durationTime,
            transition: Fx.Transitions.Quad.easeOut,
            wait: false,
            onComplete: Site.showMainContent.pass([mainContent, timer, durationTime, cookie])
        });
        
        //START THE EFFECT FOR THE CONTENT-HOLDER
        myEffect.start({
            'width': initWidth,
            'left': initLeft,
            'opacity': 0.9
        });
    },
    
    /*
     * This function controls the effect for the menu
     *
     * @param {Object} el - The Element
     * @param {Object} timer - the Timer for the delay
     * @param {Object} durationTime - How long does the effect take
     */
    showMenu: function(el, timer, durationTime, cookie){
        if (el) {
            var myEffect = new Fx.Styles(el, {
                duration: durationTime,
                transition: Fx.Transitions.Quad.easeOut,
                wait: false
            
            });
            
            myEffect.start({
                'top': 0
            }).chain(function(){
                Site.setProjectAccordion()
            });
        }
        
    },
    
    /*
     * This function controls the effect for the contentHolder
     *
     * @param {Object} el - The Element
     * @param {Object} timer - the Timer for the delay
     * @param {Object} durationTime - How long does the effect take
     */
    showMainContent: function(el, timer, durationTime, cookie){
        if (el) {
            var menu = $('footer');
            var myEffect = new Fx.Styles(el, {
                duration: durationTime,
                transition: Fx.Transitions.Quad.easeOut,
                wait: false,
                onComplete: Site.showMenu.pass([menu, timer, durationTime, cookie])
            });
            myEffect.start({
                'opacity': 1
            }).chain(function(){
                //GET THE MAIN CONTENT-HOLDER
                var mainContentHolder = $('mainContent');
                mainContentHolder.setStyle('overflow', 'auto');
            });
        }
        
    },
    
    /*
     * Get cookie Information
     *
     * return true or false
     */
    getCookie: function(){
        var HashCookie;
        HashCookie = new Hash.Cookie('i_was_here');
        
        if (HashCookie.get('here')) {
            return true;
        }
        else {
            HashCookie.set('here', true);
            return false;
        }
    }
};

window.addEvent('resize',function(e){
	if($('rightColumnContent')) {
     var contentHolder = $('rightColumnContent');
    var initWidth = window.getWidth();
    contentHolder.setStyle('width', initWidth);
  }
});

//START THE INIT FUNCTION AFTER LOADING OF THE PAGE
window.addEvent('load', Site.init);

