[SOLVED] Replacing Tags in MyCode

[Tutti]

Hi. First post & It's kind of complicated.
I have a JS code here - http://jsfiddle.net/QKEVc/13/
That will "try" to limit the image size in my DVZ Shoutbox. (Anti-spam)
The code to post images in shoutbox as most of us know is [img]URL[/img]
But I want to replace these with what I have in that JS like so :
<img class="thumb" src="URL"/>

So the process is as follows :
They click the "Add Image" button, then an input pops up where they insert the image url;
After pressing done, the HTML code goes to DVZ Input like so : [img]THEIR-IMG-URL[/url]<br />So here's where I need the help, I want that to be converted to <img class="thumb" src="THEIR-IMG-URL"/><br />in order for the JS to work.<br /><br />So far, this is what I have :<br />Regular Exp : [img](.*?)[/img]<br />Replacement : <img class="thumb" src="(.*?)"/><br /><br />But this thing won't work and I'm lost. Please help. Thanks in advanced<br />@devilshakerz[/img]

[SvePu]

MyCode:

Regular Exp : \[img\](.*?)\[/img\]
Replacement :<img class="thumb" onclick="$(this).toggleClass('thumb'); return false;" src="$1"/>

Add into theme css

.thumb {
    height: 20%;
    width: 20%;
}

[Tutti]

MyCode:

Regular Exp : \[img\](.*?)\[/img\]
Replacement :<img class="thumb" onclick="$(this).toggleClass('thumb'); return false;" src="$1"/>

Add into theme css

.thumb {
    height: 20%;
    width: 20%;
}

Wow! Thanks for the quick reply.
Uhm, Not sure why It wouldn't work, Do I put the JS Code

$("img").click(function() {
    $(this).toggleClass("thumb");    
});

Inside the dvz_shoutbox template?
EDIT-
Do I need to enable html in shoutbox?
When I tried the code, a normal image showed and when I try to edit the comment in DVZ shoutbox, the [img] tags were shown instead of the replacements.
------------------
It did work on all forums, not in shoutbox. How do I make this work in shoutbox only?
I know Im being a pain, but thanks for helping out.

[SvePu]

This mycode runs in posts, but I can't test it on shoutbox now.... haven't time.....super bowl is running 😉💪

[Tutti]

Bump =/
Is there any way that I can enable this only on shoutbox?
Or to exclude the rest of the image in the forum, can I replace [img]URL[/img] to [img2]URL[/img2] ?

[SvePu]

So I've played a little bit with the shoutbox

1: You have to edit the main shout box plugin file (ROOT/inc/plugins/dvz_shoutbox.php)

Search for (#1349):

return $parser->parse_message($message, $options);

Insert above these line:

if($mybb->settings['dvz_sb_mycode'] == 1)
{
    $message = preg_replace('|\[img](.*)\[/img]|', '[sbimg]$1[/sbimg]', $message);
}

Save changes!


2: Add a new MyCode in ACP(delete the older one)

Regular Exp:
\[sbimg\](.*?)\[/sbimg\]

Replacement:
<img class="sb_thumb sb_image" onclick="$(this).toggleClass('sb_thumb'); return false;" src="$1"/>

Save changes!


3: Add into theme css

.sb_thumb {
   height: auto !important;
   max-width: 20% !important;
}
.sb_image {
   height: auto;
   max-width: 100%;
}

Save changes and have fun!

[SvePu]

So the process is as follows :
They click the "Add Image" button, then an input pops up where they insert the image url;
After pressing done, the HTML code goes to DVZ Input like so : [img]THEIR-IMG-URL[/url]<br />So here's where I need the help, I want that to be converted to <img class="thumb" src="THEIR-IMG-URL"/><br />in order for the JS to work.<br /><br />So far, this is what I have :<br />Regular Exp : [img](.*?)[/img]<br />Replacement : <img class="thumb" src="(.*?)"/><br /><br />But this thing won't work and I'm lost. Please help. Thanks in advanced<br />@devilshakerz[/img]

Where you have an add image button in dvz shout box?

[Tutti]

Where you have an add image button in dvz shout box?

http://i.imgur.com/i11VlBH.png
That smiley image there, that shows the smiley div.
I haven't modified or tried your suggestion yet.

[Tutti]

---

Hi @Svepu sorry to bump this
I have another question.
I would like to apply this concept on user's posts. I'd like to automatically replace img to sbimage

Where can I put this ?

 $message = preg_replace('|\[img](.*)\[/img]|', '[sbimg]$1[/sbimg]', $message);

Which .php file?
Thank you sir!