//Global Variables
var niceforms = document.getElementsByTagName('form'); 
var inputs = new Array(); 
var labels = new Array(); 
var radios = new Array(); 
var radioLabels = new Array(); 
var checkboxes = new Array(); 
var checkboxLabels = new Array(); 
var selects = new Array(); 
var selectText = "please select"; 
var agt = navigator.userAgent.toLowerCase(); 
this.ie = ((agt.indexOf("msie") != -1) && (agt.indexOf("opera") == -1)); var isMac = new RegExp('(^|)'+'Apple'+'(|$)');
var flag0 = 0;
var flag1 = 0;
var flag2 = 0;
var flagSent = 0;
var lastsel = new Array();
lastsel['0'] = 0;
lastsel['1'] = 0;
lastsel['2'] = 0;
//Theme Variables - edit these to match your theme
var selectRightSideWidth = 19;
var selectLeftSideWidth = 6;
var selectAreaHeight = 19;
var selectAreaOptionsOverlap = 0;
var imagesPath = "i/";

//Initialization function - if you have any other 'onload' functions, add them here
function init() {
  if(!document.getElementById) {return false;}
  getElements();
  //separateElements();
  //replaceRadios();
  //replaceCheckboxes();
  replaceSelects();
}

//getting all the required elements
function getElements() {
  var re = new RegExp('(^| )'+'niceform'+'( |$)');
  for (var nf = 0; nf < document.getElementsByTagName('form').length; nf++) {
    if(re.test(niceforms[nf].className)) {
      //for(var nfi = 0; nfi < document.forms[nf].getElementsByTagName('input').length; nfi++) {inputs.push(document.forms[nf].getElementsByTagName('input')[nfi]);}
      //for(var nfl = 0; nfl < document.forms[nf].getElementsByTagName('label').length; nfl++) {labels.push(document.forms[nf].getElementsByTagName('label')[nfl]);}
      for(var nfs = 0; nfs < document.forms[nf].getElementsByTagName('select').length; nfs++) {
		  selects.push(document.forms[nf].getElementsByTagName('select')[nfs]);
		}
    }
  }
}
//separating all the elements in their respective arrays
function separateElements() {
  var r = 0; var c = 0; var t = 0; var rl = 0; var cl = 0; var tl = 0; var b = 0;
  for (var q = 0; q < inputs.length; q++) {
    if(inputs[q].type == 'radio') {
      radios[r] = inputs[q]; ++r;
      for(var w = 0; w < labels.length; w++) {if(labels[w].htmlFor == inputs[q].id) {if(inputs[q].checked) {labels[w].className = "chosen";} radioLabels[rl] = labels[w]; ++rl;}}
    }
    if(inputs[q].type == 'checkbox') {
      checkboxes[c] = inputs[q]; ++c;
      for(var w = 0; w < labels.length; w++) {if(labels[w].htmlFor == inputs[q].id) {if(inputs[q].checked) {labels[w].className = "chosen";} checkboxLabels[cl] = labels[w]; ++cl;}}
    }
  }
}
function replaceRadios() {
  for (var q = 0; q < radios.length; q++) {
    //move radios out of the way
    radios[q].className = "outtaHere";
    //create div
    var radioArea = document.createElement('div');
    if(radios[q].checked) {radioArea.className = "radioAreaChecked";} else {radioArea.className = "radioArea";}
    radioArea.style.left = findPosX(radios[q]) + 'px';
    radioArea.style.top = findPosY(radios[q]) + 'px';
    //radioArea.style.margin = "0";
    radioArea.id = "myRadio" + q;
    //insert div
    radios[q].parentNode.insertBefore(radioArea, radios[q]);
    //assign actions
    radioArea.onclick = new Function('rechangeRadios('+q+')');
    radioLabels[q].onclick = new Function('rechangeRadios('+q+')');
    if(!this.ie) {radios[q].onfocus = new Function('focusRadios('+q+')'); radios[q].onblur = new Function('blurRadios('+q+')');}
    radios[q].onclick = radioEvent;
  }
  return true;
}
function focusRadios(who) {
  var what = document.getElementById('myRadio'+who);
  //what.style.border = "none"; what.style.margin = "0";
  return false;
}
function blurRadios(who) {
  var what = document.getElementById('myRadio'+who);
  //what.style.border = "none"; what.style.margin = "0";
  return false;
}
function checkRadios(who) {
  var what = document.getElementById('myRadio'+who);
  others = document.getElementsByTagName('div');
  for(var q = 0; q < others.length; q++) {if((others[q].className == "radioAreaChecked")&&(others[q].nextSibling.name == radios[who].name)) {others[q].className = "radioArea";}}
  what.className = "radioAreaChecked";
}
function changeRadios(who) {
  if(radios[who].checked) {
    for(var q = 0; q < radios.length; q++) {if(radios[q].name == radios[who].name) {radios[q].checked = false; radioLabels[q].className = "";}} 
    radios[who].checked = true; radioLabels[who].className = "chosen";
    checkRadios(who);
  }
}
function rechangeRadios(who) {
  if(!radios[who].checked) {
    for(var q = 0; q < radios.length; q++) {if(radios[q].name == radios[who].name) {radios[q].checked = false; radioLabels[q].className = "";}}
    radios[who].checked = true; radioLabels[who].className = "chosen";
    checkRadios(who);
  }
}
function radioEvent(e) {
  if (!e) var e = window.event;
  if(e.type == "click") {for (var q = 0; q < radios.length; q++) {if(this == radios[q]) {changeRadios(q); break;}}}
}
function replaceCheckboxes() {
  for (var q = 0; q < checkboxes.length; q++) {
    //move checkboxes out of the way
    checkboxes[q].className = "outtaHere";
    //create div
    var checkboxArea = document.createElement('div');
    if(checkboxes[q].checked) {checkboxArea.className = "checkboxAreaChecked";} else {checkboxArea.className = "checkboxArea";}
    checkboxArea.style.left = findPosX(checkboxes[q]) + 'px';
    checkboxArea.style.top = findPosY(checkboxes[q]) + 'px';
    //checkboxArea.style.margin = "";
    checkboxArea.id = "myCheckbox" + q;
    //insert div
    checkboxes[q].parentNode.insertBefore(checkboxArea, checkboxes[q]);
    //asign actions
    checkboxArea.onclick = new Function('rechangeCheckboxes('+q+')');
    if(!isMac.test(navigator.vendor)) {checkboxLabels[q].onclick = new Function('changeCheckboxes('+q+')');}
    else {checkboxLabels[q].onclick = new Function('rechangeCheckboxes('+q+')');}
    if(!this.ie) {checkboxes[q].onfocus = new Function('focusCheckboxes('+q+')'); checkboxes[q].onblur = new Function('blurCheckboxes('+q+')');}
    checkboxes[q].onkeydown = checkEvent;
  }
  return true;
}
function focusCheckboxes(who) {
  var what = document.getElementById('myCheckbox'+who);
  //what.style.border = "none"; what.style.margin = "0";
  return false;
}
function blurCheckboxes(who) {
  var what = document.getElementById('myCheckbox'+who);
  //what.style.border = "none"; what.style.margin = "0";
  return false;
}
function checkCheckboxes(who, action) {
  var what = document.getElementById('myCheckbox'+who);
  if(action == true) {what.className = "checkboxAreaChecked";}
  if(action == false) {what.className = "checkboxArea";}
}
function changeCheckboxes(who) {
  if(checkboxLabels[who].className == "chosen") {
    checkboxes[who].checked = true;
    checkboxLabels[who].className = "";
    checkCheckboxes(who, false);
  }
  else if(checkboxLabels[who].className == "") {
    checkboxes[who].checked = false;
    checkboxLabels[who].className = "chosen";
    checkCheckboxes(who, true);
  }
}
function rechangeCheckboxes(who) {
  var tester = false;
  if(checkboxLabels[who].className == "chosen") {
    tester = false;
    checkboxLabels[who].className = "";
  }
  else if(checkboxLabels[who].className == "") {
    tester = true;
    checkboxLabels[who].className = "chosen";
  }
  checkboxes[who].checked = tester;
  checkCheckboxes(who, tester);
}
function checkEvent(e) {
  if (!e) var e = window.event;
  if(e.keyCode == 32) {for (var q = 0; q < checkboxes.length; q++) {if(this == checkboxes[q]) {changeCheckboxes(q);}}} //check if space is pressed
}
function replaceSelects() {
    for(var q = 0; q < selects.length; q++) {
    //create and build div structure
    var selectArea = document.createElement('div');
    var left = document.createElement('div');
    var right = document.createElement('div');
    var center = document.createElement('div');
    var button = document.createElement('a');
    var text = document.createTextNode(selectText);
    center.id = "mySelectText"+q;
    var selectWidth = parseInt(selects[q].className.replace(/width_/g, ""));
    center.style.width = selectWidth - 5 + 'px';
    selectArea.style.width = selectWidth + selectRightSideWidth + selectLeftSideWidth + 'px';
    button.style.width = selectWidth + selectRightSideWidth + selectLeftSideWidth + 'px';
    button.style.marginLeft = - selectWidth - selectLeftSideWidth + 'px';
    button.href = "javascript:showOptions("+q+")";
    button.onkeydown = selectEvent;
    button.className = "selectButton"; //class used to check for mouseover
    selectArea.className = "selectArea";
    selectArea.id = "sarea"+q;
    left.className = "left";
    right.className = "right";
    center.className = "center";
    right.appendChild(button);
    center.appendChild(text);
    selectArea.appendChild(left);
    selectArea.appendChild(center);
    selectArea.appendChild(right);
    //hide the select field
    selects[q].style.display='none'; 
    //insert select div
    selects[q].parentNode.insertBefore(selectArea, selects[q]);
    //build & place options div
    var optionsDiv = document.createElement('div');
    optionsDiv.style.width = selectWidth + selectRightSideWidth + selectLeftSideWidth - 6 + 'px';
    optionsDiv.className = "optionsDivInvisible";
    optionsDiv.id = "optionsDiv"+q;
    //optionsDiv.style.left = findPosX(selectArea) + 'px';
    //optionsDiv.style.top = findPosY(selectArea) + selectAreaHeight - selectAreaOptionsOverlap + 'px';

    optionsDiv.style.left = selectAreaOptionsOverlap + 'px';
    optionsDiv.style.top = selectAreaHeight + 'px';

    //get select's options and add to options div
    for(var w = 0; w < selects[q].options.length; w++) {
      var optionHolder = document.createElement('p');
      var optionLink = document.createElement('a');
      var optionTxt = document.createTextNode(selects[q].options[w].text);
      optionLink.href = "javascript:showOptions("+q+"); updateForm('"+selects[q].id+"',"+w+","+q+"); selectMe('"+selects[q].id+"',"+w+","+q+");";
      optionLink.appendChild(optionTxt);
      optionHolder.appendChild(optionLink);
      optionsDiv.appendChild(optionHolder);
      //check for pre-selected items
      if(selects[q].options[w].selected) {selectMe(selects[q].id,w,q);}
    }
    //insert options div
	document.getElementById("ins"+q).appendChild(optionsDiv);
    //document.getElementsByTagName("body")[0].appendChild(optionsDiv);
  }
}
function replaceSelects2(q) {
    //=========create and build div structure
    var selectWidth = parseInt(selects[q].className.replace(/width_/g, ""));
    //=========build & place options div
    var optionsDiv = document.createElement('div');
    optionsDiv.style.width = selectWidth + selectRightSideWidth + selectLeftSideWidth - 6 + 'px';
    optionsDiv.className = "optionsDivInvisible";
    optionsDiv.id = "optionsDiv"+q;
    optionsDiv.style.left = selectAreaOptionsOverlap + 'px';
    optionsDiv.style.top = selectAreaHeight + 'px';
    //========get select's options and add to options div
    for(var w = 0; w < selects[q].options.length; w++) {
      var optionHolder = document.createElement('p');
      var optionLink = document.createElement('a');
      var optionTxt = document.createTextNode(selects[q].options[w].text);
      optionLink.href = "javascript:showOptions("+q+"); updateForm('"+selects[q].id+"',"+w+","+q+"); selectMe('"+selects[q].id+"',"+w+","+q+");";
      optionLink.appendChild(optionTxt);
      optionHolder.appendChild(optionLink);
      optionsDiv.appendChild(optionHolder);
      //check for pre-selected items
      if(selects[q].options[w].selected) {selectMe(selects[q].id,w,q);}
    }
    //insert options div
	document.getElementById("ins"+q).appendChild(optionsDiv);
    //document.getElementsByTagName("body")[0].appendChild(optionsDiv);
}




