var ofyceAnim = new Class({

	Implements: [Events, Options],

	options: {
		bgCoord: new Hash ({
			'home'   : {
				left  : 0,
				top   : -150
			},
			'bottom' : {
				left  : -530,
				top   : -1360
			},
			'left'   : {
				left  : 0,
				top   : -0
			},
			'right'  : {
				left  : -1060,
				top   : 0
			}
		}),
		size            : {
			'home'      : 940,
			'elsep'     : 2000
		},
		contentCoord    : {
			'closed'    : {
				'top'   : 285,
				'height': 0,
				'padding': '0px'
			},
			'opened'    : {
				'top'   : 60,
				'height': 450,
				'padding': '10px'
			}
		},
		bgDuration      : 2000,
		contentDuration : 1000,
		ajUrl           : 'contenu/index.php',
		startPos        : 'home',
		selecClass      : 'selecTop'
	},

	initialize: function(menu, bg, content, contenu, options){
		this.setOptions(options);
		this.elems     = $$('#' + menu + ' a');
		this.bg        = $(bg);
		this.pos       = this.options.startPos;
		this.content   = $(content);
		this.contenu   = $(contenu);
		this.startF    = $empty;
		this.completeF = $empty;
		this.ajData;

		this.moveBgF = new Fx.Morph(this.bg, {
			duration: this.options.bgDuration,
			link    : 'cancel',
			onStart : function(){
				this.closeContent();
			}.bind(this)
		});

		this.moveBgO = new Fx.Morph(this.bg, {
			duration  : this.options.bgDuration,
			link      : 'cancel',
			onComplete: function(){
				this.openContent();
			}.bind(this)
		});

		this.moveBg = new Fx.Morph(this.bg, {
			duration : this.options.bgDuration,
			link     : 'cancel',
			onStart  : function(){
				this.closeContent();
			}.bind(this),
			onComplete: function(){
				this.openContent();
			}.bind(this)
		});

		this.contentFx = new Fx.Morph(this.content, {
			duration  : this.options.contentDuration,
			link      : 'cancel',
			onComplete: function(){
				if (this.content.getCoordinates().height == 0) this.ziAjax();
			}.bind(this)
		});

		this.elems.each(function(el, i){
			el.addEvent('click', function(e){
				e.stop();
				this.elems.removeClass(this.options.selecClass);
				el.addClass(this.options.selecClass);
				this.ajData = el.getProperty('href').split('/')[1];
				var zid     = el.getProperty('id');
				var cleft   = this.options.bgCoord.get(zid).left;
				var ctop    = this.options.bgCoord.get(zid).top;
				if (this.pos != zid) {
					if (this.pos != "home" && zid != "home") {
						this.moveBgF.start({
							'width'  : this.options.size.home,
							'height' : this.options.size.home,
							'left'   : this.options.bgCoord.home.left,
							'top'    : this.options.bgCoord.home.top
						}).chain(function(){
							this.moveBgO.start({
								'width'  : this.options.size.elsep,
								'height' : this.options.size.elsep,
								'left'   : cleft,
								'top'    : ctop
							});
						}.bind(this));
					}
					else if (this.pos == "home" && zid != "home") {
						this.moveBg.start({
							'width' : this.options.size.elsep,
							'height': this.options.size.elsep,
							'left'  : cleft,
							'top'   : ctop
						});
					}
					else {
						this.moveBg.start({
							'width' : this.options.size.home,
							'height': this.options.size.home,
							'left'  : cleft,
							'top'   : ctop
						});
					}
					this.pos = zid;
				}
			}.bind(this));
		}.bind(this));
	},

	ziAjax: function(){
		var ajRequest = new Request.HTML({
			method: 'get',
			url: this.options.ajUrl,
			update: this.contenu,
			onSuccess: function(){
				/*
Cufon.replace('h1', { fontFamily: 'Caflisch' });
				Cufon.replace('h2', { fontFamily: 'Caflisch' });
*/
			}
		}).send('content=' + this.ajData);
	},

	closeContent: function(){
		this.contentFx.start({
			'top'   : this.options.contentCoord.closed.top,
			'height': this.options.contentCoord.closed.height,
			'padding-top': this.options.contentCoord.closed.padding,
			'padding-bottom': this.options.contentCoord.closed.padding
		});
	},

	openContent: function(){
		this.contentFx.start({
			'top'   : this.options.contentCoord.opened.top,
			'height': this.options.contentCoord.opened.height,
			'padding-top': this.options.contentCoord.opened.padding,
			'padding-bottom': this.options.contentCoord.opened.padding
		});
	}

});