/* Object definition - sbxMultiSelector class */

function sbxMultiSelector () {
  this.oSelectedList = null;                      /* The list that shows all selected items */
  this.oSelectedListContainer = null;             /* DOM container of oSelectedList */
  this.oMultipleSelectors = null;                 /* The original Multiple Selectors */
  this.nMultiSelectorCount = 0;                   /* Number of original Multiple Selectors */
  this.oSingleSelectors = null;                   /* DOM container of all derived Single Selectors (visual elements for Multiple Selectors) */
  this.multipleSelectorOptionLookupTable = null;  /* Unique Option ID (option_uid) to Multiple Selector Options lookup table */
}

sbxMultiSelector.prototype.createAndBindSingleSelectorFromSourceMultipleSelector = function (multiSelectorIdList) {
  var singleSelectorsHtml = '';
  var nMultiSelectorCount = multiSelectorIdList.length;
  var oMultipleSelectors = new Array;
  for (var i=0; i<nMultiSelectorCount; i++) {
    var multiSelectorId = multiSelectorIdList[i];
    oMultipleSelectors[i] = $("#" + multiSelectorId);
    oMultipleSelectors[i].parent().css ('margin-bottom', '0');  // Remove extra space between List-Container and the DIV holding the multi-selector
    var singleSelectorStyleClass = (i==0)? "dynamic_select" : "dynamic_select dynamicSelectMore";
    if (oMultipleSelectors[i].hasClass('fullwidth')) {
      singleSelectorStyleClass += ' fullwidth';
    }
    singleSelectorsHtml += ('<select class="' + singleSelectorStyleClass + '" id="dynSelector-' + multiSelectorId + '"></select>');
  }
  var oSingleSelectors = $('<div>' + singleSelectorsHtml + '</div>').insertBefore (oMultipleSelectors[0]);

  var multipleSelectorOptionLookupTable = new Array;
  for (var i=0; i<nMultiSelectorCount; i++) {
    var multiSelectorId = multiSelectorIdList[i];
    var currentSingleSelector = $("#dynSelector-" + multiSelectorId, oSingleSelectors);;
    $('#'+multiSelectorId).children().each( function () {
      var originalOption = $(this);
      var cloneOption = originalOption.clone();
      var optionValue = originalOption.attr ('value');
      var optionUid = multiSelectorId + '__' + optionValue;
      cloneOption.attr ('option_uid', optionUid);
      multipleSelectorOptionLookupTable[optionUid] = originalOption;
      if (optionValue == 0) {
        cloneOption.attr ('no_select', 1);
      }
      //was creating error in chrome 13   
      //cloneOption.removeAttr ('selected');
      
      if (cloneOption.text().charAt(0) == '.') {
        var oldText = cloneOption.text ();
        var newText = oldText.replace (/\./g, "&nbsp;&nbsp;");
        cloneOption.html (newText);
      }
      cloneOption.appendTo (currentSingleSelector);
    });

    $(':first', currentSingleSelector).attr ('selected', 'selected');
    currentSingleSelector.value = 0;  /* Should do the samething as above - required to make IE7 to work properly */
  }

  this.nMultiSelectorCount = nMultiSelectorCount;
  this.oMultipleSelectors = oMultipleSelectors;
  this.oSingleSelectors = oSingleSelectors;
  this.multipleSelectorOptionLookupTable = multipleSelectorOptionLookupTable;
}

sbxMultiSelector.prototype.createAndBindSelectedShowList = function (noSelectMessage, multiSelectorNameList) {
  var oSelectedListContainer = $('<div class="listContainer"><span class="selection"><b>Selections:</b></span>' +
    '<ul id="multiSelectedList" class="mysbxSelectedList"><li id="no-select" class="no-select">' +
    noSelectMessage +
    '</li></ul>' +
    '</div>');
  this.oSelectedListContainer = oSelectedListContainer;
  this.oSelectedList = oSelectedListContainer.children("#multiSelectedList");
  //--- Update for 2008 Q3 Nclud UI Redesign - No guarantees to have Description, and if exists, Description is hidden
  //oSelectedListContainer.insertAfter(this.oMultipleSelectors[this.nMultiSelectorCount - 1].next('.description'));
  oSelectedListContainer.insertAfter(this.oMultipleSelectors[this.nMultiSelectorCount - 1]);
  //---

  var multiSelectorWrapperObj = this;
  for (var i = 0; i < this.nMultiSelectorCount; i++) {
    var multiSelectorId = this.oMultipleSelectors[i].attr ('id');
    $("option:selected", this.oMultipleSelectors[i]).each( function () {
      var oOption = $(this);
      var theVal = oOption.val();
      if (theVal != 0) {
        var optionUid = multiSelectorId + '__' + theVal;
        var optionListText = oOption.text().replace(/\./g, '');
        multiSelectorWrapperObj.addSelectedItemToSelectedList (optionUid, optionListText, multiSelectorNameList);
      }
    });
  }
  this.refreshSelectedListDisplay ();
}

