[joeroberts]

First you need to create a new java page name to what ever you want
add this code to it

// Startup variables
var onload_functions = new Array();
var imageTag = false;
var theSelection = false;

// Check for Browser & Platform for PC & IE specific bits
// More details from: http://www.mozilla.org/docs/web-developer/sniffer/browser_type.html
var clientPC = navigator.userAgent.toLowerCase(); // Get client info
var clientVer = parseInt(navigator.appVersion); // Get browser version

var is_ie = ((clientPC.indexOf('msie') != -1) && (clientPC.indexOf('opera') == -1));
var is_win = ((clientPC.indexOf('win') != -1) || (clientPC.indexOf('16bit') != -1));
var baseHeight;
    window.onload = function()
    {
        for (var i = 0; i < onload_functions.length; i++)
        {
            eval(onload_functions[i]);
        }
    }
onload_functions.push('initInsertions()');

function insert_text(text, spaces, popup)
{
    var textarea;
    
    if (!popup) 
    {
        textarea = document.forms[form_name].elements[text_name];
    } 
    else 
    {
        textarea = opener.document.forms[form_name].elements[text_name];
    }
    if (spaces) 
    {
        text = ' ' + text + ' ';
    }
    
    if (!isNaN(textarea.selectionStart))
    {
        var sel_start = textarea.selectionStart;
        var sel_end = textarea.selectionEnd;

        mozWrap(textarea, text, '')
        textarea.selectionStart = sel_start + text.length;
        textarea.selectionEnd = sel_end + text.length;
    }
    else if (textarea.createTextRange && textarea.caretPos)
    {
        if (baseHeight != textarea.caretPos.boundingHeight) 
        {
            textarea.focus();
            storeCaret(textarea);
        }

        var caret_pos = textarea.caretPos;
        caret_pos.text = caret_pos.text.charAt(caret_pos.text.length - 1) == ' ' ? caret_pos.text + text + ' ' : caret_pos.text + text;
    }
    else
    {
        textarea.value = textarea.value + text;
    }
    if (!popup) 
    {
        textarea.focus();
    }
}
function dE(n, s)
{
    var e = document.getElementById(n);

    if (!s)
    {
        s = (e.style.display == '' || e.style.display == 'block') ? -1 : 1;
    }
    e.style.display = (s == 1) ? 'block' : 'none';
}
function mozWrap(txtarea, open, close)
{
    var selLength = txtarea.textLength;
    var selStart = txtarea.selectionStart;
    var selEnd = txtarea.selectionEnd;
    var scrollTop = txtarea.scrollTop;

    if (selEnd == 1 || selEnd == 2) 
    {
        selEnd = selLength;
    }

    var s1 = (txtarea.value).substring(0,selStart);
    var s2 = (txtarea.value).substring(selStart, selEnd)
    var s3 = (txtarea.value).substring(selEnd, selLength);

    txtarea.value = s1 + open + s2 + close + s3;
    txtarea.selectionStart = selEnd + open.length + close.length;
    txtarea.selectionEnd = txtarea.selectionStart;
    txtarea.focus();
    txtarea.scrollTop = scrollTop;

    return;
}


function caretPosition()
{
    var start = null;
    var end = null;
}
function getCaretPosition(txtarea)
{
    var caretPos = new caretPosition();
    
    // simple Gecko/Opera way
    if(txtarea.selectionStart || txtarea.selectionStart == 0)
    {
        caretPos.start = txtarea.selectionStart;
        caretPos.end = txtarea.selectionEnd;
    }
    // dirty and slow IE way
    else if(document.selection)
    {
    
        // get current selection
        var range = document.selection.createRange();

        // a new selection of the whole textarea
        var range_all = document.body.createTextRange();
        range_all.moveToElementText(txtarea);
        
        // calculate selection start point by moving beginning of range_all to beginning of range
        var sel_start;
        for (sel_start = 0; range_all.compareEndPoints('StartToStart', range) < 0; sel_start++)
        {        
            range_all.moveStart('character', 1);
        }
    
        txtarea.sel_start = sel_start;
    
        // we ignore the end value for IE, this is already dirty enough and we don't need it
        caretPos.start = txtarea.sel_start;
        caretPos.end = txtarea.sel_start;            
    }

    return caretPos;
}
function bbfontstyle(bbopen, bbclose)
{
    theSelection = false;

    var textarea = document.forms[form_name].elements[text_name];

    textarea.focus();

    if ((clientVer >= 4) && is_ie && is_win)
    {
        // Get text selection
        theSelection = document.selection.createRange().text;

        if (theSelection)
        {
            // Add tags around selection
            document.selection.createRange().text = bbopen + theSelection + bbclose;
            document.forms[form_name].elements[text_name].focus();
            theSelection = '';
            return;
        }
    }
    else if (document.forms[form_name].elements[text_name].selectionEnd && (document.forms[form_name].elements[text_name].selectionEnd - document.forms[form_name].elements[text_name].selectionStart > 0))
    {
        mozWrap(document.forms[form_name].elements[text_name], bbopen, bbclose);
        document.forms[form_name].elements[text_name].focus();
        theSelection = '';
        return;
    }
    
    //The new position for the cursor after adding the bbcode
    var caret_pos = getCaretPosition(textarea).start;
    var new_pos = caret_pos + bbopen.length;        

    // Open tag
    insert_text(bbopen + bbclose);

    // Center the cursor when we don't have a selection
    // Gecko and proper browsers
    if (!isNaN(textarea.selectionStart))
    {
        textarea.selectionStart = new_pos;
        textarea.selectionEnd = new_pos;
    }    
    // IE
    else if (document.selection)
    {
        var range = textarea.createTextRange(); 
        range.move("character", new_pos); 
        range.select();
        storeCaret(textarea);
    }

    textarea.focus();
    return;
}

