/*
 * JavaScript for all pages (requires Mootools v1.2)
 *
 * Original Author: Chris Martin, Webexpectations.com
 * Creation Date: 2008/06/04
 *
 */

/* - Generic JavaScript (applied to all pages) - */

function attachExternals() {
  var extLinks = $$('a.external');
  extLinks.each(function(extLink, i){
    extLink.setProperty('target','_blank');
  });
}

function attachPopups() {
  var popups = $$('a.popup');
  popups.each(function(popup, i) {
    if (popuprel = popup.getProperty('rel')) {
      var dimensions = popuprel.split('x');
      var width = parseInt(dimensions[0]);
      var height = parseInt(dimensions[1]);
      
      // Add extra width for the IEs.
      if (Browser.Engine.trident) width += 19;
    }
    else {
      var width = 640;
      var height = 480;
    }
    
    popup.addEvent('click', function() {
      var newwindow = window.open(popup.href,'_blank','width='+width+',height='+height+',resizable=yes,scrollbars=yes,toolbar=no,status=no,directories=no');
      if (window.focus) newwindow.focus();
      return false;
    });
  });
}

function hideSelects() {
  // Hide first select field on choose location page to prevent layering issues in IE.
  if (($$('div.chooselocation')[0]!=null)&&($$('select')[0]!=null)) $$('select')[0].setStyle('visibility','hidden');
}
function showSelects() {
  // Show all select fields on a page.
  var selectfields = $$('select');
  selectfields.each(function(selectfield,i){
    selectfield.setStyle('visibility','visible');
  });
}

function initSubNav () {
  var dropdowns = $$('ul#subnavbar li ul');
  
  dropdowns.each(function (dropdown,i) {
    // Add class to the parent for styling.
    var parentli = dropdown.getParent();
    parentli.addClass('dropdown');
    
    // Also wrap the anchor text in a span for styling.
    var parentlia = parentli.getChildren('a');
    parentlia.each(function (lia,i){
      var span = new Element('span');
      span.innerHTML = lia.innerHTML;
      lia.innerHTML = '';
      span.inject(lia);
    });

    // Create the new markup we'll need to achieve the hover effect.
    var subnavsub = new Element('div', {'class': 'subnavsub'});
    var subnavsubtop = new Element('div', {'class': 'top'});
    var subnavsubbottom = new Element('div', {'class': 'bottom'});
    var subnavsubleft = new Element('div', {'class': 'left'});
    var subnavsubright = new Element('div', {'class': 'right'});
    
    // Wrap the required styling markup around the ul.
    subnavsub.inject(dropdown,'before');
    subnavsub.grab(dropdown);
    subnavsubtop.inject(subnavsub,'top');
    subnavsubbottom.inject(subnavsub,'bottom');
    subnavsubleft.inject(subnavsubbottom,'top');
    subnavsubright.inject(subnavsubbottom,'bottom');
    
    // Add the menu mouseover and mouseout.
    parentli.addEvent('mouseenter',function(){
      parentli.addClass('hover');
      
      if (parentli.getNext().hasClass('selected')) {
        parentli.getNext().removeClass('selected');
        parentli.getNext().addClass('wasselected');
      }
      if (parentli.getNext().getNext().hasClass('selected')) {
        parentli.getNext().getNext().removeClass('selected');
        parentli.getNext().getNext().addClass('wasselected');
      }
      
      if(document.all) hideSelects();
    });
    parentli.addEvent('mouseleave',function(){
      parentli.removeClass('hover');
      
      if (parentli.getNext().hasClass('wasselected')) {
        parentli.getNext().removeClass('wasselected');
        parentli.getNext().addClass('selected');
      }
      if (parentli.getNext().getNext().hasClass('wasselected')) {
        parentli.getNext().getNext().removeClass('wasselected');
        parentli.getNext().getNext().addClass('selected');
      }
      
      if(document.all) showSelects();
    });
  });
}

function attachDatePickers () {
  var datefields = $$('input.date');
  datefields.each(function(datefield, i) {
      if (datefield.getProperty('value') == '') datefield.removeClass('placeholder');
      if (datefield.getProperty('value') == 'dd/mm/yyyy') datefield.addClass('placeholder');

      // Auto erase / fill the default dd/mm/yyyy.
      datefield.addEvent('focus', function() {
          if (datefield.getProperty('value') == 'dd/mm/yyyy') {
              datefield.removeClass('placeholder');
              datefield.setProperty('value', '');
          }
      });
      datefield.addEvent('blur', function() {
          if (datefield.getProperty('value') == '' || datefield.getProperty('value') == 'dd/mm/yyyy') {
              datefield.addClass('placeholder');
              datefield.setProperty('value', 'dd/mm/yyyy');
          }
      });

      // Create the anchor that will trigger the date picker.
      // AP 20090210 Pull the alt attribute from the input box to pass through config options from .Net
      var picker = new Element('a', {
          'class': 'datepicker'
      });

      picker.alt = datefield.alt;

      // Inject it after the input.
      picker.inject(datefield, 'after');

      // Create the datepicker.
      new DatePicker(picker);
  });
}

