New Posting Features - bbSpoiler

Keywords: bbcode, hidden, spoiler

Description:
A simple but effective [spoiler] bbcode. All the ones I've seen so far fall short for some minor reason or another - so I've created my own

Features:

• Hides/Unhides with cross browser javascript (tested with latest IE and Firefox)
• No template edits or file edits required.
• Uses the colors of the current style.
• Spoiler text does not show in thread preview.

Install

• Download the bbSpoiler_1.0.zip file.
• Follow instructions in install.txt

[Kihon Kata]

check it out

Originally Posted by hambil

The only reason I can think of that it wouldn't work is if you don't have "headinclude" in your SHOWTHREAD template - do to another hack, or some custom style.

[hambil]

Hmmm...

Can you show me your bbcode for the spoiler tag?

[Kihon Kata]

sure...

<div width="100%" class="alt1" onclick="spoiler(this);" style="border-collapse: collapse; border: solid thin black;"><div id="idTitle" class="alt2" style="border-collapse: collapse; border: solid thin black; width: 100%;">&nbsp;<b>click to show</b></div><div id="idSpoiler" style="display: none;">{param}</div></div>

and

[spoiler]The butler did it![/spoiler]

is that what you mean?

Originally Posted by hambil

Hmmm...

Can you show me your bbcode for the spoiler tag?

[hambil]

It looks like the replace isn't working for some reason. Try taking the javascript and editing into the SHOWTHREAD template.

add after "headinclude"

		<script language='JavaScript' type='text/javascript'>
		<!--
			function spoiler(obj)
			{
			  	for (var i = 0; i < obj.childNodes.length; i++)
			  	{
			  	  	if (obj.childNodes[i].id == 'idTitle')
			  	  		titleRow = obj.childNodes[i];
				    if (obj.childNodes[i].id == 'idSpoiler')
				    {
				    	if (obj.childNodes[i].style.display != 'none')
				    	{
				    		obj.childNodes[i].style.display = 'none';
				    		titleRow.innerHTML = '&nbsp;<b>click to show</b>';
				    	}
				    	else
				    	{
					    	obj.childNodes[i].style.display = 'block';
				    		titleRow.innerHTML = '&nbsp;<b>click to hide</b>';
					    }
				    }
				}
			}
		//-->
		</script>

[Kihon Kata]

Yep that worked. Does that slow the showthread down? We have many users that will probably NOT use this feature

[hambil]

No. It's just javascript. It's only called when spoiler 'show/hide' button is clicked.

[Kihon Kata]

cool! We'll use this for our movie review forum

[Kihon Kata]

Hambil! Reporting a problem that I found! or I mean

When you hover over threads' titles in forumdisplay, showthread, today's posts, new posts, the little popup for the thread preview text is now dead and is NOT working. I disable the product and they work. Looks like the spoiler tags are breaking the tooltips.

Remember, I'm the one that had to manually put the javascript into showthread. (I think that is where I had to put it)

Any ideas?

[zombie_rem]

Originally Posted by hambil

It looks like the replace isn't working for some reason. Try taking the javascript and editing into the SHOWTHREAD template.

add after "headinclude"

		<script language='JavaScript' type='text/javascript'>
		<!--
			function spoiler(obj)
			{
			  	for (var i = 0; i < obj.childNodes.length; i++)
			  	{
			  	  	if (obj.childNodes[i].id == 'idTitle')
			  	  		titleRow = obj.childNodes[i];
				    if (obj.childNodes[i].id == 'idSpoiler')
				    {
				    	if (obj.childNodes[i].style.display != 'none')
				    	{
				    		obj.childNodes[i].style.display = 'none';
				    		titleRow.innerHTML = '&nbsp;<b>click to show</b>';
				    	}
				    	else
				    	{
					    	obj.childNodes[i].style.display = 'block';
				    		titleRow.innerHTML = '&nbsp;<b>click to hide</b>';
					    }
				    }
				}
			}
		//-->
		</script>

I was having the same problem with the "Click to Show" not working.... but i cant find where to add the script.. i cant find "headinclude" anywhere..:cry:

[hambil]

Post your FORUMHOME template.