function showOptions(g) {
    elem = document.getElementById("optionsDiv"+g);
    if(elem.className=="optionsDivInvisible") {elem.className = "optionsDivVisible";}
    else if(elem.className=="optionsDivVisible") {elem.className = "optionsDivInvisible";}
    //elem.onmouseout = hideOptions;
}
function hideOptions(e) { //hiding the options on mouseout
  /*
  if (!e) var e = window.event;
  var reltg = (e.relatedTarget) ? e.relatedTarget : e.toElement;

  if(((reltg.nodeName != 'A') && (reltg.nodeName != 'DIV')) || ((reltg.nodeName == 'A') && (reltg.className=="selectButton") && (reltg.nodeName != 'DIV'))) {
	  this.className = "optionsDivInvisible";
	  };
  e.cancelBubble = true;
  if (e.stopPropagation) e.stopPropagation();
  */
}

function selectMe(selectFieldId,linkNo,selectNo) {
  //feed selected option to the actual select field
  selectField = document.getElementById(selectFieldId);
  lastsel[selectNo] = linkNo;
  //alert(lastsel[selectNo]);
  for(var k = 0; k < selectField.options.length; k++) {
    if(k==linkNo) {selectField.options[k].selected = "selected";}
    else {selectField.options[k].selected = "";}
  }
  //show selected option
  textVar = document.getElementById("mySelectText"+selectNo);
  var newText = document.createTextNode(selectField.options[linkNo].text);
  textVar.replaceChild(newText, textVar.childNodes[0]);
  if (flagSent == 1) {document.getElementById("niceform").submit();}
}

