var active_testimonial = null;
var dropDown_status = [];
var curr_category_id = '-1';
var curr_sub_category_id = '-1';
var curr_page_id = '0';
var curr_image_id = '0';
var param_load = false;
var categories = [];
var subCategories = [];
var images = [];
var slideTime = 4000;
var slideShowInterval = null;

function toggleDropDown(name) {
  if (dropDown_status[name]) {
    $(name+'_drop_down').setStyle('display', 'none');
    dropDown_status[name] = 0;
  }
  else {
    var inputDiv = $(name+'_input');
    var l = inputDiv.getLeft();
    var t = inputDiv.getTop() + inputDiv.offsetHeight;
    $(name+'_drop_down').setStyles({'display':'block','left': l+'px','top':t+'px'});
    dropDown_status = [];
    dropDown_status[name] = 1;
  }
}

function selectOption(name, index, value, display) {
  var form_obj = $('categorySelect').getElement('form');
  $(name+'_input').setHTML(value);
  if (display != false) { toggleDropDown(name); }
  if (name == 'category_id' && (param_load || curr_category_id != index)) {
    curr_category_id = index;
    loadSubCategories();
  }
  else if (name == 'sub_category_id' && curr_sub_category_id != index) {
    curr_sub_category_id = index;
    curr_page_id = 0;
    loadImages();
  }
}

window.addEvent('domready', function() {
  var el = $('categorySelect_select').getElementsByTagName('select')[0];
  dropDown_status['category_id'] = 0;
  var inputDiv = new Element('div', {'id': 'category_id_input','class':'input_div','styles': {'width':'200px'}}).setHTML('Select Category');
  var imageButton = new Element('img', {'id': 'category_id_image','src': base_url+'images/ideasgallery/dropdown.gif','styles':{'float':'left','cursor':'pointer'},'width':17,'height':21});
  inputDiv.addEvent('click', function(ev) {
    ev = new Event(ev).stop();
    toggleDropDown('category_id');
  });
  imageButton.addEvent('click', function(ev) {
    ev = new Event(ev).stop();
    toggleDropDown('category_id');
  });

  inputDiv.injectAfter($('categorySelect_select'));
  imageButton.injectAfter(inputDiv);

  var dropDown = new Element('ul', {'id': 'category_id_drop_down', 'styles':{'display':'none','position':'absolute','width':'210px'}});
  for (var i = 0; i < el.options.length; i++) {
    var dropDownOption = new Element('li').setHTML(el.options[i].text);
    categories[i] = new Array(el.options[i].value, el.options[i].text);
    subCategories[i] = new Array();
    images[i] = new Array();
    dropDownOption.addEvent('click', function(ev) {
      ev = new Event(ev).stop();
      var found = false;
      var j = 0;
      var p = this.getParent();
      while (!found && j < el.options.length) {
        if (this == p.childNodes[j]) {
          found = true;
        }
        else {
          j++;
        }
      }
      selectOption('category_id', j, el.options[j].text);
    });
    dropDownOption.addEvent('mouseenter', function() {
      this.setStyles({'background':'#db0e21','color':'#FFF'});
    });
    dropDownOption.addEvent('mouseleave', function() {
      this.setStyles({'background':'white','color':'#000'})
    });
    dropDownOption.injectInside(dropDown);
  }
  dropDown.injectAfter(imageButton);
  dropDown.setStyle('display','none');
  $('categorySelect_select').setStyle('display','none');
  if ($('subCategorySelect_select')) {
    $('subCategorySelect_select').setStyle('display', 'none');
  }

  $('categorySelect').getElements('input[type=submit]').each(function(el) {
    el.setStyle('display', 'none');
  });

  var doc_body = $(document.body);
  doc_body.addEvent('click', function(ev) {
    if ($('category_id_drop_down')) { $('category_id_drop_down').setStyle('display', 'none'); }
    if ($('sub_category_id_drop_down')) { $('sub_category_id_drop_down').setStyle('display', 'none'); }
    dropDown_status = [];
  })

  var idx = categories.length;
  images[idx] = new Array();
  images[idx][0] = new Array();
  images[idx][0]['num_pages'] = new Array();
  images[idx][0]['filenames'] = new Array();
  subCategories[idx] = new Array();
  categories[idx] = new Array(-1, 'Selected Examples');
  if (actual_category_id != 0 && actual_sub_category_id >= 0) {
    param_load = true;
    var i = 0;
    var found = false;
    while (!found && i < categories.length) {
      if (categories[i][0] == actual_category_id) {
        found = true;
      }
      else {
        i++;
      }
    }
    if (found) {
      selectOption('category_id', i, categories[i][1], false);
    }
  }
  else {
    curr_category_id = -1;
    curr_sub_category_id = -1;
  }
});

