/**
 * Hidden Previews
 *
 * Takes a container with hidden previews and moves it to another container (containerContainer).
 * There, a preview will be shown on mouseover. During this time, any other content of the containerContainer will be hidden.
 * 
 * emjot[mh] 2010
 */
var HiddenPreviews = Class.create( {
	
	/** 
	 *  - name: the name of the HiddenPreview (ID and IDs of sub-elements depend on this)
	 *  - moveContainerToElementID: ID of the element the hidden preview container should initially be moved to (containerContainer)
	 */
	initialize: function(name, moveContainerToElementID) {
    this.name                     = name;
    this.moveContainerToElementID = moveContainerToElementID;
    this.previewContainerID       = this.name + '-container';
    this.hiddenElements           = null;
    this.container                = $(this.previewContainerID);
    this.containerContainer       = $(this.moveContainerToElementID);

    Element.insert(this.containerContainer, Element.remove(this.container));
    this.reset();
    
    hotspots = $$("[class~='" + this.name + "-hotspot']");
    for(var i=0; i<hotspots.length; i++) {
      this.prepareHotspot(hotspots[i]);
    }
	},

  prepareHotspot: function(hotspot) {
        hotspot.observe("mouseover", this.hotspotMouseoverHandler.bind(this));
        hotspot.observe("mouseout", this.hotspotMouseoutHandler.bind(this));
  },

	hotspotMouseoverHandler: function(event) {
		id = event.element().readAttribute('id');
		id.scan(/(.+)-hotspot-(.+)/, 
			function(match){
				hotspotIDPart = match[2];
		});
		this.showPreview(this.name + "-" + hotspotIDPart);
	},

	hotspotMouseoutHandler: function(event) {
		id = event.element().readAttribute('id');
    id.scan(/(.+)-hotspot-(.+)/, 
			function(match){
				hotspotIDPart = match[2];
		});
		this.hidePreview(this.name + "-" + hotspotIDPart);
	},

  showPreview: function(previewID) {
    if (this.hiddenElements != null) {
      this.reset();
    }
    this.hiddenElements = this.containerContainer.childElements().without(this.container);
    this.hiddenElements.each( function(e) { e.hide(); } );
    this.container.show();
    $(previewID).show();
	},

	hidePreview: function(previewID) {
    this.reset();
    $(previewID).hide();
	},

	reset: function() {
    this.container.hide();
    this.containerContainer.childElements().without(this.container).each( function(e) { e.show(); } );
    $$("[class~='" + this.name + "-element']").each( function(e) { e.hide(); } );
    this.hiddenElements = null;
	}
	
});