function updateForm(selectFieldId,linkNo,selectNo) {
  if (selectNo == 0 && linkNo > 0) {
	if (linkNo != lastsel[selectNo]) {
		UpdateData(document.getElementById(selectFieldId).options[linkNo].value);
		selectMe('group_id',0,1);
		selectMe('year',0,2);
	}
	flag0 = 1;
	flag1 = 0;
	flag2 = 0;
  } else if (selectNo == 0 && linkNo == 0) {
	flag0 = 0;
	flag1 = 0;
	flag2 = 0;
  }

  if (selectNo == 1 && linkNo > 0) {
	if (linkNo != lastsel[selectNo]) {
		selectMe('year',0,2);
	}
	flag0 = flag0;
	flag1 = 1;
	flag2 = 0;
  } else if (selectNo == 1 && linkNo == 0) {
	flag0 = flag0;
	flag1 = 0;
	flag2 = 0;
  }

  if (selectNo == 2 && linkNo > 0) {
	flag0 = flag0;
	flag1 = flag1;
	flag2 = 1;
  } else if (selectNo == 2 && linkNo == 0) {
	flag0 = flag0;
	flag1 = flag1;
	flag2 = 0;
  }
  
  if (flag0 == 0 && flag1 == 0 && flag2 == 0) {
	DisableSelect(1);
	DisableSelect(2);
  } else if (flag0 == 1 && flag1 == 0 && flag2 == 0) {
	selectMe('group_id',0,1);
	EnableSelect(1);
	DisableSelect(2);
  } else if (flag0 == 1 && flag1 == 1 && flag2 == 0) {
	selectMe('year',0,2);
	EnableSelect(2);
  } else if (flag0 == 1 && flag1 == 1 && flag2 == 1) {
	//alert('Send result !');
	flagSent = 1;
  }
}


