I'm allready tried tinyMCE but it's too much complicated for me, i found this java script on some forum instead and with her I manage to achieve something. You can take a look at
http://www.gentoo-srbija.org/forum.html
You must be logged to see form so here is the test user account:
user: test_user pwd: password
And here is the script, don't know how opera is behaving but Firefox and IE are OK.
// bbCode control by
// subBlue design
// [url=http://www.subBlue.com]www.subBlue.com[/url]
// Startup variables
var imageTag = false;
var theSelection = false; // Check for Browser & Platform for PC & IE specific bits
// More details from: [url=http://www.mozilla.org/docs/web-developer/sniffer/browser_type.ht ml]http://www.mozilla.org/docs/web-developer/sniffer/browser_type.html [/url]
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_nav = ((clientPC.indexOf('mozilla')!=-1) && (clientPC.indexOf('spoofer')==-1)
&& (clientPC.indexOf('compatible') == -1) && (clientPC.indexOf('opera')==-1)
&& (clientPC.indexOf('webtv')==-1) && (clientPC.indexOf('hotjava')==-1));
var is_moz = 0; var is_win = ((clientPC.indexOf("win")!=-1) || (clientPC.indexOf("16bit") != -1));
var is_mac = (clientPC.indexOf("mac")!=-1); // Helpline messages
d_help = "Stilove možete primeniti na selektovani tekst."; b_help = "Boldirani tekst: [b]text[/b]";
i_help = "Italik tekst: [i]text[/i]";
u_help = "Podvučeni tekst: [u]text[/u]"; q_help = "Citat: [quote]text[/quote] ili [quote=korisnik]text[/quote]";
c_help = "Prikaz koda: [code]code[/code] ili za naslov koda [code=naslov]code[/code]";
p_help = "Ubacivanje slike: [img]http://www.server.org/image.jpg[/img]";
w_help = "Ubacivanje linka: [url=http://www.server.org] http://www.server.org[/url] or [url=http://www.server.org] URL text[/url]";
fcr_help = "Crvena boja slova [predefinisana]"; fcg_help = "Zelena boja slova [predefinisana]"; fcb_help = "Plava boja slova [predefinisana]";
// Define the bbCode tags
bbcode = new Array();
bbtags = new Array(
'[b]','[/b]', //0
'[i]','[/i]', //2
'[u]','[/u]', //4
'[quote]','[/quote]', //6
'[code]','[/code]', //8
'[ulist]','[/ulist]', //10
'[list]','[/list]', //12
'[img]','[/img]', //14
'[url=',']','[/url]', //16
'[sub]','[/sub]', //18
'[sup]','[/sup]', //20
'[s]','[/s]', //22
'[email]','[/email]', //24
'[align]','[/align]', //26
'[li]','[/li]', //28
'[font #cc1705]','[/font]', //30 red
'[font #0b8c0b]','[/font]', //32 green
'[font #2e1787]','[/font]' //34 blue );
imageTag = false; // Shows the help messages in the helpline window
function helpline(help) {
//alert('helpline: '+help);
// frm = getForm();
document.getElementById('helpbox').value=eval(help + "_help");
// frm.helpbox.value = eval(help + "_help");
}
// Replacement for arrayname.length property
function getarraysize(thearray) {
for (i = 0; i < thearray.length; i++) {
if ((thearray[i] == "undefined") || (thearray[i] == "") || (thearray[i] == null))
return i;
}
return thearray.length;
} // Replacement for arrayname.push(value) not implemented in IE until version 5.5
// Appends element to the array
function arraypush(thearray,value) {
thearray[ getarraysize(thearray) ] = value;
} // Replacement for arrayname.pop() not implemented in IE until version 5.5
// Removes and returns the last element of an array
function arraypop(thearray) {
thearraysize = getarraysize(thearray);
retval = thearray[thearraysize - 1];
delete thearray[thearraysize - 1];
return retval;
}
function bbstyle(bbnumber, arg) {
var txtarea = getTxtarea(); txtarea.focus();
donotinsert = false;
theSelection = false;
bblast = 0; if (bbnumber == -1) { // Close all open tags & default button names
while (bbcode[0]) {
butnumber = arraypop(bbcode) - 1;
txtarea.value += bbtags[butnumber + 1];
deactivateButton(butnumber);
}
imageTag = false; // All tags are closed including image tags :D
txtarea.focus();
return;
} if ((clientVer >= 4) && is_ie && is_win)
{
theSelection = document.selection.createRange().text; // Get text selection
if (theSelection) {
// Add optional argument to the tag
opentag = bbtags[bbnumber];
if (arg) {
opentag = opentag.substring(0, opentag.length-1) + '=' + arg + ']';
} // Add tags around selection
document.selection.createRange().text = opentag + theSelection + bbtags[bbnumber+1];
txtarea.focus();
theSelection = '';
return;
}
}
else if (txtarea.selectionEnd && (txtarea.selectionEnd - txtarea.selectionStart > 0))
{
mozWrap(txtarea, bbtags[bbnumber], bbtags[bbnumber+1], arg);
return;
} // Find last occurance of an open tag the same as the one just clicked
for (i = 0; i < bbcode.length; i++) {
if (bbcode[i] == bbnumber+1) {
bblast = i;
donotinsert = true;
}
} if (donotinsert) { // Close all open tags up to the one just clicked & default button names
while (bbcode[bblast]) {
butnumber = arraypop(bbcode) - 1;
txtarea.value += bbtags[butnumber + 1];
deactivateButton(butnumber);
imageTag = false;
}
txtarea.focus();
return;
} else { // Open tags if (imageTag && (bbnumber != 14)) { // Close image tag before adding another
txtarea.value += bbtags[15];
lastValue = arraypop(bbcode) - 1; // Remove the close image tag from the list
deactivateButton(14);
imageTag = false;
} // Open tag
// Add optional argument to the tag
opentag = bbtags[bbnumber];
if (arg) {
opentag = opentag.substring(0, opentag.length-1) + '=' + arg + ']';
}
txtarea.value += opentag;
if ((bbnumber == 14) && (imageTag == false)) imageTag = 1; // Check to stop additional tags after an unclosed image tag
arraypush(bbcode,bbnumber+1);
activateButton(bbnumber);
txtarea.focus();
return;
}
storeCaret(txtarea);
} function activateButton(btnnr) {
frm = getForm();
btn = eval('frm.addbbcode' + btnnr);
if (btn.type == 'button') {
btn.value += '*';
}
} function deactivateButton(btnnr) {
frm = getForm();
btn = eval('frm.addbbcode' + btnnr);
if (btn.type == 'button') {
btn.value = btn.value.substr(0,(btn.value.length - 1));
}
} // From [url=http://www.massless.org/mozedit/]http://www.massless.org/mozedit/ [/url]
function mozWrap(txtarea, open, close, arg)
{
// Add optional argument to the tag
opentag = open;
if (arg) {
opentag = opentag.substring(0, opentag.length-1) + '=' + arg + ']';
} var selLength = txtarea.textLength;
var selStart = txtarea.selectionStart;
var selEnd = txtarea.selectionEnd;
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 + opentag + s2 + close + s3;
return;
} // Insert at Claret position. Code from
// [url=http://www.faqts.com/knowledge_base/view.phtml/aid/1052/fid/130]h ttp://www.faqts.com/knowledge_base/view.phtml/aid/1052/fid/130[/url]
function storeCaret(textEl) {
if (textEl.createTextRange) textEl.caretPos = document.selection.createRange().duplicate();
}
/*
function bbfontstyle(bbopen, bbclose) {
var txtarea = getTxtarea(); if ((clientVer >= 4) && is_ie && is_win) {
theSelection = document.selection.createRange().text;
if (!theSelection) {
txtarea.value += bbopen + bbclose;
txtarea.focus();
return;
}
document.selection.createRange().text = bbopen + theSelection + bbclose;
txtarea.focus();
return;
}
else if (txtarea.selectionEnd && (txtarea.selectionEnd - txtarea.selectionStart > 0))
{
mozWrap(txtarea, bbopen, bbclose);
return;
}
else
{
txtarea.value += bbopen + bbclose;
txtarea.focus();
}
storeCaret(txtarea);
}*/ |