YouTube iFrame BBCode Fails In Nested BBCode on 3.2.1

Get help developing custom BBCodes or request one.
Post Reply
User avatar
Wolfchild
Registered User
Posts: 10
Joined: Sun May 03, 2009 11:25 pm

YouTube iFrame BBCode Fails In Nested BBCode on 3.2.1

Post by Wolfchild »

One of the final things that is keeping me from upgrading my 3.0.x forum to 3.2.x is a Spoiler BBCode. On my 3.0.x forum, I have been using a mod that implements a Javscript-based spoiler BBCode (Prime BBCode Spoiler). Perhaps I should explain: When a user is going to post something that is a spoiler for a film, they can hide it in a Spoiler BBCode. When the post is read, the spoiler is hidden until the reader takes some action to reveal it. On the old forum, the user must click the spoiler to reveal it. Now since I am upgrading, I am trying to get the spoiler to work as I had always intended: the reader can reveal it with a mouse-over.

I find that on my 3.2.1 test forum, I can do this with CSS and the following BBCode:
BBCode:
[spoiler]{TEXT}[/spoiler]
Replacement:
<span class="spoiler" onmouseover="this.className='spoiler hover'" onmouseout="this.className='spoiler'"><span>{TEXT}</span></span>
Where the classes referred to in the replacement code are defined in a CSS called from stylesheet.css.

This works exactly as I had intended, until...

I also have implemented the iFrame-based YouTube BBCode:
BBCode:
[youtube]{SIMPLETEXT}[/youtube]
Replacement:
<div class="video-wrapper">
<div class="video-container">
<iframe class="youtube-player" type="text/html" width="640" height="385" src="http://www.youtube.com/embed/{SIMPLETEXT}" style="border: none;" allowfullscreen></iframe>
</div>
</div>


When the YouTube BBCode is nested within the Spoiler, the HTML substitute for YouTube no longer takes place. If I post:
[spoiler][youtube]Fwr1Z7uyXz4[/youtube][/spoiler]

the HTML generated is:
<span class="spoiler" onmouseover="this.className='spoiler hover'" onmouseout="this.className='spoiler'"><span>[youtube]Fwr1Z7uyXz4[/youtube]</span></span>

Upon further investigation, I find the if the YouTube BBCode is nested within any other BBCode (even the default ones like underline), phpBB does not do the YouTube replacement. My CCS-based spoiler BBCode works with everything else that I have tested nested inside of it. If a blank or mangled iFrame or some sort of error message had shown up, I would have been tempted to blame the YouTube replacement code. However, it appears that phpBB is not even attempting the BBCode replacement for the YouTube tag when it is nested.

Should this work, or am I just lacking some key understanding of the BBCode engine?
User avatar
JoshyPHP
Code Contributor
Posts: 1288
Joined: Mon Jul 11, 2011 12:28 am

Re: YouTube iFrame BBCode Fails In Nested BBCode on 3.2.1

Post by JoshyPHP »

div elements are not allowed inside of span elements, that's why your YouTube BBCode ends up being ignored. If you use span elements for the video thing you'll be able to use it inside the other thing.
I wrote the library that handles markup in phpBB 3.2+.
User avatar
Wolfchild
Registered User
Posts: 10
Joined: Sun May 03, 2009 11:25 pm

Re: YouTube iFrame BBCode Fails In Nested BBCode on 3.2.1

Post by Wolfchild »

JoshyPHP wrote: Sun Oct 01, 2017 10:04 pm div elements are not allowed inside of span elements, that's why your YouTube BBCode ends up being ignored. If you use span elements for the video thing you'll be able to use it inside the other thing.
That was a good call. I hadn't caught that. However, when I change the YouTube BBCode to span
<span class="video-wrapper"><span class="video-container"><iframe class="youtube-player" type="text/html" src="http://www.youtube.com/embed/ZLk75fFXqH4" style="border: none;" allowfullscreen="" height="385" width="640"></iframe></span></span>

it still does not get the HTML replacement (and the spans get lost because they screw up the pagination):
<span class="spoiler" onmouseover="this.className='spoiler hover'" onmouseout="this.className='spoiler'"><span>[youtube]Fwr1Z7uyXz4[/youtube]</span></span>

When I change the spoiler BBCode to be div, it still works correctly everyplace else but the HTML replacement for YouTube still does not take place whether YouTube is span or [/div]:
<div class="spoiler" onmouseover="this.className='spoiler hover'" onmouseout="this.className='spoiler'"><div>[youtube]Fwr1Z7uyXz4[/youtube]</div></div>
User avatar
JoshyPHP
Code Contributor
Posts: 1288
Joined: Mon Jul 11, 2011 12:28 am

Re: YouTube iFrame BBCode Fails In Nested BBCode on 3.2.1

Post by JoshyPHP »

Post it in a new message, it should work.
I wrote the library that handles markup in phpBB 3.2+.
User avatar
Wolfchild
Registered User
Posts: 10
Joined: Sun May 03, 2009 11:25 pm

Re: YouTube iFrame BBCode Fails In Nested BBCode on 3.2.1

Post by Wolfchild »

You, sir, are brilliant!

Many thanks for your help. 8-)
Post Reply

Return to “Custom BBCode Development and Requests”