Forums / Cotonti / Extensions / Support / Autotab - create tabs on my pages where I want them

Reworking the autotoc extension

foxhound
#37581 2013-06-18 20:27

I am trying to make tabs to be added to my pages automatically. For this I am using the autotoc extension which I am trying to rework to do this.
I have no idea if what I am trying actually works but before I can find that out I have tix an error which I am not sure how to do.

Here is the html to create the tabs

				<!-- *************** - Tabs Container - *************** -->	
				<div class="tabs-1 newssel">
					<ul class="tabs-nav clearfix">
						<li><a href="#tab1">ALL</a></li>
						<li><a href="#tab2">ARMA 3</a>
							<ul>
								<li><a href="#tab2_1" title="Show only general Arma 3 news">General news</a></li>
								<li><a href="#tab2_2" title="Show only general Arma 3 news">Mods & Addons news</a></li>
								<li><a href="#tab2_3" title="Show only general Arma 3 news">Tools news</a></li>
							</ul>
						</li>
						<li><a href="#tab3">ARMA 2: OA / CO</a>
							<ul>
								<li><a href="index.php?c=news_arma2" title="Show only general Arma 3 news">General news</a></li>
							</ul>
						</li>
						<li><a href="#tab4">ARMA 2</a></li>
						<li><a href="#tab5">ARMA</a></li>
						<li><a href="#tab6">BI</a></li>
						<li><a href="#tab7">COMMUNITY</a></li>
						<li><a href="#tab8">WEBSITE</a></li>
					</ul><!--/ .tabs-nav -->

					<div class="tabs-container">
						<div class="tab-content" id="tab1">
							<div class="gamelist">
								{INDEX_NEWS}
							</div><!--/ .gamelist-->
						</div><!--/ #tab1-->
						<div class="tab-content" id="tab2">
							<div class="gamelist">
								{INDEX_NEWS_NEWS_ARMA3}
							</div><!--/ .gamelist-->
						</div><!--/ #tab2-->
						<div class="tab-content" id="tab2_1">
							<div class="gamelist">
								{INDEX_NEWS_NEWS_ARMA3_GENERAL}
							</div><!--/ .gamelist-->
						</div><!--/ #tab2_1-->
						<div class="tab-content" id="tab2_2">
							<div class="gamelist">
								{INDEX_NEWS_NEWS_ARMA3_MODS}
							</div><!--/ .gamelist-->
						</div><!--/ #tab2_2-->
						<div class="tab-content" id="tab2_3">
							<div class="gamelist">
								{INDEX_NEWS_NEWS_ARMA3_TOOLS}
							</div><!--/ .gamelist-->
						</div><!--/ #tab2_3-->
						<div class="tab-content" id="tab3">
							<div class="gamelist">
								{INDEX_NEWS_NEWS_ARMA2OA}
							</div><!--/ .gamelist-->
						</div><!--/ #tab3-->
						<div class="tab-content" id="tab4">
							<div class="gamelist">
								{INDEX_NEWS_NEWS_ARMA2}
							</div><!--/ .gamelist-->
						</div><!--/ #tab4-->
						<div class="tab-content" id="tab5">
							<div class="gamelist">
								{INDEX_NEWS_NEWS_ARMA}
							</div><!--/ .gamelist-->
						</div><!--/ #tab5-->
					</div><!--/ .tabs-container-->
				</div><!--/ .tabs-1-->
				<!-- *************** - END Tabs Container - *************** -->

In autotoc.page.tags.php I added the following:

function buildTOC(&$text, $chapters, $parents = '')
{
	global $chapters_elem;
	$i=0;
	$toc = '<div class="tabs-1"><ul class="tabs-nav clearfix">';
	foreach($chapters as $chapter_raw => $subchapters)
	{
		$chapter = strip_tags(trim($chapter_raw));
		$i++;
		$elem = $chapters_elem[$chapter_raw];
		$level = $parents.$i;
		$url = $_SERVER["REQUEST_URI"] . "#ch$level";
		$toc .= "<li><a href=\"$url\" title=\"$chapter\">$level. $chapter</a>";
		$text = str_replace("<$elem>$chapter_raw</$elem>", "<div class=\"tabs-container\"><div class=\"tab-content\" id=\"ch$level\"><div class=\"gamelist\"><$elem>$level. $chapter</$elem>", $text);
		if (count($subchapters) > 0)
		{
			$toc .= buildTOC($text, $subchapters, $level.'.');
		}
		$toc .= '</li>';
	}
	$toc .= '</ul>';
	return $toc;
}

I still need to close 3 divs and i think they should be closed after

$elem>$level. $chapter</$elem>", $text

 

So I tried:

<$elem>$level. $chapter</$elem>", $text , "</div></div></div>"

and some other combinations but none will work. So here I am again hoping someone can help me with this!

 

** Sighhhh..... I do so much hate this editor, I can not make a single proper post and I have no idea why its always completely screwed up.........fixing fixed ......

Added 2 days later:

Ok, I think I got most to work except one part.
I create the tabs with an h2 tag, if it sees that tag it creates a tab button linking to tab 1 (anchor) and increments with every new h2 tag (so every new h2 is a new tab with correct anhor).

But now where I am stuck.......
The text which should show when clicking on tab 1 is between a h3 tag. The text which should show when clicking tab 2 is betwee the next h3 tag.
And that is what I can not solve.....
I do not know how to change the plugin so it only shows that particular text when clicking a specific tab.

Right now the plugin shows all text when you open the page (and the tabs) and when you click a tab all text is gone.

I really would appreciate some help with this, if I could get this to work it might even be a nice addition to the download section? (I wont take any credit for it since it uses the autotoc plugin as base).


In the meantime I got all this to work with the bbcode editor, so unless I get some help I will just have to use bbcode.

<img src="http://www.armaholic.com/datas/thumbs/green-sea-battalion-uniforms-version-03-preview_4.jpg" alt="green-sea-battalion-uniforms-version-03-" />
This post was edited by foxhound (2013-06-20 14:29, 10 years ago)