function changeCategory() {
  if (!param_load) {
    curr_sub_category_id = -1;
    clearImage();
    var thumbFrame = clearThumbs();
    thumbFrame.injectAfter($('thumbFrameLeft'));
    $('imageViewerLeft').getElement('a').addClass('inactive');
    $('imageViewerRight').getElement('a').addClass('inactive');
    $('thumbFrameLeft').getElement('a').addClass('inactive');
    $('thumbFrameRight').getElement('a').addClass('inactive');
  }
  if (curr_category_id != categories.length-1) {
    if (!$('sub_category_id_input')) {
      var textDiv = new Element('div', {'styles': {'float':'left','margin-top':'5px','margin-right':'10px'}}).setHTML('Step 2')
      var inputDiv = new Element('div', {'id': 'sub_category_id_input','class':'input_div','styles': {'width':'200px'}});
      var imageButton = new Element('img', {'id': 'sub_category_id_image','src': base_url+'images/ideasgallery/dropdown.gif','styles':{'float':'left','cursor':'pointer'},'width':17,'height':21});
      inputDiv.addEvent('click', function(ev) {
        ev = new Event(ev).stop();
        toggleDropDown('sub_category_id');
      });
      imageButton.addEvent('click', function(ev) {
        ev = new Event(ev).stop();
        toggleDropDown('sub_category_id');
      });
      textDiv.injectAfter($('category_id_drop_down').nextSibling);
      inputDiv.injectAfter(textDiv);
      imageButton.injectAfter(inputDiv);
    }
    else {
      var imageButton = $('sub_category_id_drop_down').previousSibling;
      $('sub_category_id_drop_down').remove();
    }
    var subCatList = subCategories[curr_category_id];
    if (subCatList.length > 0) {
      $('sub_category_id_input').setHTML('Select Sub Category');
    }
    else {
      $('sub_category_id_input').setHTML('No Sub Categories');
    }

    var dropDown = new Element('ul', {'id': 'sub_category_id_drop_down', 'styles':{'display':'none','position':'absolute','width':'210px'}});
    for (var i = 0; i < subCatList.length; i++) {
      var dropDownOption = new Element('li').setHTML(subCatList[i][1]);
      images[curr_category_id][i] = new Array();
      images[curr_category_id][i]['filenames'] = new Array();
      dropDownOption.addEvent('click', function(ev) {
        ev = new Event(ev).stop();
        var subCatList = subCategories[curr_category_id];
        var found = false;
        var j = 0;
        var p = this.getParent();
        while (!found && j < subCatList.length) {
          if (this == p.childNodes[j]) {
            found = true;
          }
          else {
            j++;
          }
        }
        selectOption('sub_category_id', j, subCatList[j][1]);
      });
      dropDownOption.addEvent('mouseenter', function() {
        this.setStyles({'background':'#db0e21','color':'#FFF'});
      });
      dropDownOption.addEvent('mouseleave', function() {
        this.setStyles({'background':'white','color':'#000'})
      });
      dropDownOption.injectInside(dropDown);
    }
    dropDown.injectAfter(imageButton);
    dropDown.setStyle('display','none');
  }

  if (param_load) {
    if (curr_category_id != categories.length-1) {
      param_load = true;
      var i = 0;
      var found = false;
      while (!found && i < subCategories[curr_category_id].length) {
        if (subCategories[curr_category_id][i][0] == actual_sub_category_id) {
          found = true;
        }
        else {
          i++;
        }
      }
      selectOption('sub_category_id', i, subCategories[curr_category_id][i][1], false);
    }
    else {
      curr_sub_category_id = 0;

    }
    loadImages();
  }
}

