var suburbArray = new Array();
var napoiMiniArray = new Array();

function Init(){
  InitMapControls();
  InitCabinetisation();
  InitNAPOIMini();
  FixImages();
  if(typeof correctPNG == 'function') {
    correctPNG();
  }
}

/////////////////////////////////////////////////////////////////////////////////////////////////////////////////////
// Map
/////////////////////////////////////////////////////////////////////////////////////////////////////////////////////
function InitMapControls(){
  var btnNorth = $('btnNorth');
  var btnSouth = $('btnSouth');
  var map = $('mapNorth');
  
  if(btnNorth && btnSouth && map){
    btnNorth.onclick = function(){ map.fade('in'); return false; }
    btnSouth.onclick = function(){ map.fade('out'); return false; }
  }
}

/////////////////////////////////////////////////////////////////////////////////////////////////////////////////////
// NAPOI Mini
/////////////////////////////////////////////////////////////////////////////////////////////////////////////////////

function InitNAPOIMini(){
  var submitbutton = $('napoi-mini-submit');
  var exchanges = $('napoi-mini-exchange');
  var allNode = $('radio-all');
  var completedNode = $('radio-completed');
  
  if(submitbutton && exchanges && completedNode && allNode){
    exchanges.onchange = function(){ ShowExchange(); }
    completedNode.onchange = function(){ ToggleExchanges(true); }
    allNode.onchange = function(){ ToggleExchanges(false); }
    
    $$('select#napoi-mini-exchange option').each(function(el){

      var item = new Object();
      item['value'] = el.value;
      item['date'] = el.className;

      napoiMiniArray[napoiMiniArray.length] = item;
    });
    
    submitbutton.destroy();    
  }
}

function ToggleExchanges(mode){
  var selectNode = $('napoi-mini-exchange');

  $$('select#napoi-mini-exchange option').each(function(el){
    el.destroy();
  });
  
  napoiMiniArray.each(function(el){
    var option = new Element('option', {
      'value': el['value'],
      'text': el['value'],
      'class': el['date']
    });

    if(!mode || el['date'] != ''){
      option.injectInside(selectNode);
    }
  });
}

function ShowExchange(mode){
  var selectNode = $('napoi-mini-exchange');
  var selectedNode = selectNode[selectNode.selectedIndex];
  var results = $('napoi-mini-results');
  results.style.display = 'block';
  
  if(selectedNode.value != ''){
    if(selectedNode.className != ''){
      results.set('html','Work has been completed for the <strong>' + selectedNode.value + '</strong> exchange in <strong>' + selectedNode.className + '</strong>.');
    } else {
      results.set('html','Work has not yet been completed for the <strong>' + selectedNode.value + '</strong> exchange.');
    }
  }
}


/////////////////////////////////////////////////////////////////////////////////////////////////////////////////////
// Suburbs
/////////////////////////////////////////////////////////////////////////////////////////////////////////////////////

function InitCabinetisation(){
  var selectRegion = $('cabinetisation-region');
  var selectSuburb = $('cabinetisation-suburb');
  var selectButton = $('cabinetisation-submit');
  
  if(selectRegion && selectSuburb && selectButton){
    selectRegion.style.display = 'inline';
    selectButton.style.display = 'none';
    selectRegion.onchange = function(){ HideSuburbs(); }
    selectSuburb.onchange = function(){ ShowValue(); }

    $$('select#cabinetisation-suburb option').each(function(el){
      if(!suburbArray[el.className]){
        suburbArray[el.className] = new Array();
      }
      var tempArray = suburbArray[el.className];

      var item = new Object();
      item['value'] = el.value;
      item['text'] = el.text;
      item['date'] = el.id;

      tempArray[tempArray.length] = item;

      suburbArray[el.className] = tempArray;

      if(el.className != ''){
        el.destroy();
      }
    });
    
    $$('select#cabinetisation-suburb optgroup').each(function(el){
      el.destroy();
    });
  }
}

function HideSuburbs(){
  var selectRegion = $('cabinetisation-region');
  var selectSuburb = $('cabinetisation-suburb');
    
  if(selectRegion && selectSuburb){
    $$('select#cabinetisation-suburb option', 'select#cabinetisation-suburb optgroup').each(function(el){
      el.destroy();
    });
    
    var subs = suburbArray[selectRegion.value];
    
    for(var i = 0; i < subs.length; i++){
    
      var option = new Element('option', {
        'value': subs[i]['value'],
        'text': subs[i]['text'],
        'date': subs[i]['date']
      });

      option.injectInside(selectSuburb);
    }

    ShowValue();
  }
}

function ShowValue(){
  var selectRegion = $('cabinetisation-region');
  var selectSuburb = $('cabinetisation-suburb');
  var results = $('cabinetisation-results');

  if(selectRegion && selectSuburb && results){
    if(selectSuburb.value == ''){
      results.style.display = 'none';
    } else {
      var date = '';
      var subs = suburbArray[selectRegion.value];

      for(var i = 0; i < subs.length; i++){
        if(subs[i]['value'] == selectSuburb.value){
          date = subs[i]['date'];
        }
      }

      results.style.display = 'block';
      results.set('html','Work is scheduled to begin in <strong>' + selectSuburb.value + ', ' + selectRegion.value + '</strong> in <strong>' + date + '</strong>');
    }
  }
}

/////////////////////////////////////////////////////////////////////////////////////////////////////////////////////
// Indexer
/////////////////////////////////////////////////////////////////////////////////////////////////////////////////////
function UpdateIndexer(pageId, indexerId, pageNumber){
  var url = 'default.csf?cid=' + pageId + '&indexer=' + indexerId + '&page=' + pageNumber;

  new Ajax(url, {
    method: 'get',
    update: $('indexer-' + indexerId)
  }).request();
}

/////////////////////////////////////////////////////////////////////////////////////////////////////////////////////
// FixImages
/////////////////////////////////////////////////////////////////////////////////////////////////////////////////////

function FixImages(){
  var classArray = Array('imageRight','imageLeft');

  for (var i = 0; i < classArray.length; i++){
    var divNodes = getElementsByClass(classArray[i],null,'div')
    for (var j = 0; j < divNodes.length; j++){
      var divNode = divNodes[j];
      var divWidth = '100px';

      var imageNodes = divNode.getElementsByTagName('img');
      var captionNode = getElementsByClass('imageLabel',divNodes[j],'div')

      for ( k = 0; k < imageNodes.length; k++){
        if (parseInt(imageNodes[k].width) > parseInt(divWidth)){
          divWidth = imageNodes[k].width;
        }
      }
      if (captionNode.length > 0){
        captionNode[0].style.width = (8 + parseInt(divWidth)) + 'px';
      }
    }
  }
}

function getElementsByClass(searchClass,node,tag) {
  var classElements = new Array();
  if ( node == null ){
    node = document;
  }

  if ( tag == null ){
    tag = '*';
  }

  var els = node.getElementsByTagName(tag);
  var elsLen = els.length;
  var pattern = new RegExp("(^|\\s)"+searchClass+"(\\s|$)");

  for (i = 0, j = 0; i < elsLen; i++) {
    if ( pattern.test(els[i].className) ) {
      classElements[j] = els[i];
      j++;
    }
  }
  return classElements;
}

/////////////////////////////////////////////////////////////////////////////////////////////////////////////////////
// Init
/////////////////////////////////////////////////////////////////////////////////////////////////////////////////////

window.onload = Init;