Scratch

billyedward · 2010-02-13 22:38:36

My suggestion is that we add a toolbar to the top of new post entry fields, to make entering BBcode in easier.

Here is a working draft I threw together:

Code:

<html>
<head>

</head>
<body>
<button onclick='document.getElementById("post").value+="[b]"+prompt("Please enter the text you would like bolded:")+"[/b]"'><b>B</b></button>

<button onclick='document.getElementById("post").value+="[i]"+prompt("Please enter the text you would like italicised:")+"[/i]"'><i>I</i></button>

<button onclick='document.getElementById("post").value+="[u]"+prompt("Please enter the text you would like underlined:")+"[/u]"'><u>U</u></button>|

<button onclick='document.getElementById("post").value+="[color="+prompt("Please enter the text you would like colour you would like the text to be:")+"]"+prompt("Please enter the text you would like coloured:")+"[/colour]"'><font color='red'>C</font><font color='orange'>o</font><font color='yellow'>l</font><font color='green'>o</font><font color='blue'>u</font><font color='violet'>r</font></button>

<button onclick='document.getElementById("post").value+="\n[code]\n\n[/code]"'><code>code</code></button>

<button onclick='document.getElementById("post").value+="[url="+prompt("Please enter the web address you would like to link to:")+"]"+prompt("Please enter the text to display:")+"[/url]"'><a href='javascript:void'>link</a></button>

<button onclick='document.getElementById("post").value+="[email]"+prompt("Please enter the email address you would like to link to:")+"[/email]"'><a href='javascript:void'>email</a></button>

<button onclick='document.getElementById("post").value+="[quote="+prompt("Please enter the name of the person you are quoting:")+"]"+prompt("Please enter the quote text:")+"[/quote]"'><q>quote</q></button>

<button onclick='document.getElementById("post").value+="[img]"+prompt("Please enter the URL of the image:")+"[/img]"'><span style='border:1px solid black'>image</span></button>

<button onclick='document.getElementById("smileys").style.display=(document.getElementById("smileys").style.display=="block") ? "none" : "block"'>:)</button>
<br/>
<div id='smileys' style='display:none'>
<img src='http://scratch.mit.edu/forums/img/smilies/smile.png' onclick='document.getElementById("post").value+=":)"'>
<img src='http://scratch.mit.edu/forums/img/smilies/neutral.png' onclick='document.getElementById("post").value+=":|"'>
<img src='http://scratch.mit.edu/forums/img/smilies/sad.png' onclick='document.getElementById("post").value+=":("'>
<img src='http://scratch.mit.edu/forums/img/smilies/big_smile.png' onclick='document.getElementById("post").value+=":D"'>
<img src='http://scratch.mit.edu/forums/img/smilies/yikes.png' onclick='document.getElementById("post").value+=":o"'>
<img src='http://scratch.mit.edu/forums/img/smilies/wink.png' onclick='document.getElementById("post").value+=";)"'>
<img src='http://scratch.mit.edu/forums/img/smilies/hmm.png' onclick='document.getElementById("post").value+=":/"'>
<img src='http://scratch.mit.edu/forums/img/smilies/tongue.png' onclick='document.getElementById("post").value+=":P"'>
<img src='http://scratch.mit.edu/forums/img/smilies/lol.png' onclick='document.getElementById("post").value+=":lol:"'>
<img src='http://scratch.mit.edu/forums/img/smilies/mad.png' onclick='document.getElementById("post").value+=":mad:"'>
<img src='http://scratch.mit.edu/forums/img/smilies/roll.png' onclick='document.getElementById("post").value+=":rolleyes:"'>
<img src='http://scratch.mit.edu/forums/img/smilies/cool.png' onclick='document.getElementById("post").value+=":cool:"'>
</div>

<textarea id='post' style='width:530px;height:200px'></textarea>
</body>
</html>

Of course, it is not polished up enough yet, but it gives the general gist of what I mean.

Any suggestions as to what would be good/bad, and what should and shouldn't be included are greatly appreciated.

P.s. To the scratch team: I would be glad to donate my time to help coding this, if you would like.

ihaveamac · 2010-02-13 22:53:25

Yes.
Yes.
Yes.
Yes.
Needed.

midnightleopard · 2010-09-03 08:31:16

I agree! Also, bump!

FlexiStudio · 2010-09-04 13:02:28

On my site, it looks like this little quick post box at the bottom. Where you see the links, BBCode: on [img] tag: on Smiles: on, there are images of all the smilies you can enter. When clicked, it inserts the text like : and ) into the text box. Ill get a bit of the code in a second and post it on here....

coolstuff · 2010-09-04 14:04:15

I agree - it would be helpful, and would eliminate the load of posts we get describing how to use BBCode tongue

Jonathanpb · 2010-09-04 19:29:36

Hey, that would be really useful! big_smile

Chrischb · 2010-09-04 22:17:00

Like what they have on the wiki? I support! big_smile

Scratch

archived forums

#1 2010-02-13 22:38:36

BB code 'toolbar'

Code:

#2 2010-02-13 22:53:25

Re: BB code 'toolbar'

#3 2010-09-03 08:31:16

Re: BB code 'toolbar'

#4 2010-09-04 13:02:28

Re: BB code 'toolbar'

#5 2010-09-04 14:04:15

Re: BB code 'toolbar'

#6 2010-09-04 19:29:36

Re: BB code 'toolbar'

#7 2010-09-04 22:17:00

Re: BB code 'toolbar'

Board footer