/*


Dynamic Application of Functions to DOM
*/
var _debugMode = false;
document.observe('dom:loaded', init);
Event.observe(window, 'load', initAfterImages);

function init () {
  if ($('target-image')) new AttachmentFuImageSwap('target-image', 'unit-thumbs', {fadeDuration: .5, appearDuration: .5});
  
  //if google maps exist
  if ($('gmaps')) Event.observe(window, 'unload', GUnload);
      
  //making ie6 understand css3 selectors
  if (Prototype.Browser.IE && !window.XMLHttpRequest) applyCSS3toIE6();
 
  var wrapper = $('wrapper');
  wrapper.insert(new Element('div', {'id':'top-shadow'}) , {position: 'bottom'});
  wrapper.insert(new Element('div', {'id':'right-shadow'}) , {position: 'bottom'});
  wrapper.insert(new Element('div', {'id':'left-shadow'}) , {position: 'bottom'});
  
  //formState
  if ($('listings-form-wrapper')) {
    $('nextSlide').observe('click', function(e){
      e.stop();
      $('form-slide1').hide();
      $('form-slide2').show();
      $('form-nav').descendants().invoke('toggleClassName', 'active');
    });
    $('form-nav').observe('click', function(e) {
      e.stop();
      if (e.element().match('ul') || e.element().hasClassName('active')) return;
      if (e.element().match('a')) e.element().blur();
      $('form-slide1').toggle();
      $('form-slide2').toggle();
      $('form-nav').descendants().invoke('toggleClassName', 'active');
    });
  }
  
  $$('.show-modal').compact().invoke('observe', 'click', showModalWindow);
  window.hideModalWindow = function(e){
    e.stop();
    $('modal-shell', 'modal-backdrop').invoke('hide');
    toggleFormElementsNotInModalWindow();
  }
  if ($('close-modal')) {
    $('close-modal').observe('click', hideModalWindow);
    $('modal-backdrop').observe('click', hideModalWindow);
  }
  
  if ($('listings-choice')) {
    var listingChoice = $('listings-choice');
    var eventType = (Prototype.Browser.IE) ? 'click' : 'change';
    listingChoice.observe(eventType, function(e) {
      $('modal-image-target').src = listings_object[e.element().value.gsub(' ','_')];
    });
  }
  
  //only show coco design info on homepage
  if (location.pathname == '/') $('cocoDesign').up().show();
  
  //validating modal contact form
  if ($('modal-content')) {
    var errors = false;
    $('modal-content').select('input[type="submit"]')[0].observe('click', function(e) {
      var name = $('contact_handler_name');
      var email = $('contact_handler_email');
      if ($F(name).strip().empty()) {
        name.adjacent('.error-bubble')[0].show();
        e.stop();
      }
      if ($F(email).strip().empty()) {
        email.adjacent('.error-bubble')[0].show();
        e.stop();
      }
      else if (!$F(email).match(/^([a-zA-Z0-9_\.\-])+\@(([a-zA-Z0-9\-])+\.)+([a-zA-Z0-9]{2,4})+$/)) {
        email.adjacent('.error-bubble')[0].show();
        e.stop();
      }
    });
    $('contact_handler_name').observe('click', clearErrors);
    $('contact_handler_email').observe('click', clearErrors);
  }
}

function initAfterImages () {
  document.fire('window:loaded');
  //make sure the container for the hotel thumbnails is the right size
  var thumb_container = $('unit-thumbs');
  if (thumb_container) thumb_container.adjustWidth();
  var columns = [$('primary'), $('secondary')];
  if (columns.compact().length > 1) columns.equalizeHeights();
}

function clearErrors(e) {
  if (e.element().adjacent('.error-bubble')[0]) e.element().adjacent('.error-bubble')[0].hide();
}

function applyCSS3toIE6() {
  $$(
    '#modal-content .left input[type="text"]',
    '#wrapper #primary form .top input[type="text"]'
  ).compact().flatten().invoke('addClassName', 'text');
  $$('#primary form input[type="submit"]', ' #modal-content form input[type="submit"]').invoke('addClassName', 'submit');
  $$(
    'div > h1:first-child', 
    'div > h2:first-child', 
    'div > h3:first-child',
    'div > h4:first-child', 
    'div > h5:first-child',
    'div > h6:first-child'
  ).compact().invoke('setStyle', 'margin-top: 0');
  
  var backdrop = $('modal-backdrop');
  if (backdrop) {
    var bodyHeight = $(document.body).getHeight();
    var backdropHeight =  (document.viewport.getHeight() > bodyHeight) ? document.viewport.getHeight() : bodyHeight;
    backdrop.setStyle({height: backdropHeight + 'px'});    
  }
  
  // make pngs transparent
  [$$('#view-listings-callout'), $('close-modal'), $('mailbox'), $('contact_handler_submit')].compact().flatten().invoke('pngHack'); 
  
  // sliding doors hover
  if ($('form-nav')) {
      $('form-nav').slidingDoorHover('hover');
      if ($$('.form-block + .form-block')[0]) $$('.form-block + .form-block')[0].setStyle({left: '250px'});
      if ($$('.form-block + .form-block + .form-block')[0]) $$('.form-block + .form-block + .form-block')[0].setStyle({left: '410px'});
      if ($$('.form-question + .form-question')[0]) $$('.form-question + .form-question')[0].setStyle({left: '460px'});
    }
  if ($$('table')) $$('table tr td p:first-child').invoke('setStyle', {marginTop: '0'});
  if ($('scroll')) 
    if ($('scroll').getHeight() > 600) $('scroll').setStyle({'height': '600px'});
}

function showModalWindow(e) {
  e.stop();
  e.element().blur();
  
  //make sure that the listing that was clicked on shows up in the combo box
  var selectedListing = e.element().readAttribute('href').slice(1);
  $('listings-choice').down('option[value="'+selectedListing.gsub('_',' ')+'"]').selected = true;
  $('modal-image-target').src = listings_object[selectedListing];
  $('modal-shell', 'modal-backdrop').invoke('show');
  // if ie, hide form elements
  toggleFormElementsNotInModalWindow();
}

window.formElementsVisibility = true;
function toggleFormElementsNotInModalWindow () {
  if (LTE_IE_6) {
    var visibility = (window.formElementsVisibility)? 'visibility: hidden':'visibility: visible';
    Try.these(function(){
      $$('form').without($$('#modal-shell form').first()).invoke('getElements').flatten().invoke('setStyle', visibility);
    });
    window.formElementsVisibility = !window.formElementsVisibility;
  }
}

function plotPoints (params) {
  map.updatePoints(params.evalJSON());
}

function clearPoints() {
  map.clearPoints();
}


Element.addMethods({
  adjustWidth: function(el) {
    var totalWidth = el.childElements().inject(0, function(acc, el) {
      return acc + el.getWidth() + 
        Number(el.getStyle('margin-right').gsub('px', '')) +
        Number(el.getStyle('margin-left').gsub('px', ''));
    });
    el.setStyle({width: totalWidth + 'px'});
  }
});