// ---------------------------------------------------------------------------- //
// -- View description -------------------------------------------------------- //
// ---------------------------------------------------------------------------- //

var ListViewHelper = Class.create({
	updateDivId: 'content_pictures',
	menuElementsCss: '#menu a',
	
	initialize: function() {
		var context = this;
		Event.observe(window, 'load', function() {

			$$(context.menuElementsCss).each(function(el) {
				Event.observe(el, 'mouseover', function() { context._onMouseOverFunction.call(context, this); });
				Event.observe(el, 'mouseout', function() { context._onMouseOutFunction.call(context, this); });
				Event.observe(el, 'click', function(e) { context._onClickFunction.call(context, this, e); });
			});

			new Effect.Opacity(context.updateDivId, {
				duration: 0.1,
				from: 1,
				to: 0,
				afterFinish: function() {
					context._onClickFunction($$(context.menuElementsCss).first());
				}
			});
		});
	},
	
	_onMouseOverFunction: function(el) {
		if (!el.active) {
			this._setStyleOnMouseOver(el);
		}
	},
	
	_onMouseOutFunction: function(el) {
		if (!el.active) {
			this._setStyleOnMouseOut(el);
		}
	},
	
	_onClickFunction: function(el, event) {
		if (event) {
			event.stop();
		}					

		if (!el.active) {
			new Effect.Opacity(this.updateDivId, {
				duration: 1,
				from: 1,
				to: 0,
				afterFinish: function() {
					new DivUpdater().goToPage(el.href);
				}.bind(this)
			});
		}

		$$(this.menuElementsCss).each(function(el2) {
			if (el2.active) {
				el2.active = false;
				this._setStyleOnMouseOut(el2);
			}
		}.bind(this));

		el.active = true;
		this._setStyleOnMouseOver(el);
	},
	
	_setStyleOnMouseOver: function(el) {
			el.setStyle({
				//backgroundColor: colorSubMenu
				borderBottom: '2px solid #000'
			});
			
			/*el.setStyle({
				color: '#ffffff'
			});*/
	},
	
	_setStyleOnMouseOut: function(el) {
		el.setStyle({
				//backgroundColor: '#ffffff'
				borderBottom: '1px solid #ccc'
			});
			
			/*el.setStyle({
				color: colorSubMenu
			});
			*/
	}
})

var listViewHelper = new ListViewHelper();