function attachTabsets() {
  var tabsets = $$('.tabset');
  tabsets.each(function(tabset,i){
    tabset.setProperty('class','activetabset');
    var ul = new Element('ul', {
      'class': 'tabs'
    });
    ul.inject(tabset,'top');
    
    var sections = tabset.getElements('.section');
    var headings = sections.getPrevious();
    
    headings.each(function(heading,j){
      var li = new Element('li');
      heading.inject(li);
      li.inject(ul,'bottom');
      
      heading.addEvent('click',function(){
        tabset.getElements('.current').each(function(element){element.removeClass('current');});
        heading.getParent().addClass('current');
        sections[j].addClass('current');
      });
    });
    
    sections[0].addClass('current');
    headings[0].getParent().addClass('current');
  });
}

/* - Page specific JavaScript - */

function initOverview () {

//keep accordian listed before spinning globe as if spinning globe isn't used by a country e.g US
//the accordian won't run (if globe div cannot be found on the page)

  // Accordion for Virtual Office product range.
  var myAccordion = new Accordion($$('ul#productrange li h3'), $$('ul#productrange li div'), {
    display: false,
    alwaysHide: true,
    opacity: false,
    onActive: function(toggler, element){
  		toggler.addClass('open');
  	},
  	onBackground: function(toggler, element){
  		toggler.removeClass('open');
  	}
  });

  // Spinning globe flash.
 var so = new SWFObject("../../../_global_flash/virtualoffices/reg_vo-sm-our_locations_globe.swf", "movieobject", "92", "92", "8", "#ffffff");
 so.addParam("wmode","transparent");
 so.write("globe");

}

function initBasket () {
  // Add show map links.
  var maplinks = $$('table#basket tr td.location p.map');
  maplinks.each(function(maplink,i){
    maplink.setStyle('display','block');
  });
  
  // Remove input buttons for each row.
  var buttons = $$('table#basket tr td.product form input.button');
  buttons.each(function(button,i){
    button.destroy();
  });
  
  // Show/hide special offers.
  var selectboxes = $$('table#basket tr td.product form select.length');
  selectboxes.each(function(selectbox,i){
    var offer = selectbox.getParent().getNext();
    if (selectbox.getProperty('value') == '12') offer.setStyle('display','block');
    else offer.setStyle('display','none');
    selectbox.addEvent('change',function(){
      if (selectbox.getProperty('value') == '12') offer.setStyle('display','block');
      else offer.setStyle('display','none');
    });
  });
}

function initChooseLocation () {
  // Add show map links.
  var maplinks = $$('p.map');
  maplinks.each(function(maplink,i){
    maplink.setStyle('display','block');
  });
  
  // Hide update button for currency.
  var buttons = $$('div.currency input.button');
  buttons.each(function(button,i){
    button.destroy();
  });

  // Wire up postbacks
  $$('div.currency select').each(function(dd) {
    dd.addEvent("change",function(){
      dd.getParent('form').submit();
    });
  });
}

function initTop10 () {
  // Attach sliders.
  togglers = $$('div.info h3');
  sliders = $$('div.buyme');
  
  sliders.each(function(slider,i){
    
    var theslider = new Fx.Slide(slider, {duration:500});
    theslider.hide();
    
    var toggler = slider.getParent().getPrevious().getElement('h3');
    toggler.addClass('toggler');
    
    toggler.addEvent('click',function(){
      theslider.toggle();
    });
    toggler.addEvent('mouseenter',function(){
      toggler.addClass('hover');
    });
    toggler.addEvent('mouseleave',function(){
      toggler.removeClass('hover');
    });
    theslider.addEvent('onComplete',function(){
      toggler.toggleClass('open');
    });
    
    
    
  });
}

window.addEvent('domready', function() {
  attachExternals(); // Make external links open in a new window.
  attachPopups(); // Attach accessible popups.
  initSubNav(); // Enable subnav drop down navigation.
  attachDatePickers(); // Attach date pickers.
  attachTabsets(); // Attach tabbed sections.
  new SmoothScroll; // Enable smooth scrolling for anchors.
});

function wopen(url, name, width, height){
	if (!width) width = 800;
	if (!height) height = 560;
	newWindow = window.open(url, name, "location=1,status=1,scrollbars=0, width=" +width+ ", height=" +height+ "");
	newWindow.focus();
}

function directionopen(url, name, width, height){
	if (!width) width = 800;
	if (!height) height = 560;
	newWindow = window.open(url, name, "location=0,status=0,scrollbars=1, width=" +width+ ", height=" +height+ "");
	newWindow.focus();
}