[php] UBB parser

[compfreak986]

================================================== ==========================
Author: compfreak986
Title: Building a simple UBB-parser
Owner: Compfreak986 / New Visual Basic Coders
Copyright © New Visual Basic Coders 2005-2006

You can copy this tutorial If you keep this copyright notice with it(on top or at the bottom).
================================================== ==========================

Hi,

I'm going to learn you guys how to build a UBB parser.
So, What is UBB?
Ubb are tags like the [url ] tags in many forums. It's is made so people couldn't use bad HTML(javascript etc.).

What tags are we going to make?

[b ][/b]
[i ][/i]
[u ][/u]
[s ][/s]
[manual ][/manual]
[url ][/url]
[url= ][/url]
[img ][/img]
[quote ][/quote]
[quote= ][/ quote]
[code ][/ code]
[google ][/google]
[ot ][/ot]
[list ][/list]
[* ]

That are all tags we're going to use.
How will we do that?
Well we're going to use Regular expressions. Regular expressions are looking difficult but aren't.

Let's start with the [b ] tag. The regular expresion looks like:

/\[ b\](.*?)\[\/b\]/

This is a really simpel one, first of all we have a '/' at the beginning and the end. This means that the regular expression is between the slashes. Than we have \[b\] \[\/b\] all backslasjhes over her are for escaping '[',']','/' that's becuase we want them in the output. Else if we just used the code would only search for a 'b'. Also the slash has be escaped else the regular expression would end at the slash in [/b ]. And in the middle we have (.*?). The dot means that every sign except a newline(\n) will be used. Butt wen you want the newline to be taken too you can use [\n].

For the replacement we're going to use the preg_replace()-function more info: http://be2.php.net/preg-replace It needs 3 parameters, the text to search for, the replacement string and the string where you want to replace the string you search for.
We are going to replace

/\[ b\](.*?)\[\/b\]/

with

/1

So it will become: $string = str_replace('/\[ b\](.*?)\[\/b\]/','\1',$string);
When we make a function to parse everything we get:

<?php
Function ParseUBB($string){
$string = nl2br($string);

$string = str_replace('/\[ b\](.*?)\[\/b\]/','\1',$string);

return $string;
}

echo ParseUBB($_POST['message']);
?>

I also used nl2br() here, I did that so we wont have troibles with newlines.
This is the standard and now whe are going to make the other tags.

<?php

