/*********************************************************************************************
 * 
 * Deze code is met veel plezier geschreven, getest en met trots 
 * opgeleverd door Aron Rotteveel van Vije Internetproducties.
 * Informatie:
 * 
 * Opdrachtgever: Ontwerp Atelier
 * Laatste update: 20 juli 2007
 * 
 * Voor vragen kunt u contact opnemen per e-mail (aron@vije.nl) of per telefoon (074-2673400).
 * Meer informatie over Vije Internetproducties vindt u op http://www.vije.nl
 *
 *********************************************************************************************/

/////////////////////////////////////////////////////
// GENERIC
/////////////////////////////////////////////////////



Array.max = function( array ){
    return Math.max.apply( Math, array );
};

Array.min = function( array ){
    return Math.min.apply( Math, array );
};


var Cookie = {

    set: function(name, value, days) {
        
        if (days) {
            var date = new Date();
            date.setTime(date.getTime()+(days*24*60*60*1000));
            var expires = '; expires='+date.toGMTString();
        } else {
            var expires = '';
        }
        
        document.cookie = name+'='+value+expires+'; path=/';
        document.cookie = name + '=' +escape(value);
        
    },

    get: function(name) {
        
        var start = document.cookie.indexOf(name+"=");
        var len = start + name.length + 1;
        
        if ((!start) && (name != document.cookie.substring(0, name.length))) {
            return null;
        }
        
        if (start == -1) return null;
        
        var end = document.cookie.indexOf(";", len);
        
        if (end == -1) end = document.cookie.length;
        
        return unescape(document.cookie.substring(len, end));
    }
}


var URL = function(url) {
    this.directories = [];
    this.url = (url) ? url.toString() : window.location.href.toString();
    this.object = (url) ? url : window.location;
}