function changeImages() {
  curr_image_id = -1;
  var files = images[curr_category_id][curr_sub_category_id]['filenames'][curr_page_id];

  var thumbFrame = clearThumbs();
  thumbFrame.injectAfter($('thumbFrameLeft'));
  for (var i = 0; i < files.length; i++) {
    var imgEl = new Element('img', {'src': base_url+'images/gallery/th_'+files[i][0], 'width': '43', 'height':'43','styles': {'margin':'4px 5px 0px 1px'}});
    if (i == 0) {
      imgEl.addClass('active');
    }
    else {
      imgEl.setOpacity(0.5);
    }
    imgEl.setStyle('cursor','pointer');
    imgEl.addEvent('click', function(ev) {
      ev = new Event(ev).stop();
      stopSlideShow();
      var fileList = images[curr_category_id][curr_sub_category_id]['filenames'][curr_page_id];
      var found = false;
      var j = 0;
      var p = this.getParent();
      while (!found && j < fileList.length) {
        if (this == p.childNodes[j]) {
          found = true;
        }
        else {
          j++;
        }
      }
      showImage(j);
    });
    imgEl.addEvent('mouseenter', function(ev) {
      ev = new Event(ev).stop();
      this.setOpacity(1);
    });
    imgEl.addEvent('mouseleave', function(ev) {
      ev = new Event(ev).stop();
      var found = false;
      var j = 0;
      var p = this.getParent();
      while (!found && j < p.childNodes.length) {
        if (this == p.childNodes[j]) {
          found = true;
        }
        else {
          j++;
        }
      }
      if (j != curr_image_id) {
        this.setOpacity(0.5);
      }
    });
    imgEl.injectInside(thumbFrame);
  }

  showImage(0);

  if (param_load || $('imageViewer').getStyle('display') == 'none') {
    // attach click handlers
    $('imageViewerLeft').getElement('a').setAttribute('href','#');
    $('imageViewerLeft').getElement('a').addEvent('click', function(ev) {
      if (curr_sub_category_id != -1) {
        ev = new Event(ev).stop();
        showImage(curr_image_id.toInt()-1);
        stopSlideShow();
      }
    });
    $('imageViewerRight').getElement('a').setAttribute('href','#');
    $('imageViewerRight').getElement('a').addEvent('click', function(ev) {
      if (curr_sub_category_id != -1) {
        ev = new Event(ev).stop();
        showImage(curr_image_id.toInt()+1);
        stopSlideShow();
      }
    });
    $('thumbFrameLeft').getElement('a').setAttribute('href','#');
    $('thumbFrameLeft').getElement('a').addEvent('click', function(ev) {
      if (curr_sub_category_id != -1) {
        ev = new Event(ev).stop();
        showPage(curr_page_id.toInt()-1);
        stopSlideShow();
      }
    });
    $('thumbFrameRight').getElement('a').setAttribute('href','#');
    $('thumbFrameRight').getElement('a').addEvent('click', function(ev) {
      if (curr_sub_category_id != -1) {
        ev = new Event(ev).stop();
        showPage(curr_page_id.toInt()+1);
        stopSlideShow();
      }
    });
  }
  $('imageViewer').setStyle('display', 'block');
  $('thumbFrame').setStyle('display', 'block');

  if (param_load) {
    param_load = false;
  }

  if (curr_category_id == categories.length-1) {
    startSlideShow();
  }
}

function clearImage() {
  $('imageViewerImage').getElement('img').setAttribute('src','');
}

function clearThumbs() {
  if ($('thumbFrameThumbs')) {
    $('thumbFrameThumbs').remove();
  }
  return new Element('div', {'id': 'thumbFrameThumbs'});
}

