Manipular Cookies com JavaScript

Olá galera, nesta postagem quero deixar um objeto em javascript com algumas funções para manipular cookies.
Logo abaixo deixei umm breve descrição de cada funcão e um exemplo de como utilizar.

Cookie.read
Le o valor de um cookie de acordo com o parâmetro passado

Cookie.readJSON
Le o valor de um cookie no formato JSON e retorna um objeto

Cookie.readBool
Le o valor de um cookie de acordo com o parâmetro passado e retorna um tipo boolean

Cookie.write
Grava um cookie, os parâmetros permitidos são o nome, valor e número de dias para expirar

Cookie.clear
Limpa um cookie de acordo com o nome passado

Cookie = {
    read : function(name) {
        var regExp = new RegExp(name+"=([^;]+)");
        var matches = regExp.exec(document.cookie);
        return matches ? matches[1] : null;
    },
    readJSON : function(name) {
        var value = this.read(name);
        return value != null ? new Function("return "+value) : [];
    }, 
    readBool : function(name) {
        var value = this.read(name);
        return /^(true|t|1)$/i.test(value) ? true : (/^(false|f|0)$/i.test(value) ? false : null);
    }, 
    write : function(name, value, expireDays) {
        var date = new Date();
        var expires = "";
        if (expireDays) {
            date.setTime(date.getTime() + (expireDays * 24 * 60 * 60 * 1000));
            expires = "; expires="+date.toGMTString();
        }
        if (typeof(value) == "object") value = ObjectUtils.json_encode(value);
            document.cookie = name+"="+value+expires+";"; 
            return document.cookie;  
        },
    clear : function(name) {
        var date = new Date();
        date.setTime(date.getTime() - 86400);
        document.cookie = name+"=; expires="+date.toGMTString()+";";  
        return document.cookie; 
    }
};

Paleta de cores em JavaScript

Olá pessoal, nesta postagem quero deixar um tutorial de como montar uma paleta de cores utilizando JavaScript. Este recurso pode ser bem útil em algumas situações, abaixo tem um exemplo da função utilizada para gerar a paleta onde o primeiro parâmetro é o elemento que será utilizado para exibir a paleta de cores e o segundo é uma função de callback.
Espero que vocês gostem, e pode alterar o código conforme suas necessidades.

<script type="text/javascript">
function drawColorPalette(stageID, callback) {
    var listColor = ["00", "33", "66", "99", "CC", "FF"];
    var table = document.createElement("table");
    table.border = 1;
    table.cellPadding = 0;
    table.cellSpacing = 0;
    table.style.borderColor = "#666666";
    table.style.borderCollapse = "collapse";
    var tr, td;
    var color = "";
    var tbody = document.createElement("tbody");
    for (var i = 0; i < listColor.length; i++){
        tr = document.createElement("tr");
        for (var x = 0; x < listColor.length; x++) {
            for (var y = 0; y < listColor.length; y++) {
                color = "#"+listColor[i]+listColor[x]+listColor[y];
                td = document.createElement("td");
                td.style.width = "11px";
                td.style.height = "11px";
                td.style.background = color;
                td.color = color;
                td.style.borderColor = "#000";
                td.style.cursor = "pointer";
              
                if (typeof(callback) == "function") {
                    td.onclick = function() {
                        callback.apply(this, [this.color]);
                    }
                }
                tr.appendChild(td); 
            }
        }
        tbody.appendChild(tr);
    }  
    table.appendChild(tbody);
    var element = document.getElementById(stageID);
    if (element) element.appendChild(table);
    return table;
}

window.onload = function() {
    drawColorPalette("mydiv", function(color) {
        document.getElementById("textcolor").innerHTML = color;
    }); 
}
</script>

<div id="mydiv"></div>
<span id="textcolor"></span>

Resultado gerado pelo exemplo acima:

Setar posição do cursor com JavaScript

Neste post, quero compartilhar uma função que pode ser bem útil, trata-se de uma solução de como setar o cursor em um determinado ponto de um input text ou textarea. Esta função foi testada no Firefox, IE 7 e Chrome.

function setPosCursor(element, pos) {
    element.focus();
    if (typeof(element.setSelectionRange) != "undefined") {
        element.setSelectionRange(pos, pos);
    }
    else if (element.createTextRange) {
        var breaks = element.value.slice(0, pos).match(/\n/g);
        var endPoint = 0;
        if (breaks instanceof Array) {
            endPoint = -breaks.length;
        }
        var range = element.createTextRange(); 
        range.collapse(true); 
        range.moveStart("character", pos); 
        range.moveEnd("character", endPoint); 
        range.select(); 
    }
} 

Pegar posição do cursor com JavaScript

Em algumas situações precisamos pegar a posição do cursor em um campo de texto (aquele que fica piscando), abaixo tenho uma solução bem prática eu testei no Firefox, IE 7 e Chrome. Para utilizar, você deve passar o elemento input text ou textarea como parâmetro o retorno será um inteiro com o índice da posição.

function getPosCursor(element) {
    var value = 0;
    if (typeof(element.selectionStart) != "undefined") {
        value = element.selectionStart;
    }
    else if (document.selection) {
        var range = document.selection.createRange();
        var storedRange = range.duplicate();
        storedRange.moveToElementText(element);
        storedRange.setEndPoint("EndToEnd", range);
        value = storedRange.text.length - range.text.length;
    }
    return value;
}