archives = {
	
	init : function() {                                         
		this.container = $('#months-archives').parent();
		
		// create more-link
		var more_link = $("<li><a href='#' id='more-link'>++</a></li>");
		
		// create close_link
		var close_link = $("<li><a href='#' id='close-link'>&#x2191;</a></li>");
				                                                		
		// add more link elements after 3rd li   
		$('#months-archives li:eq(2)').after(more_link);
		
		// add close link after last element
		$('#months-archives li:last').after(close_link);
		     
		// select and hide all archives more than 3 months old
		$('#months-archives li:gt(3)').hide();
		
		// attach events
		$('a#more-link').click(function() {
			archives.open_archives();
			$(this).hide();
		});             
		
		$('a#close-link').click(function() {
			archives.close_archives();
		});
		

	},
	
	open_archives : function() {
		// var container = $('#months-archives').parent().parent();
		var elements = $('#months-archives li:hidden');
		
		// get current height
		var extra = 50;
		var height = 0;
		height = this.container.outerHeight();
		$(this.container).css('height', height);
				
		// calculate child elements total height
		elements.each(function() {
			height += $(this).height();
		});
						                                        
		elements.show();				
		$(this.container).animate({'height': height + extra}, 250);		
	},
	
	close_archives : function() {
		$(this.container).animate({'height': 79}, 250);		
		
		$('a#more-link').show();
		
		// select and hide all archives more than 3 months old
		$('#months-archives li:gt(3)').hide();		
	}
	
}


settings = {
  container_height   : 160, //px
  container_height   : 160, //px
  opened_width       : 360, //px
  animation_speed    : 250, //ms
  off_color          : '#1e1e1e',
  default_over_color : '#cccccc'
};

function attach_events(e) {			  
  // hover with delay
	$(e).hoverIntent({
	  sensitivity: 1, // number = sensitivity threshold (must be 1 or higher)    
    interval: 50, // number = milliseconds for onMouseOver polling interval    
    over: roll_over_post, // function = onMouseOver callback (REQUIRED)    
    timeout: 50, // number = milliseconds delay before onMouseOut    
    out: roll_out_post // function = onMouseOut callback (REQUIRED)        
	});

  // click even
  $(e).bind('click', function() {
   $(e).unbind('mouseover');
   $(e).unbind('mouseout');
   // $(e).unbind('click');
   // open_post(e);
   // return false;
  });
}

function roll_over_post(e) {
  elements = find_elements(e.currentTarget);
  $(e.currentTarget).colorBlend([{colorList:[settings.off_color, elements.over_color], isFade:false, cycles: 1, fps: 5}]);;  
}

function roll_out_post(e) {
  elements = find_elements(e.currentTarget);
  $(e.currentTarget).colorBlend([{colorList:[elements.over_color, settings.off_color], isFade:false, cycles: 1, fps: 5}]);;
}

function open_post(e) {
	// scroll to element top offset position
	topOffset = $(e).offset()['top'];
	$('html, body').animate({scrollTop: topOffset - 20}, 'slow'); 
	
	// get all child elements
	elements = find_elements(e);		
		
  $(e).css('backgroundColor', elements.over_color);
	
	// animate
	$(e).animate({ width: settings.opened_width}, settings.speed);		
}
	
function close_post(e) {
	// console.log(e, close, picture_container, picture.src);
	elements = find_elements(e);

	// revert animations 
	$(e).animate({width: 200, height: 200, marginLeft: 0}, 'fast', null, function(){ $(e).removeClass('open'); });
	$(elements.picture_container).animate({width: 200, height: 200, marginLeft: 0}, 'fast');
	$(elements.picture).animate({marginTop: -100, marginLeft: -100}, 'fast');
	$(elements.content).css('opacity', '0');		
	$(elements.close).hide();

	// fade to grey
	over_color = $(e).attr('color');		
	$(e).css('backgroundColor', '#cccccc');
	// $(e).colorBlend([{colorList:[over_color,  "#cccccc"], isFade:false, cycles: 1}]);

	// reattach over-out events
	attach_events(elements.a, e);
}

function add_close_btn(e) {
	$(e).prepend('<a href="#" class="rounded-4 close" alt="">Close</a>');
}

function find_elements(e) {
	elements = new Object();
	elements['a'] 								= $(e).find('.picture a')[0];
	elements['picture_container'] = $(e).find('.picture')[0];
	elements['picture'] 					= $(e).find('.picture img')[0];
	elements['content'] 					= $(e).find('.content')[0];		
  elements['close']             = $(e).find('.close')[0];  
  
	// find over/open color string
  over_color = $(e).find('.color')[0];
  elements['over_color']        = $(over_color).text() || settings.default_over_color;
  elements['off_color']         = settings.off_color;
	return elements;		
}



