﻿var checkHeight = 25;

function selectReplacement(obj) {
    obj.className += ' replaced';
    var ul = document.createElement('ul');
    ul.className = 'selectReplacement';
    var opts = obj.options;
    var selectedOpt = (!obj.selectedIndex) ? 0 : obj.selectedIndex;
    for (var i = 0; i < opts.length; i++) {
        var li = document.createElement('li');
        var txt = document.createTextNode(opts[i].text);
        li.appendChild(txt);
        li.selIndex = i;
        li.selectID = obj.id;
        li.onclick = function() {
            selectMe(this);
        };
        if (i == selectedOpt) {
            li.className = 'selected';
            li.onclick = function() {
                this.parentNode.className += ' selectOpen';
                this.onclick = function() {
                    selectMe(this);
                };
            };
        }
        if (window.attachEvent) {
            li.onmouseover = function() {
                this.className += ' hover';
            };
            li.onmouseout = function() {
                this.className =
                this.className.replace(new RegExp(" hover\\b"), '');
            };
        }
        ul.appendChild(li);
    }
    obj.onfocus = function() {
        ul.className += ' selectFocused';
    };
    obj.onblur = function() {
        ul.className = 'selectReplacement';
    };
    obj.onchange = function() {
        var idx = this.selectedIndex;
        selectMe(ul.childNodes[idx]);
    };
    obj.onkeypress = obj.onchange;
    obj.parentNode.insertBefore(ul, obj);
}

function selectMe(obj) {
    var lis = obj.parentNode.getElementsByTagName('li');
    for (var i = 0; i < lis.length; i++) {
        if (lis[i] != obj) {
            lis[i].className = '';
            lis[i].onclick = function() {
                selectMe(this);
            };
        } else {
            setVal(obj.selectID, obj.selIndex);
            obj.className = 'selected';
            obj.parentNode.className =
            obj.parentNode.className.replace(new RegExp(" selectOpen\\b"), '');
            obj.onclick = function() {
                obj.parentNode.className += ' selectOpen';
                this.onclick = function() {
                    selectMe(this);
                };
            };
        }
    }
}

function setVal(objID, val) {
    var obj = document.getElementById(objID);
    obj.selectedIndex = val;
    onChange(obj);
}

function checkboxReplacenent(obj) {
    obj.className += ' replaced';

    obj.onchange = function() {
        checkMe();
    };

    var span = document.createElement('span');
    span.className = 'checkboxReplacement';
    span.id = 'mp3_check_replased';
    span.onclick = function() {
        checkClick();
    };
    obj.parentNode.insertBefore(span, obj);
    checkMe();
}

function checkMe() {
    var span = document.getElementById('mp3_check_replased');
    var checkbox = document.getElementById('mp3_check');
if(span != null)
{
    if (checkbox.disabled == true) {
        span.style.backgroundPosition = "0 -" + checkHeight * 4 + "px";
    }
    if (checkbox.checked && !checkbox.disabled) {
        span.checked = true;
        span.style.backgroundPosition = "0 -" + checkHeight * 2 + "px";
    } else if (!checkbox.checked && !checkbox.disabled) {
        span.checked = false;
        span.style.backgroundPosition = "0 -" + checkHeight * 0 + "px";
    }
  }
}

function checkClick() {
    var span = document.getElementById('mp3_check_replased');
    var checkbox = document.getElementById('mp3_check');

    if (span.checked && !checkbox.disabled) {
        checkbox.checked = false;
        span.checked = false;
        span.style.backgroundPosition = "0 -" + checkHeight * 0 + "px";
    } else if (!span.checked && !checkbox.disabled) {
        checkbox.checked = true;
        span.checked = true;
        span.style.backgroundPosition = "0 -" + checkHeight * 2 + "px";
    }
}

function getSearchFormControls() {
    var s = document.getElementById('type');
    var c = document.getElementById('mp3_check');
    selectReplacement(s);
    checkboxReplacenent(c);
}

