|
|
 |
September 1st, 2007, 04:39 PM
|
#1
|
|
Highly Reputable Member
Join Date: Jul 2006
Location: Devon, England
Posts: 565
Thanks: 0
Thanked 0 Times in 0 Posts
Rep Altering Power: 0
|
Function to convert BBcode to HTML
I found an article here http://www.iceteks.com/articles.php/javascript/1 on how to use BBcode in forms whcih works fine but I am having trouble converting the BBcode back to HTML so it can be inserted into the database. The second part of the article is here http://www.iceteks.com/articles.php/javascript2/1
When I enter some data into the textarea, add some BBcode tags and click preview, I get nothing displayed.
I don't know what is going wrong.
Here is the form which does as it's supposed to
Code:
<html><head>
<title>Editor</title>
<script src="editor.js"></script>
<link rel="stylesheet" type="text/css" href="style.css" />
</head><body>
<form action="bbcode2.php" method="post" name="editform" onsubmit="return checkForm(this)">
<table id="editform">
<tr>
<td colspan="2" id="header">Post a new message</td>
</tr>
<tr id="subject">
<td>Subject:</td>
<td><input type="text" name="subject" size="50" class="form_elements_text"/></td>
</tr>
<tr>
<td rowspan="2" id="smilies">Smilies
<a href="javascript:smilie(':)')">
<img src="smile.gif" alt="smile" title="smile" /></a>
<a href="javascript:smilie(':D')">
<img src="biggrin.gif" alt="big grin" title="big grin"/></a>
<a href="javascript:smilie(':p')">
<img src="razz.gif" alt="razz" title="razz" /></a></td>
<td>
<input type="button" class="button" value="bold" name="bold" onclick="javascript:tag('b', '', 'bold*', '', 'bold', 'bold');" onMouseOver="helpline('bold')" />
<input type="button" class="button" value="italic" name="italic" onclick="javascript:tag('i', '', 'italic*', '', 'italic', 'italic');" onMouseOver="helpline('italic')" />
<input type="button" class="button" value="underline" name="underline" onclick="javascript:tag('u', '', 'underline*', '', 'underline', 'underline');" onMouseOver="helpline('underline')" />
<input type="button" class="button" value="quote" name="quote" onclick="javascript:tag('q', '
', 'quote', 'quote');" onMouseOver="helpline('quote')" />
<input type="button" class="button" value="code" name="code" onclick="javascript:tag('c', '
', 'code', 'code');" onMouseOver="helpline('code')" />
<input type="button" class="button" value="url" name="url" onclick="javascript:tag('url', '', 'url*', '', 'url', 'url');" onMouseOver="helpline('url')" />
<input type="button" class="button" value="img" name="img" onclick="javascript:tag('img', '[img]', 'img*', '[/img]', 'img', 'img');" onMouseOver="helpline('img')" />
<br />
Font size: <select name="fontsize" onChange="font('[size=' + this.form.fontsize.options[this.form.fontsize.selectedIndex].value + ']', '[/size]'); this.selectedIndex=2;" onMouseOver="helpline('fontsize')" class="form_elements_dropdown">
<option value="50%" >Tiny</option>
<option value="75%" >Small</option>
<option value="100%" selected >Normal</option>
<option value="150%" >Large</option>
<option value="200%" >Huge</option>
</select>
Font color: <select name="fontcolor" onChange="font('[color=' + this.form.fontcolor.options[this.form.fontcolor.selectedIndex].value + ']', '[/color]'); this.selectedIndex=0;" onMouseOver="helpline('fontcolor')" class="form_elements_dropdown" >
<option value="black" style="color:black">Black</option>
<option value="silver" style="color:silver">Silver</option>
<option value="gray" style="color:gray">Gray</option>
<option value="maroon" style="color:maroon">Maroon</option>
<option value="red" style="color:red">Red</option> <option value="purple" style="color:purple">Purple</option>
<option value="fuchsia" style="color:fuchsia">Fuchsia</option>
<option value="navy" style="color:navy">Navy</option>
<option value="blue" style="color:blue">Blue</option>
<option value="aqua" style="color:aqua">Aqua</option>
<option value="teal" style="color:teal">Teal</option>
<option value="lime" style="color:lime">Lime</option>
<option value="green" style="color:green">Green</option>
<option value="olive" style="color:olive">Olive</option>
<option value="yellow" style="color:yellow">Yellow</option>
<option value="white" style="color:white">White</option> </select>
<br />
<input type="text" name="helpbox" size="75" class="helpbox" readonly="readonly"/>
</td>
</tr>
<tr>
<td>
Post:<br />
<textarea rows="10" cols="50" name="post" class="form_elements_text"></textarea>
</td>
</tr>
<tr>
<td colspan="2" id="post">
<input type="submit" name="Post" value="Post" class="button" />
<input type="submit" name="preview" value="Preview" class="button"/>
<input type="reset" value="Start over" class="button" onclick="javascript:confirm_reset();"/>
</td>
</tr>
</table>
</form>
</body></html>
I have 2 different examples on how to convert BBcode to HTML.
This one is the second part of the article but it doesn't work for me
Code:
<?php
$post = $_POST['post'];
function output_post ($post) {
//Make safe any html
$post_no_html = htmlspecialchars($post);
//Make sure there is no whitespace at the end of the message
//It's conceivable that the user will start their message with whitespace
$post_abridged = chop($post_no_html);
//Callback function for preg_replace_callback below
function convert_for_html ($matches) {
$regex[0] = "[";
$regex[1] = "]";
$replace[0] = "[";
$replace[1] = "]";
ksort($regex);
ksort($replace);
$treated = str_replace($regex, $replace, $matches[1]);
$output = '<table class="code"><tr><td>Code:</td></tr><tr><td class="code_box">' . $treated . '</td></tr></table>';
return $output;
}
//Convert code tags
$code_treated = preg_replace_callback(
"/\[code\](.+?)\[\/code\]/s",
"convert_for_html",
$post_abridged);
//Arrays for the bbCode replacements
$bbcode_regex = array(0 => '/\[b\](.+?)\[\/b\]/s',
1 => '/\[i\](.+?)\[\/i\]/s',
2 => '/\[u\](.+?)\[\/u\]/s',
3 => '/\[quote\](.+?)\[\/quote\]/s',
4 => '/\[quote\=(.+?)](.+?)\[\/quote\]/s',
5 => '/\[url\](.+?)\[\/url\]/s',
6 => '/\[url\=(.+?)\](.+?)\[\/url\]/s',
7 => '/\[img\](.+?)\[\/img\]/s',
8 => '/\[color\=(.+?)\](.+?)\[\/color\]/s',
9 => '/\[size\=(.+?)\](.+?)\[\/size\]/s');
$bbcode_replace = array(0 => '<b>$1</b>',
1 => '<i>$1</i>',
2 => '<u>$1</u>',
3 => '<table class="quote"><tr><td>Quote:</td></tr><tr><td class="quote_box">$1</td></tr></table>',
4 => '<table class="quote"><tr><td>$1 said:</td></tr><tr><td class="quote_box">$2</td></tr></table>',
5 => '<a href="$1">$1</a>',
6 => '<a href="$1">$2</a>',
7 => '<img src="$1" alt="User submitted image" title="User submitted image"/>',
8 => '<span style="color:$1">$2</span>',
9 => '<span style="font-size:$1">$2</span>');
ksort($bbcode_regex);
ksort($bbcode_replace);
//preg_replace to convert all remaining bbCode tags
$post_bbcode_treated = preg_replace($bbcode_regex, $bbcode_replace, $code_treated);
//Convert new lines to <br />
$post_with_br = nl2br($post_bbcode_treated);
echo $post_with_br;
}
?>
and this is the other one which also doesn't work for me
Code:
<?php
//BBcode 2 HTML was written by WAY2WEB.net
//It is free for you to use anywhere as long as you provide a link back to www.way2web.net
function BBCode($Text)
{
// Replace any html brackets with HTML Entities to prevent executing HTML or script
// Don't use strip_tags here because it breaks [ url ] search by replacing & with amp
$Text = str_replace("<", "<", $Text);
$Text = str_replace(">", ">", $Text);
// Convert new line chars to html <br /> tags
$Text = nl2br($Text);
// Set up the parameters for a URL search string
$URLSearchString = " a-zA-Z0-9\:\/\-\?\&\.\=\_\~\#\'";
// Set up the parameters for a MAIL search string
$MAILSearchString = $URLSearchString . " a-zA-Z0-9\.@";
// Perform URL Search
$Text = preg_replace("/\[url\]([$URLSearchString]*)\[\/url\]/", '<a href="$1" target="_blank">$1</a>', $Text);
$Text = preg_replace("(\[url\=([$URLSearchString]*)\](.+?)\[/url\])", '<a href="$1" target="_blank">$2</a>', $Text);
//$Text = preg_replace("(\[url\=([$URLSearchString]*)\]([$URLSearchString]*)\[/url\])", '<a href="$1" target="_blank">$2</a>', $Text);
// Perform MAIL Search
$Text = preg_replace("(\[mail\]([$MAILSearchString]*)\[/mail\])", '<a href="mailto:$1">$1</a>', $Text);
$Text = preg_replace("/\[mail\=([$MAILSearchString]*)\](.+?)\[\/mail\]/", '<a href="mailto:$1">$2</a>', $Text);
// Check for bold text
$Text = preg_replace("(\[b\](.+?)\[\/b])is",'<span class="bold">$1</span>',$Text);
// Check for Italics text
$Text = preg_replace("(\[i\](.+?)\[\/i\])is",'<span class="italics">$1</span>',$Text);
// Check for Underline text
$Text = preg_replace("(\[u\](.+?)\[\/u\])is",'<span class="underline">$1</span>',$Text);
// Check for strike-through text
$Text = preg_replace("(\[s\](.+?)\[\/s\])is",'<span class="strikethrough">$1</span>',$Text);
// Check for over-line text
$Text = preg_replace("(\[o\](.+?)\[\/o\])is",'<span class="overline">$1</span>',$Text);
// Check for colored text
$Text = preg_replace("(\[color=(.+?)\](.+?)\[\/color\])is","<span style=\"color: $1\">$2</span>",$Text);
// Check for sized text
$Text = preg_replace("(\[size=(.+?)\](.+?)\[\/size\])is","<span style=\"font-size: $1px\">$2</span>",$Text);
// Check for list text
$Text = preg_replace("/\[list\](.+?)\[\/list\]/is", '<ul class="listbullet">$1</ul>' ,$Text);
$Text = preg_replace("/\[list=1\](.+?)\[\/list\]/is", '<ul class="listdecimal">$1</ul>' ,$Text);
$Text = preg_replace("/\[list=i\](.+?)\[\/list\]/s", '<ul class="listlowerroman">$1</ul>' ,$Text);
$Text = preg_replace("/\[list=I\](.+?)\[\/list\]/s", '<ul class="listupperroman">$1</ul>' ,$Text);
$Text = preg_replace("/\[list=a\](.+?)\[\/list\]/s", '<ul class="listloweralpha">$1</ul>' ,$Text);
$Text = preg_replace("/\[list=A\](.+?)\[\/list\]/s", '<ul class="listupperalpha">$1</ul>' ,$Text);
$Text = str_replace("[*]", "<li>", $Text);
// Check for font change text
$Text = preg_replace("(\[font=(.+?)\](.+?)\[\/font\])","<span style=\"font-family: $1;\">$2</span>",$Text);
// Declare the format for [ code ] layout
$CodeLayout = '<table width="90%" border="0" align="center" cellpadding="0" cellspacing="0">
<tr>
<td class="quotecodeheader"> Code:</td>
</tr>
<tr>
<td class="codebody">$1</td>
</tr>
</table>';
// Check for [ code ] text
$Text = preg_replace("/\[code\](.+?)\[\/code\]/is","$CodeLayout", $Text);
// Declare the format for [ php ] layout
$phpLayout = '<table width="90%" border="0" align="center" cellpadding="0" cellspacing="0">
<tr>
<td class="quotecodeheader"> Code:</td>
</tr>
<tr>
<td class="codebody">$1</td>
</tr>
</table>';
// Check for [ php ] text
$Text = preg_replace("/\[php\](.+?)\[\/php\]/is",$phpLayout, $Text);
// Declare the format for [ quote ] layout
$QuoteLayout = '<table width="90%" border="0" align="center" cellpadding="0" cellspacing="0">
<tr>
<td class="quotecodeheader"> Quote:</td>
</tr>
<tr>
<td class="quotebody">$1</td>
</tr>
</table>';
// Check for [ quote ] text
$Text = preg_replace("/\[quote\](.+?)\[\/quote\]/is","$QuoteLayout", $Text);
// Images
// [img]pathtoimage[/img]
$Text = preg_replace("/\[img\](.+?)\[\/img\]/", '<img src="$1">', $Text);
// [img=widthxheight]image source[/img]
$Text = preg_replace("/\[img\=([0-9]*)x([0-9]*)\](.+?)\[\/img\]/", '<img src="$3" height="$2" width="$1">', $Text);
return $Text;
}
$text = BBCode($Text);
echo $text;
?>
If anyone can help me get this working I would be very happy
Last edited by AdRock; September 1st, 2007 at 04:51 PM..
|
|
|
|
September 2nd, 2007, 01:35 AM
|
#2
|
|
Highly Reputable Member
SuperMember
Join Date: Sep 2007
Location: Australia
Age: 25
Posts: 956
Thanks: 0
Thanked 0 Times in 0 Posts
|
Re: Function to convert BBcode to HTML
This might be a silly question but have you created the stylesheet that these preg_replace's are using? Is it all of the uBBC that's not working or just some?
|
|
|
|
|
September 2nd, 2007, 06:30 AM
|
#3
|
|
Highly Reputable Member
Join Date: Jul 2006
Location: Devon, England
Posts: 565
Thanks: 0
Thanked 0 Times in 0 Posts
Rep Altering Power: 0
|
Re: Function to convert BBcode to HTML
I have stylesheetes but didn't think they were necessary to inlcude them.
If i use $_POST['post'] in the last part of the functions which output the text, the first function that comes with the article doesn't output anything again....just a blank white page but the second function that I found does output what was on the form but it doesn't add any html to the outputted text such as bold or underline. |
|
|
|
|
September 2nd, 2007, 07:44 AM
|
#4
|
|
Highly Reputable Member
SuperMember
Join Date: Sep 2007
Location: Australia
Age: 25
Posts: 956
Thanks: 0
Thanked 0 Times in 0 Posts
|
Re: Function to convert BBcode to HTML
You would need to link to the stylesheets on the pages you are outputting to. The underlines and such are using <spans> with classes from a stylesheet.
That might explain why it doesn't look right or have you viewed the source and there is no formatting? If this is the case we can start to have a look and see why the regex's aren't matching.
Cheers
|
|
|
|
|
September 2nd, 2007, 08:41 AM
|
#5
|
|
Highly Reputable Member
Join Date: Jul 2006
Location: Devon, England
Posts: 565
Thanks: 0
Thanked 0 Times in 0 Posts
Rep Altering Power: 0
|
Re: Function to convert BBcode to HTML
Thanks Rakuli
That was the last thing that would have crossed my mind.
The function code didn't have the stylesheet attached and that's why it didn't work but it does now
|
|
|
|
|
Currently Active Users Viewing This Thread: 1 (0 members and 1 guests)
|
|
|
Posting Rules
|
You may not post new threads
You may not post replies
You may not post attachments
You may not edit your posts
HTML code is Off
|
|
|
|
iEntry 10th Anniversary
Announcements
Contact