function showImage(image_id) {
  if (image_id != curr_image_id && image_id >= 0 && image_id < images[curr_category_id][curr_sub_category_id]['filenames'][curr_page_id].length) {
    if (curr_image_id >= 0) {
      $('thumbFrameThumbs').childNodes[curr_image_id].removeClass('active');
      $('thumbFrameThumbs').childNodes[curr_image_id].setOpacity(0.5);
    }
    curr_image_id = image_id;
    $('imageViewerImage').getElement('img').src = base_url+'images/gallery/'+images[curr_category_id][curr_sub_category_id]['filenames'][curr_page_id][curr_image_id][0];
    $('thumbFrameThumbs').childNodes[curr_image_id].addClass('active');
    $('thumbFrameThumbs').childNodes[curr_image_id].setOpacity(1);

    if (curr_image_id > 0) {
      $('imageViewerLeft').getElement('a').removeClass('inactive');
    }
    else {
      $('imageViewerLeft').getElement('a').addClass('inactive');
    }
    if (curr_page_id > 0) {
      $('thumbFrameLeft').getElement('a').removeClass('inactive');
    }
    else {
      $('thumbFrameLeft').getElement('a').addClass('inactive');
    }
    if (curr_page_id+1 < images[curr_category_id][curr_sub_category_id]['num_pages']) {
      $('thumbFrameRight').getElement('a').removeClass('inactive');
    }
    else {
      $('thumbFrameRight').getElement('a').addClass('inactive');
    }
    if (curr_image_id+1 < images[curr_category_id][curr_sub_category_id]['filenames'][curr_page_id].length) {
      $('imageViewerRight').getElement('a').removeClass('inactive');
    }
    else {
      $('imageViewerRight').getElement('a').addClass('inactive');
    }
  }
}

function showPage(page_id) {
  if (page_id != curr_page_id && page_id >= 0 && page_id < images[curr_category_id][curr_sub_category_id]['num_pages']) {
    curr_page_id = page_id;
    loadImages();
  }
}

function loadSubCategories() {
  if (curr_category_id == categories.length-1 || subCategories[curr_category_id].length > 0) {
    changeCategory();
  }
  else {
    stopSlideShow();
    var url = base_url+'creative/ideas_gallery/getsubcategories/' + categories[curr_category_id][0];
    if ($('sub_category_id_input')) {
      $('sub_category_id_input').setHTML("Loading...");
    }

    new Ajax(url, {
  		method: 'get',
  		onSuccess : successHandler,
  		onFailure: failureHandler
  	}).request();
  }

  function successHandler( responseText ) {
    eval("var decoded_data = "+ responseText);
    if (decoded_data[0] == '') {
      subCategories[curr_category_id] = decoded_data[1];
      changeCategory();
    }
    else {
      alert(decoded_data[0]);
    }
  }

  function failureHandler( transport ) {

  }
}

function loadImages() {
  if (curr_category_id != categories.length-1 && images[curr_category_id][curr_sub_category_id]['filenames'].contains(curr_page_id)) {
    changeCategory();
  }
  else {
    var url = base_url+'creative/ideas_gallery/getimages/-1/' + curr_page_id;
    if (curr_category_id != categories.length-1) {
      url = base_url+'creative/ideas_gallery/getimages/' + subCategories[curr_category_id][curr_sub_category_id][0] + '/' + curr_page_id;
    }

    new Ajax(url, {
  		method: 'get',
  		onSuccess : successHandler,
  		onFailure: failureHandler
  	}).request();
  }

  function successHandler( responseText ) {
    eval("var decoded_data = "+ responseText);
    if (decoded_data[0] == '') {
      images[curr_category_id][curr_sub_category_id]['num_pages'] = decoded_data[1];
      images[curr_category_id][curr_sub_category_id]['filenames'][curr_page_id] = decoded_data[2];
      changeImages();
    }
    else {
      alert(decoded_data[0]);
    }
  }

  function failureHandler( transport ) {

  }
}

function showNextImage() {
  show = curr_image_id.toInt()+1;
  if (show == images[curr_category_id][curr_sub_category_id]['filenames'][curr_page_id].length) {
    show = 0;
  }
  showImage(show);
}

function startSlideShow() {
  slideShowInterval = setInterval('showNextImage()', slideTime);
}

function stopSlideShow() {
  clearTimeout(slideShowInterval);
}