function $(id)
{
    return document.getElementById(id);
}

function FindById(list, id)
{
    for (var i=0; i<list.length; i++)
    {
        var item = list[i];
        if (item.id == id)
            return item;
    }
    
    return null;
}

function IsMaxLength(obj)
{
    var maxLength = obj.getAttribute ? parseInt(obj.getAttribute("maxlength")) : "";
    if (obj.getAttribute && obj.value.length > maxLength)
        obj.value = obj.value.substring(0, maxLength)
}

function SetCaretAtEnd(obj)
{
    obj.focus();
    
    if (obj.createTextRange)
    {
        var range = obj.createTextRange();
        range.collapse(false);
        range.select();
    }
    else if (obj.setSelectionRange)
    {
        obj.focus();
        var length = obj.value.length;
        obj.setSelectionRange(length, length);
    }
}

function SetCaretAtStart(obj)
{
    if (obj.createTextRange)
    {
        var range = obj.createTextRange();
        range.collapse(true);
        range.select();
    }
    else if (obj.setSelectionRange)
    {
        obj.focus();
        obj.setSelectionRange(0, 0);
    }
}

function CopyToClipBoard() 
{
    var codeBoxObj = document.getElementById("codeBox");
    Copied = codeBoxObj.createTextRange();
    Copied.execCommand("Copy");
    Copied.select();
}

function ClickOnEnter(butonId, evt)
{
    var keycode;
    
    if (window.event)
    {
        keycode = window.event.keyCode;
        evt = window.event;
    }
    else if (evt)
    {
        keycode = evt.keyCode;
    }
    else
    {
        return;
    }
    
    if (keycode == 13)
    {
        document.getElementById(butonId).click();
        
        evt.cancelBubble = true;
        evt.returnValue = false;
    }
}

function InitColorPicker(tableId, inputId, iconId)
{
    var table = $(tableId);
    var input = $(inputId);

    table.setAttribute("iconId", iconId);
//    var iconAttr = document.createAttribute("iconId");
//    iconAttr.value = iconId;
//    table.attributes.setNamedItem(iconAttr);

    table.setAttribute("inputId", inputId);
//    var inputAttr = document.createAttribute("inputId");
//    inputAttr.value = inputId;
//    table.attributes.setNamedItem(inputAttr);
    
    var trs = table.getElementsByTagName("tr");
    for (var j=0; j<trs.length; j++)
    {
        var tr = trs[j];
        var tds = tr.getElementsByTagName("td");

        for(var i=0; i<tds.length; i++)
        {
            var td = tds[i];

            var colString = "";
            if (td.getAttribute("val") != null)
            {
                colString = td.getAttribute("val");
                td.style.backgroundColor = "#" + colString;
            }
            td.onclick = HandleColorClick;
        }
    }
}

function HandleColorClick()
{
    var table = this.parentNode.parentNode.parentNode;
    var inputId = table.getAttribute("inputId");

    var colAttr = this.getAttribute("val");
    if (colAttr != null)
    {
        var colString = colAttr;
        $(inputId).value = colString;
    }

    var iconId = table.getAttribute("iconId");
    $(iconId).style.display = "inline";
    table.parentNode.style.display = "none";
    
    SetInputColor($(inputId));
}

function SetInputColor(me)
{
    var color = me.value;
    if (color != null && color.length == 6)
    {
        me.nextSibling.style.backgroundColor = "#" + color;
    }
    else
    {
        me.nextSibling.style.backgroundColor = "";
    }
}