function swapNav(obj,active){
	if(obj==null) return;
	if(obj.className.indexOf('active')!=-1) return;
	var img = findImg(obj);
	if(img==null) return;
	swapImage(img,active,'_a');
	obj.className = 'item'+(active?' gradient':'');
}

function swapSubNav(obj,active){
	if(obj==null) return;
	if(obj.className.indexOf('active')!=-1) return;
	obj.className = (active?' gradient':'');
}

function swapProjectNav(img,active){
	if(img==null) return;
	if(img.src.indexOf('_a')!=-1) return;
	swapImage(img,active);			
}

function swapImage(img,active,over){
	if(img==null) return;
	var src = img.src;
	var ext = '';
	if(over==null) over = '_o';
	if(src.lastIndexOf('.')!=-1){
		ext = src.substring(src.lastIndexOf('.'),src.length);
		src = src.substring(0,src.lastIndexOf('.'));
	}
	if(src.length>=2 && src.substring(src.length-2,src.length)==over){
		if(active)
			return;
		src = src.substring(0,src.length-2);
	}
	if(active)
		src += over;
	img.src = src+ext;
}

var slidePositions = new Object();
var slideIntervals = new Object();
var fadeSlide = true;
var fadeStep = 10;
function showNextSlide(container,dir){
	if(slidePositions[container]==null)
		slidePositions[container] = 0;
	var p=slidePositions[container]+dir;
	var c=0;
	while(true){
		var img = document.getElementById(container+'_image_'+c);
		if(img==null){
			break;
		}
		c++;
	}
	if(p<0) p=c-1;
	if(p>=c) p=0;
	showSlide(container,p);
}
function showSlide(container,n){
	if(slidePositions[container]==null)
		slidePositions[container] = 0;
	
	if(slidePositions[container]==n)
		return;
	
	var i=0;
	while(true){
		var img = findImg(document.getElementById(container+'_image_'+i));
		var title = document.getElementById(container+'_title_'+i);
		var text = document.getElementById(container+'_text_'+i);
		var nav = document.getElementById(container+'_nav_'+i);
		if(img!=null && title!=null && text!=null && nav!=null){
			img.style.display = 'none';
			title.style.display = 'none';
			text.style.display = 'none';
			nav.src = nav.src.replace('_a','').replace('_o','');
		}
		else {
			break;
		}
		i++;
	}
	var img = findImg(document.getElementById(container+'_image_'+n));
	var title = document.getElementById(container+'_title_'+n);
	var text = document.getElementById(container+'_text_'+n);
	var nav = document.getElementById(container+'_nav_'+n);
	if(img!=null && title!=null && text!=null && nav!=null){
		img.parentNode.style.display = img.style.display = 'block';
    img.parentNode.style.position = 'absolute';
		if(fadeSlide){
			var d = slideIntervals[container];
			if(d!=null)
				window.clearInterval (d.iid);
			var fromImg = findImg(document.getElementById(container+'_image_'+slidePositions[container]));
			if(fromImg!=null){
				fromImg.parentNode.style.display = fromImg.style.display = 'block';
        fromImg.parentNode.style.position = 'absolute';
				setImageOpacity(fromImg,100);
				setImageOpacity(img,0);
				var iid = window.setInterval (bind(onSlideInterval,window,container), 50);
				slideIntervals[container] = {iid: iid, fromImg: fromImg, toImg: img, opacity:0};
			}
		}
		title.style.display = 'block';
		text.style.display = 'block';
		var src = nav.src;
		var ext = '';
		if(src.lastIndexOf('.')!=-1){
			ext = src.substring(src.lastIndexOf('.'),src.length);
			src = src.substring(0,src.lastIndexOf('.'));
		}
		src = src.replace('_a','').replace('_o','');
		nav.src = src+'_a'+ext;
		slidePositions[container] = n;
	}
}
function onSlideInterval(container){
	var d = slideIntervals[container];
	if(d==null) return;	
	
	if(d.fromImg==null || d.toImg==null){
		window.clearInterval(d.iid);
		return;
	}
	
	if(d.opacity<100){
		d.opacity = Math.min(d.opacity+fadeStep,100);
		slideIntervals[container] = d;
		setImageOpacity(d.toImg,d.opacity);
		setImageOpacity(d.fromImg,100-d.opacity);
	}
	else {
		//d.fromImg.style.display = 'none';
		window.clearInterval(d.iid);
		return;
	}
}
function setImageOpacity(img,opacity){
	if(img==null) return;
	if(img.nodeName.toUpperCase()!='IMG') {
		alert(img);
		return;
	}
	
	opacity = Math.min(100,Math.max(0,opacity));
	var fop =  Math.round(opacity/10)/10;
	img.currentOpacity = fop;
	img.style.opacity = fop;
	img.style.filter = 'alpha(opacity='+Math.floor(opacity)+')';
}
function bind(func,obj,arg){
	return function () {return func.call (obj,arg);}; 
}
function findImg(obj){
	if(obj==null) return null;
	for(var i=0;i<obj.childNodes.length;i++){
		if(obj.childNodes[i].nodeName.toUpperCase()=='IMG'){
			return obj.childNodes[i];
		}
	}
	return null;
}