function colorPalette(dir, width, height)
{
    var r = 0, g = 0, b = 0;
    var numberList = new Array(6);
    var color = '';

    numberList[0] = '00';
    numberList[1] = '40';
    numberList[2] = '80';
    numberList[3] = 'BF';
    numberList[4] = 'FF';

    document.writeln('<table cellspacing="1" cellpadding="0" border="0">');

    for (r = 0; r < 5; r++)
    {
        if (dir == 'h')
        {
            document.writeln('<tr>');
        }

        for (g = 0; g < 5; g++)
        {
            if (dir == 'v')
            {
                document.writeln('<tr>');
            }
            
            for (b = 0; b < 5; b++)
            {
                color = String(numberList[r]) + String(numberList[g]) + String(numberList[b]);
                document.write('<td bgcolor="#' + color + '" style="width: ' + width + 'px; height: ' + height + 'px;">');
                document.write('<a href="#" onclick="bbfontstyle(\'[color=#' + color + ']\', \'[/color]\'); return false;"><img src="http://bvlist.com/images/spacer.gif" width="' + width + '" height="' + height + '" alt="#' + color + '" title="#' + color + '" /></a>');
                document.writeln('</td>');
            }

            if (dir == 'v')
            {
                document.writeln('</tr>');
            }
        }

        if (dir == 'h')
        {
            document.writeln('</tr>');
        }
    }
    document.writeln('</table>');
}

now where you want color pallet to be add this to top

<script type="text/javascript" src="http://yoursite/javacode.js"></script>
        <script type="text/javascript">
// <![CDATA[
    var form_name = 'formdata';
    var text_name = 'descr';
    var load_draft = false;
    var upload = false;

    // Define the bbCode tags
    var bbcode = new Array();
    var bbtags = new Array('[b]','[/b]','[i]','[/i]','[u]','[/u]','<<<@!1!@>>>','[code]','[/code]','[list]','[/list]','[list=]','[/list]','[img]','[/img]','[url]','[/url]','[flash=]', '[/flash]','[size=]','[/size]');
    var imageTag = false;

    // Helpline messages
    var help_line = {
        b: 'Bold text: [b]text[/b]',
        i: 'Italic text: [i]text[/i]',
        u: 'Underline text: [u]text[/u]',
        q: 'Quote text: <<<@!2!@>>>',
        c: 'Code display: [code]code[/code]',
        l: 'List: [list]text[/list]',
        o: 'Ordered list: [list=]text[/list]',
        p: 'Insert image: [img]http://image_url[/img]',
        w: 'Insert URL: [url=http://url]Lost redirect[/url] or [url=http://url]URL text[/url]',
        a: 'Inline uploaded attachment: [attachment=]filename.ext[/attachment]',
        s: 'Font colour: [color=red]text[/color]  Tip: you can also use color=#FF0000',
        f: 'Font size: [size=85]small text[/size]',
        e: 'List: Add list element',
        d: 'Flash: [flash=width,height]http://url[/flash]'
            }

    var panels = new Array('options-panel', 'attach-panel', 'poll-panel');
    var show_panel = 'options-panel';


// ]]>
</script>

be sure to edit

    var form_name = 'formdata';
    var text_name = 'descr';

to your form name and text area name
now where you want to add the pallet (with in the form) put this code

<div id="colour_palette" style="display: none;">
    <dl style="clear: left;">
        <dt><label>Font colour:</label></dt>
        <dd>

        <script type="text/javascript">
        // <![CDATA[
            function change_palette()
            {
                dE('colour_palette');
                e = document.getElementById('colour_palette');
                
                if (e.style.display == 'block')
                {
                    document.getElementById('bbpalette').value = 'Hide font colour';
                }
                else
                {
                    document.getElementById('bbpalette').value = 'Font colour';
                }
            }

            colorPalette('h', 15, 10);
        // ]]>
        </script>
        </dd>
    </dl>
</div>
    <input type="button" class="button2" name="bbpalette" id="bbpalette" value="Font colour" onclick="change_palette();" title="Font colour: [color=red]text[/color]  Tip: you can also use color=#FF0000" />

You can see this work here
phpMyBitTorrentV2.0.3