/*
  CaptionDisplay Class
  Written by Stewart Laufer
  copyright ©2008 tectonyc

  TODO:
  - add a descriptive how-to for using this class
  √ fix display issues with hovering over captions (problem stems from how CategorySlide works)
  - fix styling of captions (weird blue underline)
  - add a z-index to captions
*/
var CaptionDisplay = new Class({
  options: {
    element_selector: null,
    container_class: 'caption',
    container_type: 'span',
    caption_attribute: 'title',
    caption_width: null
  },
  initialize:function(options){
    this.setOptions(options);
    this.elements = $$(this.options.element_selector);
    this.container_class = this.options.container_class;
    this.container_type = this.options.container_type;
    this.caption_attribute = this.options.caption_attribute;
    this.caption_width = this.options.caption_width;
    this.setup_captions();
    this.setup_captions.bind(this);
    this.display_caption.bind(this);
    this.hide_caption.bind(this);
    this.hide_captions.bind(this);
  },
  setup_captions:function(){
    this.elements.each(function(element){
      var caption = new Element(this.container_type, {
        'class': this.container_class,
        'styles': {
          'display': 'none',
          'width': this.caption_width,
          'z-index': '100'
        }
      });
      var caption_text = new Element('span', {
        'class': 'caption_text',
        'styles': {
          'display': 'block'
        },
        'html': element.get(this.caption_attribute)
      });
      caption_text.inject(caption);
      element.set(this.caption_attribute,'');
      element.caption = caption;
      caption.inject(element);
      
      //Rounded Edges
      var myBorder = RUZEE.ShadedBorder.create({ corner:10 });
      myBorder.render(caption);
      
    },this);
  },
  display_caption:function(element){
    var caption = element.caption;
    caption.setStyle('display','block');
  },  
  visible_caption:function(element){
    var caption = element.caption;
    caption.setStyle('visibility','visible');
  },
  invisible_caption:function(element){
    var caption = element.caption;
    caption.setStyle('visibility','hidden');
  },
  hide_caption:function(element){
    var caption = element.caption;
    caption.setStyle('display','none');
  },
  hide_captions:function(element){
    if ($defined(element)){
      this.hide_caption(element);
    }
  }
});

CaptionDisplay.implement(new Options, new Events);