function UpdateData(markid) {
	var q = 1;
	// удаляем старые данные
	//alert('delete data');
	selectVar = document.getElementById("group_id");
	// удаляем все элементы из select
	selectArr = selectVar.getElementsByTagName('option');
	for (var i = 0; i <= selectArr.length; i++) {
		while (selectArr[i] && (typeof(selectArr[i]) != 'undefined')) {
			selectVar.removeChild(selectArr[i]);
		}
	}
	// добавляем первый элемент
	var option0 = document.createElement('option');
	option0.value = '';
	option0.innerHTML = 'Выберите модель';
	selectVar.appendChild(option0);
	textVar = document.getElementById("ins"+q);       // удаляем элементы из ins1
	textVar.removeChild(textVar.childNodes[0]);       // удаляем элементы из ins1
	// вставляем новые данные
	var arr;
	var opt = Array();
	//alert('start');
	//alert(markid);
	var path = '/xml/models.xml?q='+markid;
	jx.load(path,function(xmlDoc) {
		arr = xml2array(xmlDoc);
		newdata = arr['container']['item'];
		var w;
		for (w in newdata) {
			if (newdata[w]['name'] == undefined) {
				opt[w] = document.createElement('option');
				opt[w].value = newdata['id'];
				opt[w].innerHTML = newdata['name'];
				selectVar.appendChild(opt[w]);
				break;
			} else {
				opt[w] = document.createElement('option');
				opt[w].value = newdata[w]['id'];
				opt[w].innerHTML = newdata[w]['name'];
				selectVar.appendChild(opt[w]);
			}
			//alert('newdata[' + w + '] = ' + newdata[w]['name'] + '-'+newdata[w]['id']);
		}
		getElements();
		replaceSelects2(1);
	},"XML");
	//alert('stop');
}


