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 texts = new Array();
var textareas = new Array();
var selects = new Array();
var selectText = "wybierz";
var agt = navigator.userAgent.toLowerCase();
this.ie = ((agt.indexOf("msie") != -1) && (agt.indexOf("opera") == -1));
var hovers = new Array();
var buttons = new Array();
var isMac = new RegExp('(^|)'+'Apple'+'(|$)');
//Theme Variables - edit these to match your theme
var selectRightSideWidth = 21;
var selectLeftSideWidth = 8;
var selectAreaHeight = 21;
var selectAreaOptionsOverlap = 2;
var imagesPath = "../../css/images/";
//Initialization function - if you have any other 'onload' functions, add them here
function init() {
if(!document.getElementById) {return false;}
preloadImages();
getElements();
separateElements();
replaceRadios();
replaceCheckboxes();
replaceSelects();
if(!isMac.test(navigator.vendor)) {
replaceTexts();
replaceTextareas();
buttonHovers();
}
}
//preloading required images
function preloadImages() {
preloads = new Object();
preloads[0] = new Image(); preloads[0].src = imagesPath + "button_left_xon.gif";
preloads[1] = new Image(); preloads[1].src = imagesPath + "button_right_xon.gif";
preloads[2] = new Image(); preloads[2].src = imagesPath + "input_left_xon.gif";
preloads[3] = new Image(); preloads[3].src = imagesPath + "input_right_xon.gif";
preloads[4] = new Image(); preloads[4].src = imagesPath + "txtarea_bl_xon.gif";
preloads[5] = new Image(); preloads[5].src = imagesPath + "txtarea_br_xon.gif";
preloads[6] = new Image(); preloads[6].src = imagesPath + "txtarea_cntr_xon.gif";
preloads[7] = new Image(); preloads[7].src = imagesPath + "txtarea_l_xon.gif";
preloads[8] = new Image(); preloads[8].src = imagesPath + "txtarea_tl_xon.gif";
preloads[9] = new Image(); preloads[9].src = imagesPath + "txtarea_tr_xon.gif";
}
//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 nft = 0; nft < document.forms[nf].getElementsByTagName('textarea').length; nft++) {textareas.push(document.forms[nf].getElementsByTagName('textarea')[nft]);}
for(var nfs = 0; nfs < document.forms[nf].getElementsByTagName('select').length; nfs++) {selects.push(document.forms[nf].getElementsByTagName('select')[nfs]);}
}
}
}
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 - 10 + '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(right);
selectArea.appendChild(center);
//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 + 1 + 'px';
optionsDiv.className = "optionsDivInvisible";
optionsDiv.id = "optionsDiv"+q;
optionsDiv.style.left = findPosX(selectArea) + 'px';
optionsDiv.style.top = findPosY(selectArea) + selectAreaHeight - selectAreaOptionsOverlap + '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+"); 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.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);
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]);
}
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;
}
}
window.onload = init;