sbxMultiSelector.prototype.addSelectedItemToSelectedList = function (optionUid, optionListText, multiSelectorIdList) {
  if ($("li[option_uid='" + optionUid + "']", this.oSelectedList).length > 0)
    return;
  var multiSelectorWrapperObj = this;
  if (multiSelectorIdList == 'edit-staff-clearance') {
    var listItem =  multiSelectorWrapperObj.getTextFieldMarkup (optionUid, optionListText);
  }
  else {
    var listItem = $('<li option_uid="' + optionUid + '">' + optionListText + '&nbsp;&nbsp;<span class="listDelete">X</span></li>');
  }
  $('.listDelete', listItem).click ( function () {
    var optionUid = $(this).parent().attr('option_uid');
    originalOption = multiSelectorWrapperObj.multipleSelectorOptionLookupTable[optionUid];
    originalOption.removeAttr ('selected');
    $(this).parent().hide ('normal', function() {
      $(this).remove();
      multiSelectorWrapperObj.refreshSelectedListDisplay ();
    });
  });
  listItem.appendTo (this.oSelectedList);
  this.refreshSelectedListDisplay ();
}

sbxMultiSelector.prototype.bindSingleSelectorOptionSelectHandler = function (multiSelectorIdList) {
  var multiSelectorWrapperObj = this;
  $('select', this.oSingleSelectors).change ( function () {
    var activeSingleSelector = this;
    $("option:selected", this).each ( function () {
      var oOption = $(this);
      var theVal = oOption.val();
      if (theVal != 0) {
        var optionUid = oOption.attr ('option_uid');
        var optionListText = oOption.text().replace(/^[\s\xa0]+/, '');
        multiSelectorWrapperObj.multipleSelectorOptionLookupTable[optionUid].attr ("selected", "selected")
        multiSelectorWrapperObj.addSelectedItemToSelectedList (optionUid, optionListText, multiSelectorIdList);
        oOption.removeAttr ('selected');
        $(':first', activeSingleSelector).attr ('selected', 'selected');
        activeSingleSelector.value = 0;  // Should do the samething as above - required to make IE7 to work properly
      }
    });
  });
}

sbxMultiSelector.prototype.refreshSelectedListDisplay = function () {
  var counts = this.oSelectedList.children("li").length;
  var noSelectListItem = this.oSelectedList.children("#no-select");
  if (counts > 1) {
    noSelectListItem.hide();
  }
  else {
    noSelectListItem.show();
  }
}

sbxMultiSelector.prototype.hideMultiSelectors = function () {
  jQuery.each (this.oMultipleSelectors, function (i, s) {
    s.hide();
  });
}

sbxMultiSelector.prototype.getTextFieldMarkup = function (optionUid, optionListText) {
  var numb= '';
  var hidarray = hiddenval.split('&')
  jQuery.each(hidarray, function () {
    if (this.match('tb-'+optionUid+'=') != null) {
      numb=this.replace('tb-'+optionUid+'=','');
    }
  });

  var listItem = $('<li option_uid="' + optionUid + '">' + optionListText + '&nbsp;&nbsp;<input type="text" size=3 id =tb-'+optionUid+' value ="'+numb+'" class="tbclass">&nbsp;&nbsp;<span class="listDelete">X</span></li>');
    return listItem;
}

/* Helper function, "simple factory" of sorts. Similar purpose. */
function sbxCreateSbxMultiSelector (multiSelectorNameList, noSelectMsg) {
  if (typeof multiSelectorNameList == 'string' ) {
    multiSelectorNameList = new Array (multiSelectorNameList);
  };
  var o = new sbxMultiSelector ();
  o.createAndBindSingleSelectorFromSourceMultipleSelector (multiSelectorNameList);
  o.createAndBindSelectedShowList (noSelectMsg, multiSelectorNameList);
  o.bindSingleSelectorOptionSelectHandler (multiSelectorNameList);
  o.refreshSelectedListDisplay ();
  return o;
}