var Works = function(selector) {
  
  this.selected = null;
  this.loaded = [0];
  
  this.init = function(selector) {
    var t = this;
    $(selector).each(function(){
      var work = $(this);
      work.append(
        $('<div class="entry-content"></div>').append('<div class="entry-content-loaded"></div>')
                                              .append($('<a class="closeButton" href="#">close</a>'))
                                              .hide()
      ).mouseover(function(){
        if (!work.hasClass('expanded')) work.addClass('hover');
      }).mouseout(function(){
        work.removeClass('hover');
      })
      
      var a = work.find('header a');
      var id = work.attr('id').replace('post-', '');
      
      a.click(function(){
    		if($.inArray(id, loaded) > 0) {
    		  t.closeselected();
    		  selected = work;
    		  t.openselected();
    		} else {
    		  var content = work.find('.entry-content-loaded');
    		  content.load('/ajax-handler/?id=' + id, function() {
    		    t.closeselected();
      		  selected = work;
      		  loaded.push(id);
      		  t.openselected();
      		});
    		}
    		
    		return false;
		  })
		})
  }
  
  this.openselected = function() {
    var t = this;
    selected.find('.entry-content').show();
    selected.find('header.entry-title').hide();
    selected.addClass('expanded');
    
    selected.find('.closeButton').click(function() {
      t.closeselected();
      return false;
    })
  }
  
  this.closeselected = function() {
    if(selected) {
      selected.find('.entry-content').hide();
      selected.find('header.entry-title').show();
      selected.removeClass('expanded');

      selected.find('.closeButton').unbind('click');
    }
  }
  
  this.init(selector);
}

$(document).ready(function(){
  var works = Works('.work');
})