/**
* @author pete
*/

/* modified Effect.Move to allow for movement from the right */
Effect.Move = Class.create(Effect.Base, {
  initialize: function(element) {
    this.element = $(element);
    if (!this.element) throw(Effect._elementDoesNotExistError);
    var options = Object.extend({
      x:    0,
      y:    0,
      mode: 'relative',
	  style_properties: {
	  	x: 'left',
		y: 'top'
	  }
    }, arguments[1] || { });
    this.start(options);
  },
  setup: function() {
    this.element.makePositioned();
    this.originalX = parseFloat(this.element.getStyle(this.options.style_properties.x) || '0');
    this.originalY  = parseFloat(this.element.getStyle(this.options.style_properties.y)  || '0');
    if (this.options.mode == 'absolute') {
      this.options.x = this.options.x - this.originalX;
      this.options.y = this.options.y - this.originalY;
    }
  },
  update: function(position) {
	var style = {};
	style[this.options.style_properties.x] = (this.options.x  * position + this.originalX).round() + 'px';
	style[this.options.style_properties.y] = (this.options.y  * position + this.originalY).round() + 'px';
	this.element.setStyle(style);
  }
});


var VoorsangerInterface = {
	duration: 0.3,
	fps: null,
	mouseevents: {mouseenter:'custom:mouseenter', mouseleave:'custom:mouseleave'},
	
	/* element definitions */
	left_column: null,					// main menu container, slides in and out
	right_column_container: null,       // invisible container for right column
	right_column_header: null,          // red block on project details page
	details_drawer: null,               // contains image navigation show/hide info and pdf on projects detail page
	right_details: null,                // contains detail text of project
	
	
	stopAnimation: function(elm){
		if( elm.animation ){
			elm.animation.cancel();
			elm.animation = null;
		}
	},
	
	/* do slide in/out initialization for the left hand column. this is standard accross the site */
	initializeLeftColumnAnimations: function(){
		this.right_column_container = $('voorsanger-right-column-container');
		this.left_column_container = $('voorsanger-left-column-container');
		this.left_column = $('voorsanger-left-column');
		
		if( this.right_column_container && this.left_column && this.left_column_container){
			this.right_column_container.observe(this.mouseevents.mouseenter, function(e){
				if( this.left_column && !this.left_column.hidden ){
					this.stopAnimation(this.left_column);
					this.left_column.hidden = true;
					this.left_column.animation = new Effect.Move(this.left_column, {
						mode: 'absolute',
						x: -272,
						duration: this.duration,
						queue: {scope: 'left_column', limit: 1}
					});	
				}
			}.bindAsEventListener(this));
			this.left_column_container.observe(this.mouseevents.mouseenter, function(e){
				if( this.left_column && this.left_column.hidden){
					this.stopAnimation(this.left_column);
					this.left_column.hidden = false;
					this.left_column.animation = new Effect.Move(this.left_column, {
						mode: 'absolute',
						x: 0,
						duration: this.duration,
						queue: {scope: 'left_column', limit: 1}
					});
				}
			}.bindAsEventListener(this));
		}else{
			throw 'VoorsangerInterface: left column and/or right column container do/does not exist!';
		}
	},
	
	initializeDrawers: function(){
		/*$$('.pswrap_drawer').each(function(e){
			new PSWrap.Animation.OpenCloseIDBound(e, {duration: VoorsangerInterface.duration});
		});*/
		new PSWrap.Animation.OpenCloseCollection($('voorsanger-main-menu'), {
			position_items: false,
			item_selector: '.pswrap_drawer',
			only_child_items: false
		}, {
			duration: 0.2
		}, {
			options: {
				beforeSetup: function(sobj, ocobj){
					var open_elms = ocobj.getOpenElements();
					open_elms.invoke('addClassName', 'header_active');
				}
			}
		}, {
			options: {
				afterFinish: function(sobj, ocobj){
					var open_elms = ocobj.getOpenElements();
					open_elms.invoke('removeClassName', 'header_active');
				}
			}
		});
	},
	
	initialize: function(){
		/* prevent drag and drop of images */
		$$('#voorsanger-background img')
		.invoke('observe', 'mousedown', function(e){e.stop();})
		.invoke('observe', 'mouseup', function(e){e.stop();});
		
		/* prevent save by right click */
		$$('img')
		.invoke('observe', 'contextmenu', function(e){e.stop(); return false;});
		
		this.initializeLeftColumnAnimations();
		this.initializeDrawers();
		
		this.right_column_content = $('voorsanger-right-column-content');
		this.right_column_header = $('voorsanger-right-column-heading-content');
		this.details_drawer = $('voorsanger-project-initial-details');
		if( this.details_drawer) this.details_drawer.hidden = true;
		
		this.right_details = $('voorsanger-right-column');
		this.right_details_opener = $('voorsanger-project-info');
		if( this.right_details ) this.right_details.hidden = true;
		
		if( this.right_column_header && this.details_drawer){
			/*this.right_column_header.observe(this.mouseevents.mouseenter, function(){
				if( this.details_drawer && this.details_drawer.hidden){
					this.stopAnimation(this.details_drawer);
					this.details_drawer.hidden = false;
					this.details_drawer.animation = new Effect.BlindDown(this.details_drawer, {
						duration: this.duration,
						queue: {scope: 'details_drawer', limit: 1}
					});
				}
			}.bindAsEventListener(this));
			this.right_column_header.observe(this.mouseevents.mouseleave, function(){
				if( this.right_details.hidden && this.details_drawer && !this.details_drawer.hidden){
					this.stopAnimation(this.details_drawer);
					this.details_drawer.hidden = true;
					this.details_drawer.animation = new Effect.BlindUp(this.details_drawer, {
						duration: this.duration,
						queue: {scope: 'details_drawer', limit: 1}
					});
				}
			}.bindAsEventListener(this));*/
			// test?
			(function(){
				new Effect.BlindDown(this.details_drawer, {
					duration: this.duration,
					queue: {scope: 'details_drawer', limit: 1}
				});
			}).bind(this).delay(1.0);
		}
		
		if(this.right_details && this.right_details_opener){
			this.right_details_opener.observe('click', function(){
				this.stopAnimation(this.right_details);
				if( this.right_details.hidden ){
					/* show details drawer */
					this.right_details.hidden = false;
					this.right_details_opener.removeClassName('hidden');
					this.right_details_opener.addClassName('shown');
					this.right_details.animation = new Effect.Move(this.right_details, {
						mode: 'absolute',
						x: 0,
						duration: this.duration,
						queue: {scope: 'details_drawer', limit: 1},
						style_properties: {
							x: 'right',
							y: 'top'
						},
						beforeStart: function(){
							//this.right_column_content.setStyle({overflow: 'hidden'});
						}.bind(this),
						afterFinish: function(){
							//this.right_column_content.setStyle({overflow: 'auto'});
						}.bind(this)
					});
				}else{
					/* hide details drawer */
					this.right_details.hidden = true;
					this.right_details_opener.removeClassName('shown');
					this.right_details_opener.addClassName('hidden');
					this.right_details.animation = new Effect.Move(this.right_details, {
						mode: 'absolute',
						x: -(this.right_details.getWidth() || 400),
						duration: this.duration,
						queue: {scope: 'right_details', limit: 1},
						style_properties: {
							x: 'right',
							y: 'top'
						},
						beforeStart: function(){
							//this.right_column_content.setStyle({overflow: 'hidden'});
						}.bind(this),
						afterFinish: function(){
							//this.right_column_content.setStyle({overflow: 'auto'});
						}.bind(this)
					});
				}
			}.bindAsEventListener(this));
		}
	}
}