var mouseX = 0;
var mouseY = 0;

function homepageEffects() {
  var elemArray
  var count;
  var i;
  var palletteimg;
  var inArea = false;

  // display more/less buttons on what's new
  showMoreLessButtons();

  // get all elements with class="handle"
  elemArray = $$('.handle');
  count = elemArray.length;
  // add mousedown events to add class="pressed" to mouse-clicked handles
  for (i = 0; i < count; i++) {
    elemArray[i].observe('mousedown',eventHandleMouseDown);
  }

  // deal with case where mouse-clicked handle wasn't dragged anywhere
  $('columngroup').observe('mouseup',eventColumnGroupMouseUp);

  // get pallette image element
  palletteimg = $('pallette-img');
  // restore pallete colours when none selected
  palletteimg.onmouseover = function() {
    if (!inArea)
      palletteimg.writeAttribute('src','images/hp-pallette-all.gif');
  }

  // get all area elements
  elemArray = $$('area');
  count = elemArray.length;
  // add mouse events to highlight areas on hover
  for (i = 0; i < count; i++) {
    elemArray[i].onmouseover = function() {
      togglePalletteAreaOpacity(this, palletteimg);
      inArea = true;
    }
    elemArray[i].onmouseout = function() {
      palletteimg.writeAttribute('src','images/hp-pallette-none.gif');
      inArea = false;
    }
    elemArray[i].onclick = function() {
      toggleSiteTheme(this);
      return false;
    }
  }
}
function eventHandleMouseDown(e) {
  // note mouse co-ordinates on mousedown on draggable box handle
  // add class="pressed" to the handle
  this.up('div').addClassName('pressed');
  mouseX = Event.pointerX(e);
  mouseY = Event.pointerY(e);
}
function eventColumnGroupMouseUp(e) {
  // if mouse co-ordinates on mouseup are the same, assume box
  // wasn't dragged and remove class="pressed"
  var x = Event.pointerX(e);
  var y = Event.pointerY(e);
  if (x == mouseX && y == mouseY)
    resetBoxStyles();
}
function resetBoxStyles() {
  var elemArray = $$('.pressed');
  var count = elemArray.length;
  for (var i = 0; i < count; i++) {
    elemArray[i].removeClassName('pressed');
  }
  saveBoxesPosition();
}
function saveBoxesPosition() {
  new Ajax.Request('/includes/homepage_boxesposition_save.asp',
  {
    method:'post',
    parameters: {
      column1:  Sortable.serialize('column1'),
      column2:  Sortable.serialize('column2'),
      column3:  Sortable.serialize('column3')
    },
    onSuccess: function(transport){
      //var response = transport.responseText || "no response text";
      ///alert("Success! \n\n" + response);
    },
    onFailure: function(){ alert('Something went wrong...') }
  });
}
function togglePalletteAreaOpacity(elem, palletteimg) {
  var newpallettesrc = 'images/hp-pallette-' + elem.identify().toString() + '.gif';
  palletteimg.writeAttribute('src',newpallettesrc);
}
function toggleSiteTheme(elem) {
  var elemArray = $$('body')
  var elemId = elem.identify().toString();
  // remove and previously-set classes on the body
  elemArray[0].writeAttribute('class','');
  // add new class
  elemArray[0].addClassName(elemId);
  // set cookie with this value
  var cookie_date = new Date();  // current date & time
  cookie_date.setDate(cookie_date.getDate() + 365);
  document.cookie = "Theme=" + elemId + ";expires=" + cookie_date.toGMTString();
}
function showMoreLessButtons() {
  var elemArray
  var count;
  var i;
  // get all elements with class="more"
  elemArray = $$('.more');
  count = elemArray.length;
  // add click/keypress events
  for (i = 0; i < count; i++) {
    elemArray[i].setStyle({display: 'block'});
    elemArray[i].onclick = function() {
      showMore(this);
      return false;
    }
  }
  // get all elements with class="less"
  elemArray = $$('.less');
  count = elemArray.length;
  // add click/keypress events
  for (i = 0; i < count; i++) {
    elemArray[i].setStyle({display: 'block'});
    elemArray[i].onclick = function() {
      showLess(this);
      return false;
    }
  }
}
function showMore(elem) {
  var elemArray = $('recentupdates').childElements();
  var count = elemArray.length;
  var i;
  // loop forward/down through the list. Show the first hidden item.
  for (i = 0; i < count; i++) {
    if (elemArray[i].hasClassName('hidden')) {
      elemArray[i].removeClassName('hidden');

      // show ul if all list items were hidden
      if (i == 0) {
        $('recentupdates').removeClassName('hidden');
      }

      // set cookie with this value
      var cookie_date = new Date();  // current date & time
      cookie_date.setDate(cookie_date.getDate() + 365);
      document.cookie = "WhatsnewHiddenIndex=" + (i+1) + ";expires=" + cookie_date.toGMTString();
      //alert("item shown at index = " + i + ". Cookie (WhatsnewHiddenIndex) set to " + (i+1));

      return;
    }
  }
  alert('All items are already shown');
}
function showLess(elem) {
  var elemArray = $('recentupdates').childElements();
  var count = elemArray.length;
  var i;
  // loop backward/up through the list. Hide the first visible item.
  for (i = count-1; i >= 0; i--) {
    if (!(elemArray[i].hasClassName('hidden'))) {
      elemArray[i].addClassName('hidden');

      // hide ul if all list items are hidden
      if (i == 0) {
        $('recentupdates').addClassName('hidden');
      }

      // set cookie with this value
      var cookie_date = new Date();  // current date & time
      cookie_date.setDate(cookie_date.getDate() + 365);
      document.cookie = "WhatsnewHiddenIndex=" + i + ";expires=" + cookie_date.toGMTString();
      //alert("item hidden at index = " + i + ". Cookie (WhatsnewHiddenIndex) set to " + i);

      return;
    }
  }
  alert('All items are already hidden');
}
window.onload = function() {
  homepageEffects();
}