function ParseUbb($string){ 

$string = nl2br($string);
//b,i,u,s,ot
$string = preg_replace('/\[b\](.*?)\[\/b\]/is','\1',$string);
$string = preg_replace('/\[i\](.*?)\[\/i\]/is','\1',$string);
$string = preg_replace('/\[u\](.*?)\[\/u\]/is','<u>\1</u>',$string);
$string = preg_replace('/\[s\](.*?)\[\/s\]/is','<span class="strike">\1</span>',$string);
$string = preg_replace('/\[ot\](.*?)\[\/ot\]/is','<span class="ot">\1</span>',$string);

//manual,url,url=,img,quote,quote=,code,php,google,list
$string = preg_replace('/\[manual\](.*?)\[\/manual\]/is','PHPmanual: \1',$string);
$string = preg_replace('/\[google\](.*?)\[\/google\]/is','Search google with: \1',$string);
$string = preg_replace('/\[url\](.*?)\[\/url\]/is','\1',$string);
$string = preg_replace('/\[url=(.*?)\](.*?)\[\/url\]/is','\2',$string);
$string = preg_replace('/\[img\](.*?)\[\/img\]/is','[img]\1[/img]',$string);
$string = preg_replace('/\[quote\](.*?)\[\/quote\]/is','<div class="quote">\1</div>',$string);
$string = preg_replace('/\[quote=(.*?)\](.*?)\[\/quote\]/is','Gepost door \1:
<div class="quote">\2</div>',$string);
$string = preg_replace('/\[code\](.*?)\[\/code\]/is','<div class="code">\1</div>',$string);
$string = preg_replace('/\[list\](.*?)\[\/list\]/is','<ul>\1[/list]',$string;
$string = preg_replace('/\[\*\](.*?)[\r\n]/is','[*]\1',$string);

return $string; 
}

if(isset($_POST['b'])){
echo ParseUBB($_POST['message']);
}else{
echo '<form action="" method="POST">';
echo '<textarea name="message" cols="25" rows="10"></textarea>';
echo '<input type="submit" name="b">';
echo '</form>';
}
?>

Add following CSS to your page:

<style type="text/CSS"> 
.strike{text-decoration: line-trough} 
.code{border: 1px solid #0000ff; padding: 4px; height: auto; width: auto}
.quote{border: 1px solid #ff0000; padding: 4px; height: auto; width: auto}
.ot{font-size:8pt; font-color: #cccccc}
</style>

This was the tag-parser. Now we're going to build the smilieparser.
This time we're going to us str_replace(), it has the same arguments except you don't have to use regular expressions.
the smilies you can find here: http://www.dhost.info/compfreak986/blog/UBB/smilies
I'm going to give the example with biggrin.gif.

$string = str_replace(':D','[img]./smilies/biggrin.gif[/img]', $string);

Now the total code:

<?php
function ParseSmilies($string){

$string = str_replace(':@','[img]./smilies/angry.gif[/img]',$string);
$string = str_replace(':D','[img]./smilies/biggrin.gif[/img]',$string);
$string = str_replace(':beer:','[img]./smilies/biertje.gif[/img]',$string);
$string = str_replace(':?','[img]./smilies/confuse.gif[/img]',$string);
$string = str_replace('8)','[img]./smilies/cool.gif[/img]',$string);
$string = str_replace(':cry:','[img]./smilies/cry.gif[/img]',$string);
$string = str_replace(':evil:','[img]./smilies/devil.gif[/img]',$string);
$string = str_replace(':die:','[img]./smilies/die.gif[/img]',$string);
$string = str_replace(':lol:','[img]./smilies/lol.gif[/img]',$string);
$string = str_replace(':ot:','[img]./smilies/offtopic.gif[/img]',$string);
$string = str_replace(':omg:','[img]./smilies/omg.gif[/img]',$string);
$string = str_replace(':puke:','[img]./smilies/puke.gif[/img]',$string);
$string = str_replace(':)','[img]./smilies/smile.gif[/img]',$string);
$string = str_replace(':x','[img]./smilies/tss.gif[/img]',$string);
$string = str_replace(';)','[img]./smilies/wink.gif[/img]',$string);
}

if(isset($_POST['b'])){
echo ParseSmilies($_POST['message']);
}else{
echo '<form action="" method="POST">';
echo '<textarea name="message" cols="25" rows="10"></textarea>';
echo '<input type="submit" name="b">';
echo '</form>';
}
?>

Now we have a UBB-parser and a smilie-parser.
We are going to combine these in one file.

<?php
function ParseUbb($string){ 

$string = nl2br($string);
//b,i,u,s,ot
$string = preg_replace('/\[b\](.*?)\[\/b\]/is','\1',$string);
$string = preg_replace('/\[i\](.*?)\[\/i\]/is','\1',$string);
$string = preg_replace('/\[u\](.*?)\[\/u\]/is','<u>\1</u>',$string);
$string = preg_replace('/\[s\](.*?)\[\/s\]/is','<span class="strike">\1</span>',$string);
$string = preg_replace('/\[ot\](.*?)\[\/ot\]/is','<span class="ot">\1</span>',$string);

//manual,url,url=,img,quote,quote=,code,php,google,list
$string = preg_replace('/\[manual\](.*?)\[\/manual\]/is','PHPmanual: \1',$string);
$string = preg_replace('/\[google\](.*?)\[\/google\]/is','Search google with: \1',$string);
$string = preg_replace('/\[url\](.*?)\[\/url\]/is','\1',$string);
$string = preg_replace('/\[url=(.*?)\](.*?)\[\/url\]/is','\2',$string);
$string = preg_replace('/\[img\](.*?)\[\/img\]/is','[img]\1[/img]',$string);
$string = preg_replace('/\[quote\](.*?)\[\/quote\]/is','<div class="quote">\1</div>',$string);
$string = preg_replace('/\[quote=(.*?)\](.*?)\[\/quote\]/is','Gepost door \1:
<div class="quote">\2</div>',$string);
$string = preg_replace('/\[code\](.*?)\[\/code\]/is','<div class="code">\1</div>',$string);
$string = preg_replace('/\[list\](.*?)\[\/list\]/is','<ul>\1[/list]',$string;
$string = preg_replace('/\[\*\](.*?)[\r\n]/is','[*]\1',$string);

return $string; 
}

function ParseSmilies($string){

$string = str_replace(':@','[img]./smilies/angry.gif[/img]',$string);
$string = str_replace(':D','[img]./smilies/biggrin.gif[/img]',$string);
$string = str_replace(':beer:','[img]./smilies/biertje.gif[/img]',$string);
$string = str_replace(':?','[img]./smilies/confuse.gif[/img]',$string);
$string = str_replace('8)','[img]./smilies/cool.gif[/img]',$string);
$string = str_replace(':cry:','[img]./smilies/cry.gif[/img]',$string);
$string = str_replace(':evil:','[img]./smilies/devil.gif[/img]',$string);
$string = str_replace(':die:','[img]./smilies/die.gif[/img]',$string);
$string = str_replace(':lol:','[img]./smilies/lol.gif[/img]',$string);
$string = str_replace(':ot:','[img]./smilies/offtopic.gif[/img]',$string);
$string = str_replace(':omg:','[img]./smilies/omg.gif[/img]',$string);
$string = str_replace(':puke:','[img]./smilies/puke.gif[/img]',$string);
$string = str_replace(':)','[img]./smilies/smile.gif[/img]',$string);
$string = str_replace(':x','[img]./smilies/tss.gif[/img]',$string);
$string = str_replace(';)','[img]./smilies/wink.gif[/img]',$string);
}

if(isset($_POST['b'])){
echo ParseSmilies(ParseUBB($_POST['message']));
}else{
echo '<form action="" method="POST">';
echo '<textarea name="message" cols="25" rows="10"></textarea>';
echo '<input type="submit" name="b">';
echo '</form>';
}
?>

This is a simple UBB-parser, You can build also a PHP-tag butt that is harder to do.

Once my badwords filter is finished, I'll post it here to als a reply.

Greetz

compfreak986

[JoshB]

Nice tutorial you got there compfreak986, really helped me get to grips with UBB-parsers. I would like to see a simple badwords tut, if you do do one!

[compfreak986]

It is really simple,
you make an array with the badwords.
so:

$badwords = array("fuck","shit","asshole");

Than you have 2 options, 1: make a standard replacement like: ***** than you replace with "*****"
or an array of replacements:

$replacement = array("****","****","*******"); //different replacements
$replacement = "*****"; //single replacement

Than you use str_replace:

$badwords = array("fuck","shit","asshole"); //badwords
$replacement = array("****","****","*******"); //different replacements

$string = str_replace($badwords,$replacement,$string);

It's as simple as that.
Hope you get the hole idea of the badwordsfilter.

[Jon]

there is an easier BB code script like this one:

<?php

//  First we assign our 'BBCodes' in an
//  Associative Array.
//  -----------------------------------
$bb_codes = array(
    # bold
  '[b]' => '<span style="font-weight:bold">',
  '[/b]' => '</span>',
    # italic
  '[i]' => '<span style="font-style:italic">',
  '[/i]' => '</span>',
    # underline
  '[u]' => '<span style="text-decoration:underline">',
  '[/u]' => '</span>',
    # smilies
  ':)' => '[img]/images/smilie.gif[/img]',
  ':(' => '[img]/images/sad.gif[/img]'
    # note the missing comma after the last line above
);

//  -----------------------------------

?>

<?php

function convert_bbcodes( $t ) 
{   $search = array_keys( $GLOBALS['bb_codes'] );
  $t = str_replace( $search, $GLOBALS['bb_codes'], $t );
  return $t;
}

?>

<?php 

//  Filename: test.php 
//  ================== 

//  Our sample text 
$text = 'I want this to be in [b]bold[/b] and this ' 
       .'to be in [b]bold[/b] too.  While that is ' 
       .'being done, how about something ' 
       .'[u]underlined[/u]? :) :('; 

//  Now we pass our sample text through the function. 
echo '

'.convert_bbcodes( $text ).'</p>'; 

//  =================================================
//  now we paste our CONVERT_BBCODES() function below 
//  ================================================= 

function convert_bbcodes( $t ) 
{   $search = array_keys( $GLOBALS['bb_codes'] );
  $t = str_replace( $search, $GLOBALS['bb_codes'], $t );
  return $t;
}
?>

[compfreak986]

One problem, they can exploit it.
If you only use [b ] the rest of the page will be bold.
That's why i use Regular expressions, they are safer.

[Jon]

well it will only be bold in the text area but your are correct it will cause it to be bold. I wouldn't really call making your whole post bold an exploit really?

[compfreak986]

If you are building a forum, you'll parse it and your whole layout will be bold or underline or ...

[Jon]

only if you don't build it properly, WestBoard, which is my bulletin board, will only format the post, so anything else is safe if you forget to end the tag. It really depends on if you program it so you eliminate exploits or not, even though you have said an exploit with mine, i just get ride of it else where in the layout.

[compfreak986]

Butt regular expressions take care of that for you.
it doesn't parse [b]

@JoshB:
I have build a really simple MySQL-based "badwords"-filter.

SQL:

CREATE TABLE `badwords` (
  `badword` text NOT NULL
) TYPE=MyISAM;

Badwords-function:

function badwords($string){

$query = "SELECT * FROM badwords";
$data = mysql_query($query) or die(mysql_error());

while($badwords = mysql_fetch_assoc($data)){

$string = str_replace($badwords['badword'], '*censored*',$string);

}

return $string;

}

[compfreak986]

Sorry for the bumping but I've got another snippet, it should be quicker:

function foreach_parse($text){
$UBB = array(
'/\[manual\](.*?)\[\/manual\]/is' => 'PHP.net over: \1',
'/\[google\](.*?)\[\/google\]/is' => 'Zoek op  google met \1',
'/\[url\](.*?)\[\/url\]/is' => '\1',
'/\[url=(.*?)\](.*?)\[\/url\]/is' => '\2',
'/\[img\](.*?)\[\/img\]/is' => '[img]\1[/img]',
'/\[quote\](.*?)\[\/quote\]/is' => '<div class="quote">\1</div>',
'/\[quote=(.*?)\](.*?)\[\/quote\]/is' => 'Gepost door \1:
<div class="quote">\2</div>',
'/\[code\](.*?)\[\/code\]/is' => '<div class="code">\1</div>',
'/\[list\](.*?)\[\/list\]/is' => '<ul>\1[/list]',
'/\[\*\](.*?)[\r\n]/is' => '[*]\1',
'/\[spoiler=(.*?)\](.*?)\[\/spoiler\]/is' => '<div class="title" onClick="spoiler(this);">\1</div><div class="spoiler">\2</div>',
'/\[b\](.*?)\[\/b\]/is' => '\1',
'/\[i\](.*?)\[\/i\]/is' => '\1',
'/\[u\](.*?)\[\/u\]/is' => '<u>\1</u>',
'/\[s\](.*?)\[\/s\]/is' => '<span class="strike">\1</span>',
'/\[ot\](.*?)\[\/ot\]/is' => '<span class="ot">\1</span>');

foreach($UBB as $bb => $html){
$text = preg_replace($bb,$html,$text);
}

return $text;
}

I also work with an array and a foreach expression.
The foreach-expression was very helpful to me, I couldn't get the whole meaning of foreach before but now I see why it is easier, the code is way smaller.

if you compare the size of both scripts, you'll see the second script is 0.4 kb smaller.
You would use 4 GB bandwith less every 10000 hits.
That should help very much when you have a big site(like wtricks).