URL.prototype.parse = function() {
    
    this.splitted = this.url.split('/');
    this.protocol = this.splitted[0];
    this.host = this.splitted[2];
    this.hash = this.object.hash.toString().replace(/#/g, '');    
    this.directories = [];

    var splittedHash = this.hash.split('/');
    
    if (splittedHash.length > 1) {
        
        this.hash = [];
        
        splittedHash.each((function(hash, key) {
            this.hash[key] = hash;
        }).bind(this));
    }
    
    for (var i = 3; i <= this.splitted.length; i++) {
        
        if (this.splitted[i] && this.splitted[i] != '') {
            
            this.directories[i-3] = this.splitted[i];
            
        }
        
    }
    
    return this;
    
}

URL.prototype.matchHash = function(regex) {
    
    if (typeof(this.hash) == 'object') {
        
        var exec;
        
        for (var i = 0; i < this.hash.length; i++) {
            
            exec = regex.exec(this.hash[i].toString());
            if (exec) {
                return exec;
            }
            
        }
        
        return false;
        
    } else {
        var exec = regex.exec(this.hash);
        return exec;
    }
};

/////////////////////////////////////////////////////
// CASES
/////////////////////////////////////////////////////

var cases = {};

cases.attachLinks = function() {
    
    var url = new URL().parse();
    
    if (!url.directories[0] || url.directories[0].toLowerCase() != 'work') {
        return false;
    }
    
    var links = $A($$('.caseLink'));

    if (!links || links.length == 0) return false;

    links.each(function(link, key) {
        Event.observe(link, 'click', function(event) {
            cases.expandCase(link);
            Event.stop(event);
        });
    });
}

cases.expandCase = function(link) {
    
    var containinglist = link.parentNode.parentNode.parentNode;
    if (!containinglist || containinglist.tagName.toLowerCase() != 'ul') {
        return false;
    }
    
    var rowID = parseInt(containinglist.id.split('_')[1]);
    var regex = new RegExp('Case([0-9]+)');
    var exec = regex.exec(link.href);
    var caseID = exec[1];
    
    if (link.parentNode.className == 'caseImage') {
        link = $('Case'+caseID+'_link');
    }

    if (cases.expandedCase) {
        
        if (cases.slideshow) {
            cases.slideshow.stop();
        }
        
        var loader = document.createElement('div');
        loader.className = 'loader';
        loader.id = 'loader';
        cases.expandedCase.appendChild(loader);        
        
        if (cases.currentRow && cases.currentRow == rowID) {
            
            new Ajax.Request('/work/showCase/'+caseID+'/', {
                        onLoading: function() {
           				loader.className = 'loader';
           				container.appendChild(loader);
                },
                onComplete: function(t) {
                    
                    t.responseText.evalScripts(); // evalscripts option does not seem to work here, so try manual
                    Element.remove('caseContainer');
                    cases.currentRow = rowID;
                    cases.handleResponse(t.responseText, cases.expandedCase);
                }
            });        
            
        } else {
            
            var largecase = cases.createContainer(containinglist, link, caseID, rowID);
        
            var effects = [];
            
            effects.push(new Effect.Fade(cases.expandedCase, {
                duration: 0.5,
                sync: true
            }));
    
            effects.push(new Effect.BlindDown(largecase, {
                duration: 0.5,
                sync: true,
                afterFinish: function() {
    
                    new Ajax.Request('/work/showCase/'+caseID+'/', {
                        onLoading: function() {
                    	    loader.className = 'loader';
  					        container.appendChild(loader);
                            new Effect.Appear(largecase, { duration: 0.5 });
                        },
                        onComplete: function(t) {
                            t.responseText.evalScripts(); // evalscripts option does not seem to work here, so try manual
                            cases.currentRow = rowID;
                            cases.handleResponse(t.responseText, largecase);
                        }
                    });
                }
            }));
            
            new Effect.Parallel(effects, {
                afterFinish: function() {
                    Element.remove(cases.expandedCase);
                    cases.currentRow = rowID;
                    cases.expandedCase = largecase;
                }
            });
            
        }
        
    } else {
        
        setTimeout((function() { new Effect.ScrollTo(link, { offset: -175 }) }).bind(this), 300);    
        
        var largecase = cases.createContainer(containinglist, link, caseID, rowID);
        
        new Effect.BlindDown(largecase, {
            duration: 0.5,
            afterFinish: function() {

                new Ajax.Request('/work/showCase/'+caseID+'/', {
                    onLoading: function() {
                    loader.className = 'loader';
        				container.appendChild(loader);
                        new Effect.Appear(largecase, { duration: 0.5 });
                    },
                    onComplete: function(t) {
                        t.responseText.evalScripts(); 
                        cases.currentRow = rowID;
                        cases.handleResponse(t.responseText, largecase);
                    }
                });
            }
        });            
                
        cases.expandedCase = largecase;
    }

}

cases.createContainer = function(containinglist, link, caseID, rowID) {
    
        //////////////////////////////////////////////////////
        // CASE CONTAINER CREATION
        //////////////////////////////////////////////////////
            
        var largecase = document.createElement('div');
        largecase.className = 'largeCase';
        largecase.style.display = 'none';
    
        Element.setOpacity(largecase, 0);
    
        var loader = document.createElement('div');
        loader.className = 'loader';
        loader.id = 'loader';
        largecase.appendChild(loader);
        
        containinglist.parentNode.insertBefore(largecase, link.parentNode.parentNode.parentNode.nextSibling);        
        
        return largecase;
}

cases.handleResponse = function(response, container) {
    
    container.innerHTML += response;
    var s = new Slideshow('photos', {
        images: slideshowImages,
        onInit: function() {
            new Effect.Fade('loader', { 
                duration: 0.3,
                afterFinish: function() {
                    Element.remove('loader');                    
                    new Effect.Appear(container, { duration: 0.5 } );
                    new Effect.Appear('caseContainer', {
                        duration: 0.5
                    });
                    
                    cases.enableNav();
                    
                }
            });
            
        }
    });
    
    cases.slideshow = s;
}

cases.enableNav = function() {
    var parent = $('caseContainer');
    var nav = $('nav');
    var c = $('closelink');
    var t = $('togglelink');
    var textcontainer = document.getElementsByClassName('text', parent)[0];
    var overlay = document.getElementsByClassName('overlay', parent)[0];
    //var imagelinks = document.getElementsByClassName('imagelink', nav);
    var imagelinks = $A($$('.videolink', '.imagelink'));
    
    Event.observe(c, 'click', function() {

        new Effect.Fade(cases.expandedCase, {
            duration: 0.5,
            afterFinish: function() {
                Element.remove(cases.expandedCase);
                cases.expandedCase = false;
            }
        });
        
    });
    
    Event.observe(t, 'click', function() {
        
        var effects = [];
        
        if (!cases.hideText) {
            
            Element.hide(textcontainer);
            
            effects.push(new Effect.Scale(overlay, 0, {
                duration: 0.5,
                sync:true,
                scaleY: false,
                scaleContent: false
            }));
            
        } else {
            
            Element.show(textcontainer);
            
            effects.push(new Effect.Scale(overlay, 100, {
                duration: 0.5,
                sync:true,
                scaleY: false,
                scaleContent: false,
                scaleMode: {
                    originalWidth: 390                    
                }
            }));
            
        }
        
        new Effect.Parallel(effects, {
            afterFinish: function() {
                cases.hideText = (cases.hideText) ? false : true;
            }
        });
        
    });
    
    imagelinks.each(function(link,key) {
        Event.observe(link, 'click', (function() {
            cases.slideshow.stop();
            cases.slideshow.cleanFlashPlayers(link.id.split('_')[1]);
            cases.slideshow.preload(parseInt(link.id.split('_')[1]), true);
            
            Element.hide(textcontainer);
            
            new Effect.Scale(overlay, 0, {
                duration: 0.5,
                scaleY: false,
                scaleContent: false
            });
            
            cases.hideText = true;
            
        }).bind(this));
    });
}

cases.checkHash = function() {
    var url = new URL().parse();
    if (url.directories[0] && url.directories[0].toLowerCase() == 'work') {
        if (url.hash) {
            var link = $(url.hash.toString()+'_link');
            cases.expandCase(link);
        }
    }
}


/////////////////////////////////////////////////////
// WEBLOG
/////////////////////////////////////////////////////

var weblog = {};

weblog.load = function(userID, item) {
    
    var container = $('weblogContent');
    var loader = document.createElement('div');
    
    if (!item) {
    
        var url = new URL().parse();
        
        var regex = new RegExp('Item([0-9]+)');
        var exec = url.matchHash(regex);
        
        if (exec) {
            item = parseInt(exec[1]);
        }
        
    }
    
    new Ajax.Request('/weblog/showWeblog/userID:'+userID, {
        postBody: ((item) ? 'weblogID='+item : ''),
        onLoading: function() {
            loader.className = 'loader';
            container.appendChild(loader);
        },
        onComplete: function(t) {
            Effect.Fade(loader, { 
                duration: 0.5,
                afterFinish: function() {
                    container.innerHTML = t.responseText;        
                    weblog.current = userID;
                    Cookie.set('currentweblog', userID);
                    weblog.attachPermalinks();
                    weblog.comments.attachLinks('weblog_'+userID);
                    
                    var url = new URL().parse();
                    var regex = new RegExp('Comments');
                    var exec = url.matchHash(regex);
                    
                    if (exec && item) {
                        weblog.comments.load(item, document.getElementsByClassName('commentslink', 'weblog_'+userID)[0]);
                    }
                }
            });
        }
    });
    
}

weblog.attachPermalinks = function(parent) {
	        
    if (!parent) {
        parent = $('weblogcontent');
    } else {
        parent = $(parent);
    }
    
    var links = document.getElementsByClassName('permalink', parent);
    
    if (!links || links.length == 0) {
        return false;
    }    
    
    links.each(function(link,key) { 
        var url = new URL(link).parse();
        Event.observe(link, 'click', function() { 
            var regex = new RegExp('Weblog([0-9]+)');
            var exec = url.matchHash(regex);
            var userID = exec[1];
            var regex = new RegExp('Item([0-9]+)');
            var exec = url.matchHash(regex);
            var weblogID = exec[1];
            weblog.load(userID, weblogID);
        });
    });
    
}

weblog.loadCurrent = function() {
    
    if (!$('items')) {
        return false;
    }
    
    var url = new URL().parse();
    
    var regex = new RegExp('Weblog([0-9]+)');
    var exec =  url.matchHash(regex);
    if (url.hash && exec) {
        //var regex = new RegExp('Weblog([0-9]+)');
        //var exec = regex.exec(url.hash);
        if (parseInt(exec[1])) {
            weblog.current = parseInt(exec[1]);
        }
    } else {
        var cookie = Cookie.get('currentweblog');
        if (cookie) {
            weblog.current = cookie;
        } else {
            weblog.current = 1;
        }
    }

    weblog.load(weblog.current);

}

var lastpostVisibleItems = new Array();

weblog.attachLinks = function() {

    var sectionsContainer = $('sections');
    if (!sectionsContainer) return false;
    
    var links = $A(sectionsContainer.getElementsByTagName('a'));
    if (!links || links.length == 1) return false;

	$$('.lastpost_visible').each(function(e){
		tmp = e.id;
		tmp = tmp.sub('_lastpost','');
		lastpostVisibleItems[lastpostVisibleItems.length] = tmp;
	});

	$$('.lastpost').each(function(e){
		Event.observe(e, 'click', function() {
			linkobject = $(e.id.sub('_lastpost','')); 
			weblogClickHandler(linkobject);
		});
	});

    links.each(function(link, key) {
		    	
	        Event.observe(link, 'mouseover', function() {
	        	if ($(link.id + '_lastpost')) {
		        	$(link.id + '_lastpost').show();
		        	lastpostVisibleItems.each(function(item, index) {
		        		if (item != link.id) {
		        			$(item + '_lastpost').hide();
		        		}
		        	});
		        	lastpostVisibleItems.clear();
	        	}
	        });
	
	        Event.observe(link, 'mouseout', function() {
	        	if ($(link.id + '_lastpost')) {
		        	lastpostVisibleItems[lastpostVisibleItems.length] = link.id;
	        	} 
	        });

        Event.observe(link, 'click', function() {
			weblogClickHandler(link);
        });
    });
}

function weblogClickHandler(link) {
    var container = $('weblogContent');

    container.innerHTML = '';

    var effects = [];
    var t = $('weblogTitle');
    t.innerHTML = link.innerHTML;
    
    var regex = new RegExp('Weblog([0-9]+)');
    var exec = regex.exec(link.href);
    var userID = exec[1];

    if (weblog.hiddenSection) {
        effects.push(new Effect.BlindDown(weblog.hiddenSection, { duration: 0.3, sync: true }));
    }

    effects.push(new Effect.BlindUp(link, { duration: 0.3, sync: true }));
    effects.push(new Effect.BlindDown(t, { duration: 0.3, sync: true }));

    if (Element.hasClassName(link.parentNode, 'generic')) {
        Element.addClassName(t, 'genericTitle');
        Element.removeClassName(t, 'personTitle');
    } else {
        Element.removeClassName(t, 'genericTitle');
        Element.addClassName(t, 'personTitle');
    }

    new Effect.Parallel(effects, { 
        duration: 0.3,
        afterFinish: function() {
            weblog.load(userID);
        }
    } );

    weblog.hiddenSection = link;	
}

weblog.comments = {};

weblog.comments.attachLinks = function(parent) {
    if (!parent) {
        parent = $('weblogcontent');
    } else {
        parent = $(parent);
    }
    var links = document.getElementsByClassName('commentslink', parent);
    if (!links || links.length == 0) {
        return false;
    }
    
    links.each(function(link, key) {
        Event.observe(link, 'click', function() {
            var splittedlink = link.href.split('/');
            var userID = splittedlink[3].replace('#Weblog', '');
			var tmpWeblogID = splittedlink[4].replace('%23', '#'); // mooie safari hack :)
            var weblogID = tmpWeblogID.replace('#Item', '');
            weblog.comments.load(weblogID, link);
        });
    });
}

weblog.comments.load = function(weblogID, link) {

    var oldcontent = link.innerHTML;
    
    new Ajax.Request('/weblog/showComments/weblogID:'+weblogID, { 
        onLoading: function() {
            link.innerHTML = 'Loading comments...';
        },
        onComplete: function(t) {
            link.innerHTML = oldcontent;
            var c = $('comments_'+weblogID);
            c.innerHTML = t.responseText;
            addValidationHandlers();
        }
    });
}

/////////////////////////////////////////////////////
// HEADER
/////////////////////////////////////////////////////

var header = {};

header.attachCollapser = function() {
    var t = $('toggle');
    var h = $('header');
    var c = $('content');
    
    if (!t) {
        return false;
    }
    
    Event.observe(t, 'click', function(event) {
        
        switch (t.className.toLowerCase()) {
            
            case 'up':
            
                Element.hide('headerInner');
            
                c.style.marginTop = '0';
                c.style.paddingTop = '0';
                t.style.top = '10px';
                
                t.className = 'down';       
                t.innerHTML = 'expand';
                t.title = 'click to expand';
                
                //h.style.position = 'relative';
                h.style.background = '#fff url(/img/lijn_down.gif) no-repeat 20px 100%';                
                
                new Effect.Scale(h, 15, {
                    scaleX: false,
                    scaleContent: false,
                    duration: 0.5
                });                        
                
            break;
            
            case 'down':
            
                t.className = 'up';
                t.innerHTML = 'collapse';
                t.title = 'click to collapse';
                
                c.style.paddingTop = '';
                c.style.marginTop = '';
                
                //h.style.position = 'fixed';
                
                h.style.background = '#fff url(/img/lijn_up.gif) no-repeat 20px 100%';                                        
                
                new Effect.Scale(h, 100, {
                    scaleX: false,
                    scaleContent: false,
                    duration: 0.5,
                    scaleMode: { 
                        originalHeight: 130
                    },
                    afterFinish: function() {
                        t.style.top = '121px';
                        
                        Element.show('headerInner');
                        //new Effect.Appear('headerInner', { duration: 0.5 } );
                    }
                });
                
            
            break;
            
        }
    });
    
}


/////////////////////////////////////////////////////
// ONLOAD HANDLERS, GLOBALS
/////////////////////////////////////////////////////

var slideshowImages = [];

var url = new URL().parse();

Event.observe(window, 'load', function() {
    weblog.loadCurrent();
    weblog.attachLinks();
    cases.attachLinks();
    cases.checkHash();
    header.attachCollapser();
});