function selectEvent(e) {
  if (!e) var e = window.event;
  var thecode = e.keyCode;
  switch(thecode){
    case 40: //down
      var fieldId = this.parentNode.parentNode.id.replace(/sarea/g, "");
      var linkNo = 0;
      for(var q = 0; q < selects[fieldId].options.length; q++) {if(selects[fieldId].options[q].selected) {linkNo = q;}}
      ++linkNo;
      if(linkNo >= selects[fieldId].options.length) {linkNo = 0;}
      selectMe(selects[fieldId].id, linkNo, fieldId);
      break;
    case 38: //up
      var fieldId = this.parentNode.parentNode.id.replace(/sarea/g, "");
      var linkNo = 0;
      for(var q = 0; q < selects[fieldId].options.length; q++) {if(selects[fieldId].options[q].selected) {linkNo = q;}}
      --linkNo;
      if(linkNo < 0) {linkNo = selects[fieldId].options.length - 1;}
      selectMe(selects[fieldId].id, linkNo, fieldId);
      break;
    default:
      break;
  }
}

//Useful functions
function findPosY(obj) {
  var posTop = 0;
  while (obj.offsetParent) {posTop += obj.offsetTop; obj = obj.offsetParent;}
  return posTop;
}
function findPosX(obj) {
  var posLeft = 0;
  while (obj.offsetParent) {posLeft += obj.offsetLeft; obj = obj.offsetParent;}
  return posLeft;
}

function EnableSelect(id1) {
	document.getElementById("lay"+id1+"_0").style.display = 'none';
	document.getElementById("lay"+id1+"_1").style.display = 'block';
}
function DisableSelect(id1) {
	document.getElementById("lay"+id1+"_0").style.display = 'block';
	document.getElementById("lay"+id1+"_1").style.display = 'none';
}

window.onload = init;




/*
Есть два варианта:

1) Генеришь код и в родительский элемент втыкаешь код:

var code = '<select id=sel><option value="1">abc</option><option value="2">def</option></select>';
var divParent = document.getElementById('select_parent');
divParent.innerHTML = code;

Минусы: если много яваскрипта динамического (интервалы и таймауты), то они могут отвалиться.
Плюсы: быстродействие, простота понимания.


2) Через дом:

var sel = document.createElement('select');
sel.id = 'sel';

var opt1 = document.createElement('option');
opt1.value = 1;
opt1.innerHTML = 'abc';

var opt2 = document.createElement('option');
opt2.value = 2;
opt2.innerHTML = 'def';

var divParent = document.getElementById('select_parent');

sel.appendChild(opt1);
sel.appendChild(opt2);
divParent.appendChild(sel);

Минус: медленнее работает
Плюс: это "правильно" и гарантированно ничё не отвалится
*/