// utils.. little mootools..
// (c) by fugu GmbH
// author: michael van der weg
var fuguTools  = function(){
    var me            = this;
    this.fps            = 20;

    this.round = function(number, count){
       count        = ((count == "" || count == 0) ? 1 : Math.pow(10,count));
       return Math.round(number * count) / count;
    }
    // returns a non occupied id
    this.getFreeId = function(prefix){
        var length      = 10;
        var chars       = '0123456789ABCDEFGHIJKLMNOPQRSTUVWXTZabcdefghiklmnopqrstuvwxyz'.split('');

        if (! length) {
            length      = Math.floor(Math.random() * chars.length);
        }
        var str;

        while(true){
            str = "";
            for (var i = 0; i < length; i++) {
                str += chars[Math.floor(Math.random() * chars.length)];
            }
             if(prefix){
                 str = prefix + str;
             }

            if(!document.getElementById(str)){
                return str;
            }
        }
    }
    // set a style
    this.setStyle       = function(el, style, value){
        var e           = me.e(el);
        switch(style.toLowerCase()){
            case "opacity":
                try{
                    e.style.opacity = value;
                    e.style.filter  = "alpha(opacity="+(value*100)+");";
                } catch(ex){ }
                break;
            default:
					try{
						e.style[style] = value;
					}catch(ex){}
               break;
        }
    }

    // set attribute
    this.set = function(el, attributes){
        var e = me.e(el);
        if(e){
            for(var key in attributes){
                e.setAttribute(key, attributes[key]);
            }
        }
    }


    // set multiple styles
    this.setStyles = function(el, styles){
        for(var key in styles){
            me.setStyle(el, key, styles[key]);
        }
    }

    // return scrollTop
    this.scrollPosition = function(el){
        if(el){
            return {
                t:              me.e(el).scrollTop
                , l:            me.e(el).scrollLeft
            }

        }
        else{

            if(document.pageXOffset){
                return {
                    t:              document.pageYOffset
                    , l:            document.pageXOffset
                }
            }
            else if(document.documentElement.scrollTop){
                return {
                    t:          document.documentElement.scrollTop
                    , l:        document.documentElement.scrollLeft
                }
            }
            else if(document.body.scrollTop){
                return {
                    t:          document.body.scrollTop
                    , l:        document.body.scrollLeft
                }
            }
        }
        return {
            t:          0
            , l:        0
        }
    }

    // welement dimensions
    this.dimensions = function(el){
        var ret             = {h:0,w:0};
        if(el){
            var e           = me.e(el);
            try{
                ret.h       = e.clientHeight;
                ret.w       = e.clientWidth;
            }
            catch(ex){}
        }
        else{
            try{
                ret.h       = window.innerHeight;
                ret.w       = window.innerWidth;
                if(ret.h == undefined) throw("could not get dimensions");
            }
            catch(ex){
                ret.h       = document.body.offsetHeight;
                ret.w       = document.body.offsetWidth;
            }
        }

        return ret;
    }
    // get element by id
    this.e = function(el){
        if(typeof(el) != "object"){
            if(el.substr(0,1) == "#") {
                return document.getElementsByTagName(el.substr(1));
            }
            else{
                return document.getElementById(el);
            }
        }
        else{
            return el;
        }
    }
    // fade element
    this.fade =  function(el, time, from, to, callback){
        this.frames             = Math.floor(me.fps*(time/1000))
        this.stepper            = Math.floor(1000/me.fps);
        var ostepper            = ((to - from)/this.frames);
        var currentOpacity      = from;
        for(var i = 0;i < this.frames; i++){
            setTimeout(function(){
                currentOpacity += ostepper;
                me.setStyle(el, "opacity", currentOpacity);
            }, (i * this.stepper));
        }
        if(callback) setTimeout(callback, time);
    }
    // create element
    this.element = function(type, id, styles){
        var el = document.createElement(type);
        el.setAttribute("id", id);
        me.setStyles(el, styles);
        return el;
    }
    // add event
    this.addEvent = function(el, type, callback){
        try{
            me.e(el).addEventListener(type, callback, false);
        }
        catch(ex){
            me.e(el).attachEvent(("on" + type), callback);
        }
    }
}
// ken burns animation
// (c) by fugu GmbH
// author: michael van der weg
var kenBurns = function(options){
    this.a                  = new fuguTools();
    var self                = this;

    // startup
    this.initialize         = function(options){
        this.options        = options;
        this.images         = [];
        this.fps            = 30;
        this.interval       = (1000/this.fps);
        this.nonCanvas      = false;

        // start animation
        this.index = 0

        // start fallback if canvas could not be started
        if(!this.probe.call(this) || !this.prepare.call(this)){
            this.nonCanvas = true;
            this.initialHidden = false;
            this.prepareFallback();
        }
    }
    // static images insted of ken burns
    this.fallback = function(index, firstCall){
        if(!firstCall){
            this.a.fade(this.a.e(this.id), 500, 0, 1, function(){
                self.a.e("animatedimage").style.display = "none";
            });
        }

        // compute scale factor
        var min             = {h: this.options.styles.height,       w: this.options.styles.width}
        var max             = {h: this.images[index].image.height,  w: this.images[index].image.width}
        var factor          = ((min.h/max.h) > (min.w/max.w)) ? (min.h/max.h) : (min.w/max.w) ;

        min.h               = max.h*factor;
        min.w               = max.w*factor;

        var dim             = {w:((max.w > min.w) ? max.w : min.w), h:((max.h > min.h) ? max.h : min.h)}

        this.a.setStyles(this.image, {
            width:          parseInt(dim.w, 10)
            , height:       parseInt(dim.h, 10)
            , top:          ((dim.h - this.options.styles.height)/2*-1)
            , left:         ((dim.w - this.options.styles.width)/2*-1)
            , position:     "relative"
        });

        setTimeout(function(){
            if(self.index < (self.images.length-1)){
                self.index++;
            }
            else{
                self.index = 0;
            }
            self.a.fade(self.a.e(self.id), 500, 1, 0, function(){
                self.image.src = self.images[self.index].image.src;
                self.fallback.call(self, self.index);
            });
        }, this.images[index].time);
    }

    // animate image
    this.animate = function(index){
        while(!this.images[index]){
            index = this.index = (this.index < (this.images.length-1)) ?  (this.index+1) : 0 ;
        }

        // get min / max dimensions
        var numSteps        = (Math.ceil(this.images[index].time/1000*this.fps));
        var min             = {h: this.options.styles.height,       w: this.options.styles.width}
        var max             = {h: this.images[index].image.height,  w: this.images[index].image.width}
        var factor          = ((min.h/max.h) > (min.w/max.w)) ? (min.h/max.h) : (min.w/max.w) ;

        if(factor < 0.87 ) factor = 0.87; // throttle

        min.h               = max.h*factor;
        min.w               = max.w*factor;

        // start stop dimensiosn and positions
        this.images[index].start    = {top: 0,                              left: 0,                                width: max.w,   height: max.h}
        this.images[index].stop     = {top: ((max.h - min.h)/2)*Math.random(),  left: ((max.w - min.w)/2)*Math.random(),    width: min.w,   height: min.h}


        // set parameters for the animation
        var options = {
            step:{
                t:          ((this.images[index].start.top-this.images[index].stop.top)/numSteps)
                , l:        ((this.images[index].start.left-this.images[index].stop.left)/numSteps)
                , w:        ((this.images[index].start.width-this.images[index].stop.width)/numSteps)
                , h:        ((this.images[index].start.height-this.images[index].stop.height)/numSteps)
            }
            , current:{
                t:          this.images[index].start.top
                , l:        this.images[index].start.left
                , h:        this.images[index].start.height
                , w:        this.images[index].start.width
            }
            , img:          this.images[index].image
            , index:        index
            , h:            min.h
            , w:            min.w
            , t:            ((min.h - this.options.styles.height)/2)*-1
            , l:            ((min.w - this.options.styles.width)*Math.random())*-1
            , ctx:          this.context_outer
            , counter:      0
            , numSteps:     numSteps
            , self:         this
        }

        var interval        = setInterval(function(){
            try{
                // decrease index (because of the possible removal of images fomr the images array
                // on their on onload event (too small images are beeing removed onload))
               while(!self.images[index]){
                    if(index < (self.images.length-1)){
                        index++;
                    }
                    else{
                        index = 0;
                    }
                }
                options.ctx.drawImage(self.images[index].image, options.current.l, options.current.t, options.current.w, options.current.h, options.l, options.t , options.w, options.h);
            } catch(ex){ /* drawing failed, fail silently */ }

            options.counter++;
            // compute new values
            options.current.t   = options.self.a.round((options.current.t   -= options.step.t), 5);
            options.current.l   = options.self.a.round((options.current.l   -= options.step.l), 5);
            options.current.h   = options.self.a.round((options.current.h   -= options.step.h), 5);
            options.current.w   = options.self.a.round((options.current.w   -= options.step.w), 5);

            // transition
            if(options.counter > (options.numSteps-5)){
                options.ctx.globalAlpha = (options.ctx.globalAlpha-0.2)
            }
            if(options.counter < 20){
                options.ctx.globalAlpha = (options.ctx.globalAlpha+0.05)
            }

            // increase counter / start next image
            if(options.counter == options.numSteps) {
                clearInterval(interval);
                options.self.index = (options.self.index < (options.self.images.length-1)) ?  (options.self.index+1) : 0 ;
                options.self.animate.call(options.self, options.self.index)
            }
        }, this.interval);
    }

    // test if the 2d context is available
    this.probe = function(){
        try{
            var x = this.a.element("canvas", this.a.getFreeId("test_")).getContext('2d');
            return true;
        } catch(e){}
        return false;
    }

    // prepare fallback functions
    this.prepareFallback = function(){
        var id      = this.a.getFreeId("kenburns_");
        this.id = id;
        this.image    = this.a.element("img", id, this.options.styles);
        this.a.e(self.options.target).appendChild(this.image);
        this.image.src = this.a.e("animatedimage").src;

        // start preloader
        this.loadImages.call(this);
    }

    // create element, initilize them
    this.prepare = function(){
        // check compat
        // get some free ids
        var id      = this.a.getFreeId("kenburns_");
        this.id = id;

        // create canvas
        this.canvas_outer    = this.a.element("canvas", id, {});

        // attach to dom
        this.a.e(this.options.target).appendChild(this.canvas_outer);
        // get refeence of the cancas div
        var c = this.a.e(this.canvas_outer);
        this.a.setStyles(this.canvas_outer, {
            position:       "relative"
            , display:      "block"
            , opacity:      0
        });
        // set dimensions
        this.canvas_outer.width  = this.options.styles.width;
        this.canvas_outer.height = this.options.styles.height;
        // create context
        try{
            this.context_outer = this.canvas_outer.getContext('2d');
            this.loadImages.call(this);
            return true;
        }
        catch(ex){
            return false;
        }
    }
    this.getImageIndex = function(src){
        for(var i = 0; i < this.images.length; i++){
            if(this.images[i] && this.images[i].image.src == src){
                return i;
            }
        }
        return 0;
    }
    // preloads images
    this.loadImages = function(){
        for (var i = 0; i < this.options.images.length; i++){
            this.images[i] = {
                src:        this.options.images[i].url
                , time:     this.options.images[i].time
                , start:    this.options.images[i].start
                , stop:     this.options.images[i].stop
                , image:    new Image()
            };
            this.images[i].image.src = this.images[i].src;

            this.a.addEvent(this.images[i].image, "load", function(){
                var currentIndex = self.getImageIndex(this.src);
                if(this.width < self.options.styles.width || this.height < self.options.styles.height){
                    // remove image, its too small for animation
                    self.images.splice(currentIndex, 1);
                }
                else{
                     if(!self.fired){
                         self.fired = true;
                         if(self.nonCanvas){
                             self.fallback.call(self, 0);
                         }
                         else{
                             self.animate.call(self, currentIndex);
                            self.a.fade(self.id, 500, 0, 1, function(){});
                         }
                     }
                }
            });
        }
    }
    // init class
    this.initialize.call(self, options);
}
var KBanimatedImages = [];
var startKB = function(){
		if(!document.getElementById('animationContainerKenBurns'))return;
    for(var i = 0; i < KBanimatedImages.length; i++){
				if(KBanimatedImages[i]==false){
					KBanimatedImages.splice(i,1);continue;
				};
				KBanimatedImages[i] = {
					url: KBanimatedImages[i].replace(/&amp;/ig, "&"),
					start: {}, stop:{}, time: 5000
				}
    }
    
    var container = document.getElementById('animationContainerKenBurns');
    container.getElementsByTagName('img')[0].id = 'animatedimage';
    new kenBurns({
        target: "animationContainerKenBurns"
        , styles:{
            height:           container.parentNode.offsetHeight,
            width:          container.parentNode.offsetWidth
        }
        , images:   KBanimatedImages
    });
};
(function(){
var mappedOnlaod = window.onload;
window.onload = function(event){
	if(mappedOnlaod)mappedOnlaod(event);
	startKB();
}
})();