// create a popover object as soon as the page loads

// display a message to the user
function display_notification(message,autofade) {
    var message_div = new Element('div', { className:'pop-over-message' });
    message_div.innerHTML = message;
    popover.display(message_div);
    popover.resize_to_site_width();
    if (autofade) {
      setTimeout("popover.autofade()", 2000);
    }
}


function hide_sIFR() {
  $$('.sIFR-replaced').each( function(elm) {
    elm.down('object.sIFR-flash').hide();
    var span_title = new Element('span', { 'class': 'sIFR_disabled' }).update(elm.down('span.sIFR-alternate').innerHTML);
    elm.appendChild(span_title);
    });
}
    
function return_full_height() {

  var innerHeight = 0;
  if (window.innerHeight) {
    innerHeight = window.innerHeight;
  } else if (document.documentElement && document.documentElement.clientHeight && document.documentElement.clientHeight > 0) {
    innerHeight = document.documentElement.clientHeight;
  } else if (document.body && document.body.clientHeight) {
    innerHeight = document.body.clientHeight;
  }
  if (innerHeight < $('body').getHeight()) {
    innerHeight = $('body').getHeight();
  }
  return innerHeight;
};


function show_sIFR() {
  $$('.sIFR_disabled').each( function(elm) {
    elm.remove();
  });
  $$('.sIFR-replaced').each( function(elm) {
    elm.down('object.sIFR-flash').show();
  });
}

// displays the given element in a popover shell
function pop_over(elm) {
  popover.display(elm);
  popover.fit_to_content();
}
function pop_over_close() {  
  popover.close();
}



var Popover = Class.create(
{

  initialize : function() {
    this.ready = false;
  },
  
  init : function() {
    if (this.ready)
      return;
    
    // things to manipulate
    this.po = $('pop-over');
    this.poc = $('pop-over-content');
    this.pen = $('holding-pen');
    this.blanker = $('page-blanker');

    // store the initial width
    this.initial_width = this.po.getWidth();
    this.minimum_width = this.initial_width;

    // tracking of state
    this.displaying_content = false;
    this.events_attached = false;
    
    // we need to cache the bound redraw call so we can start and stop observing it
    this.bound_redraw = this.redraw.bindAsEventListener(this);
    
    this.ready = true;
  },
  
  // display the given content in the pop_over
  display : function(elm) {
    this.init();  
  
    this.clear_current();
    
    hide_sIFR();
    // insert our element
    this.poc.appendChild(elm);
    elm.show();
    // display the pop-over (otherwise we can't get the dimensions)
    this.po.show();

    if (!this.displaying_content) {
      // we need to position vertically the first time round

      // find the dimensions of the view area
      var page_height = document.viewport.getHeight();

      // find the height of the pop-over
      var elm_height = this.po.getHeight();

      // calculate the pop-over position
      var top = parseInt((page_height-elm_height)/4);
      if (top < 0)
        top = 0;

      // offset for the scroll
      top += document.viewport.getScrollOffsets()[1];

      // position the pop-over accordingly
      this.po.setStyle({ top:top.toString()+'px' });
    }

    // register the state change internally
    this.displaying_content = true;
    this.control_events();
    
    // redraw now just to make sure thing everything is where it should be
    this.redraw();
  },
  
  control_events : function() {
    if (this.displaying_content && !this.events_attached) {
      // need to add the events
      Event.observe(window, 'resize', this.bound_redraw);
      this.events_attached = true;
    } else if (!this.displaying_content && this.events_attached) {
      // need to remove the events
      Event.stopObserving(window, 'resize', this.bound_redraw);
      this.events_attached = false;
    }
  },
  
  display_blanker : function() {
    this.blanker.setStyle({ height:return_full_height()+'px' });
    this.blanker.show();
  },
  
  clear_current : function() {
    // clear out the old pop-over
    this.poc.immediateDescendants().each(function(old_elm){
      old_elm.remove();
      // need to keep the old stuff safe
      this.pen.appendChild(old_elm);
    }.bind(this));
  },
  
  fit_to_content : function() {
    var widest_content = 0;

    // let it spill out as wide as it wants before we start trying to find the max width
    this.po.setStyle({width:'auto'});
    
    // find the widest content in the pop_over
    this.poc.immediateDescendants().each(function(elm){
      if (elm.getWidth() > widest_content)
        widest_content = elm.getWidth();
    }.bind(this));

    // make sure it is at least as big as the minimum limit
    if (this.minimum_width && widest_content < this.minimum_width)
      widest_content = this.minimum_width;

    // fit the pop-over around it
    this.resize_to(widest_content);
  },

  resize_to_site_width : function() {
    this.resize_to(this.initial_width);
  },
  
  resize_to : function(width) {
    // change the size of the inner element
//    this.po.setStyle({width:width + 'px'});

    // recenter the pop-over
    this.center();
  },
  
  center : function() {
    var page_width = document.viewport.getWidth();
    // find the dimensions of the element we're going to display
    var total_width = this.po.getWidth();

    // calculate the pop-over position
    var left = parseInt((page_width-total_width)/2);
    if (left < 0)
      left = 0;

    // position the pop-over accordingly
    this.po.setStyle({ left:left.toString()+'px' });
  },
  
  redraw : function() {
    // make sure the blanker fits
    this.display_blanker();

    // and center the box horizontally
    this.center();
  },
  
  close : function() {
    
    the_pop = this.po;
    the_blanker = this.blanker;
    
//    new Effect.Opacity(the_pop, {
//      duration:0.5, 
//      from:1, 
//      to:0.1, 
//      afterFinish: function() { 
//        the_pop.writeAttribute('style','');
        the_pop.hide();
//      } 
//    });
//    new Effect.Opacity(the_blanker, {
//      duration:0.5, 
//      from:0.7, 
//      to:0.1, 
//      afterFinish: function() { 
//        the_blanker.writeAttribute('style','');
        the_blanker.hide();
        show_sIFR();
//      } 
//    });

    // update the internal state
    this.displaying_content = false;
    // make sure the events get killed off
    this.control_events();
  },
  
  autofade : function() {
    
    the_pop = this.po;
    the_blanker = this.blanker;
    
    new Effect.Opacity(the_pop, {
      duration:0.5, 
      from:1, 
      to:0.1, 
      afterFinish: function() { 
        the_pop.writeAttribute('style','');
        the_pop.hide();
      } 
    });
    new Effect.Opacity(the_blanker, {
      duration:0.5, 
      from:0.7, 
      to:0.1, 
      afterFinish: function() { 
        the_blanker.writeAttribute('style','');
        the_blanker.hide();
        show_sIFR();
      } 
    });

    // update the internal state
    this.displaying_content = false;
    // make sure the events get killed off
    this.control_events();
  }

}
);

popover = new Popover();
