Hide Categories Code.

[JRR]

I use a javascript code on my forum to hide/collapse a category that works well and here is the forum:

http://thescooterprofessor.proboards.com/

If you scroll down and look at the Forum Information and Statistics category you'll see on the right the words Hide/Show. When clicked on the whole category collapses and just the title bar is left showing. Click on it again and the information re-appears. Here is the code:

<script type="text/javascript">
$(document).ready(function(){
	var info = false;
	if(window.localStorage["center-close"] && window.localStorage["center-close"] == "true"){
	$(".stats .content").hide();
	var info = true;
	}
	$(".stats .title-bar").click(function(){
	$(".stats .content").animate({ height:"toggle" }, 1000, "easeOutQuad");
	if(info){
	info = false;
	window.localStorage["center-close"] = "false";
	} else {
	window.localStorage["center-close"] = "true";
	info = true;
	}
	});
});
</script>

This code is put in what is called the Main Footer of the forum. To get the words Hide/Show to go into the title bar one goes to the Home Template section and places the following line of code in the Statistics Title Bar section of the template coding. Here is that section:

{if $[show_stats]}
	<div class="container stats">
		<div class="title-bar"><h2>Forum Information &amp; Statistics<span style="float: right;">Hide/Show</span></h2></div>
		<div class="content">

Now here is the Home template code and if I'm correct this section controls the Legend title bar and information section and also what would be the other categories that one would name when building the forum, here is the Home Template code that also includes the above mentioned Statistics title bar too:

{foreach $[category]}
	$[category.anchor]
	<div class="container boards">
		<div class="title-bar bbcode"><h2><div class="title_wrapper">$[category.display_name]</div></h2></div>
		<div class="content cap-bottom">
			$[category.board_list]
		</div>
	</div>
{/foreach}
{if $[legend]}
	<div class="container legend home">
    <div class="title-bar"><h2><div class="title_wrapper">Legend</div></h2><div id="messages_container"></div></div>
		<div class="content">
			<table>
			<tr>
				{foreach $[legend]}
					<td>$[legend.icon] <span>$[legend.name]</span></td>
				{/foreach}                
			</tr>
			</table>
<center><a href="http://info.flagcounter.com/a7SY"><img src="http://s09.flagcounter.com/count_US/a7SY/bg_e3e3e3/txt_000000/border_CCCCCC/columns_8/maxflags_50/viewers_Students+and+Visitors/labels_1/pageviews_1/flags_0/" alt="Flag Counter" border="0"></a></center>                             
		</div>
	</div>
{/if}
{if $[show_stats]}
	<div class="container stats">
		<div class="title-bar"><h2>Forum Information &amp; Statistics<span style="float: right;">Hide/Show</span></h2></div>
		<div class="content">

As I mentioned you can see the Legend and Statistics title bar coding and my thinking is the [category.display_name] is the section that covers all of the other title bars in the forum. I've tried this and that to make the javascript code work for the other two to no avail. Can someone help me with this and what would be nice is a code that would cover the whole forum for each title bar. I've seen this work at other places.

Thanks

[JRR]

Is it against the rules to ask about something again even after it's been two weeks with no reply?

[james438]

Not rude. I'm sadly not very good with javascript and am weakest in it to be honest . It is a little irritating when someone gets upset that no one has posted a response to their request for help after an hour and feels the need to post an angry note demanding to know why no one has responded.

It also depends a bit on the forum. For example, in the MySQL forum responses can take a week or so. Faster responses tend to happen in CSS, HTML, and especially Javascript. Sometimes posts do fall through the cracks or maybe no one knows the answer or fully understands what is being asked. Other times the usual contributers can get temporarily overwhelmed with other activities like a new full time job (myself) or family life can pull people away or maybe even travel to a country that has little in the way of internet connection. Sometimes a problem is just too complicated and/or requires more time than the contributor can afford to spend on the issue.

In short you are not being rude .

[Beverleyh]

There's not a problem, but replied-to threads are more easily dismissed because it looks like someone else is dealing with them, and they no longer come up to the top as unanswered threads when the forum is sorted. Bumping your own thread 3 times over in that respect has a negative effect, while clearing bumps makes a post with 0 replies easier to find when an regular helper with more knowledge/interest returns. There are sometimes methods to moderator madness

[JRR]

OK thanks and I'm not in a hurry guess I just forgot it's holiday time.

[JRR]

Been some time and now getting back to this, can anyone help me with this?

[JRR]

Calling John! I'm hoping to still do this and it's for sure been awhile since my last request. Please help. Thanks

[jscheuer1]

Get rid of everything you already have for this. EVERYTHING! (back it up - always wise, but get rid of it all) - Use only this script (replace the existing one):

<script>
jQuery(function($){
	var info = {};
	$(".title-bar").each(function(i, v){
		if(!i){return true;}
		var $c = $(".content", $(v).parent()), ts = "title-bar" + i,
		$ae = ($ae = $('h2 .title_wrapper', v)).length? $ae : $('h2', v);
		if(window.localStorage[ts] && window.localStorage[ts] === "true"){
			$c.hide();
			info[ts] = true;
		}
		$ae.css({maxWidth: 880}).append('<span style="float: right; cursor: pointer;">Hide/Show</span>').
		click(function(){
			$c.animate({ height:"toggle" }, 1000, "easeOutQuad");
			if(info[ts]){
				info[ts] = false;
				window.localStorage[ts] = "false";
			} else {
				window.localStorage[ts] = "true";
				info[ts] = true;
			}
		});
	});
});
</script>

Make sure to also get rid of that span you added to the HTML template.

[JRR]

As always works like a charm and thanks John!

[JRR]

Have had a glitch come up John. The code works great on all 3 of my forums, don't even have to be logged in to use it, here is one of them:

http://itistheride.boards.net/

But for some reason on my test forum and on some other forums for whatever reason the top category on the forum is left out? The Hide/Show button doesn't appear, here is a couple of them where it does just that:

http://theridetest.freeforums.net/

http://putteraround5.proboards.com/

On the last forum all one has to do is adjust the width in the code to move the buttons to the far right. Don't understand this at all?

Thanks