Forum Home Enhancements - Yahoo YUI! Treeview Menu for VBAdvanced

//--------------------------------------------------------------------
// YUI Yahoo Treemenu Module for VBA v3 RC2
// by ShawnC
// http://www.shawnc.org
//--------------------------------------------------------------------

//--------------------------------------------------------------------
//--> New Installation Instructions
//--------------------------------------------------------------------

The files located in the Upload Directory need to be FTP Uploaded to your VBulletin Forum Directory. Click Overwrite All if it comes up will uploading
Once uploaded, If you are using VBA v3 RC2 then you can Import the Module in this Directory to your VBA Modules and it will work.

If you are Upgrading from a Previous version see next section

//--------------------------------------------------------------------
//--> Upgrade Instructions
//--------------------------------------------------------------------

Please Reupload all files into your Vbulletin Directory as I have changed the Javascript and compacted it with the Yahoo Javascript Compactor, Also All Files are hosted
on your domain to speed matters up now.

In Previous versions you had to Change the Header Template to Add the Javascript files, This has been automaticly done inside of the Plugin now so you will need to remove
any manual Header File Changes.

Delete the Old Module from VBA and ReImport the New Module to make sure all settings are overwrote properly.

//--------------------------------------------------------------------
//--> Installation Instructions on older VBA
//--------------------------------------------------------------------

Please read the Installation.txt file inside of the Package

Follow Normal Installation Instructions by Uploading All Files.

Create a new Module inside of VBA, Choose PHP Module(File)

Change the following Settings

File to Include --> treemenu.php
Templates Used --> adv_portal_treemenu
Use Module Wrapper Template --> Yes

Make a New Template and Call it

//--------------------------------------------------------------------
//--> adv_portal_treemenu
//--------------------------------------------------------------------

<tr class="alt1" ><td class="yui-skin-sam">

<div id="treeDiv" style="visibility:hidden;">
$adv_portal_forumlist
</div>

<script type="text/javascript">
//<![CDATA[

var ultree;
(function() {

function treeInit() {
ultree = new YAHOO.widget.TreeView("treeDiv");

ultree.setExpandAnim(YAHOO.widget.TVAnim.FADE_IN);
ultree.setCollapseAnim(YAHOO.widget.TVAnim.FADE_OU T);
ultree.readList();

ultree.subscribe("expand", function(node) {
});

ultree.subscribe("collapse", function(node) {
});

ultree.subscribe("labelClick", function(node) {
});


ultree.draw();
fetch_object('treeDiv').style.visibility = 'visible';
}

YAHOO.util.Event.addListener(window, "load", treeInit);

})();

//]]>
</script>

</td></tr>

//--------------------------------------------------------------------
//--> ChangeLog
//--------------------------------------------------------------------

--> v1.00 --> First Version
--> v1.01 --> Fixed Missing Animation Package - ragtek noticed thanks
--> v1.10 --> Fixed minor things
--> v1.20 --> Rewrite for VBA v3RC2 Module format
--> v1.30 --> Added Automatic Template Edits, Compacted Javascript Includes, Added Hidden Startup, Re-Packaged for Out of the Box Operation
Forum Paths have been added to Both Javascript and ForumDisplay.php so this will now work outside of your forum directory,
Removed Ugly Navmarkers that i forgot to remove from the original code for this.


//--------------------------------------------------------------------
//--> Demo Sites
//--------------------------------------------------------------------

http://www.srl-forums.com --> Where this module was originally wrote for
http://www.earthbeans.org --> Showing this module in a setting other then VBulletin ( MODx )
http://www.audiopoint.gr --> The Very Original Treemenu code written by Me for A Different JavaScript setup


//--------------------------------------------------------------------
//--> Information About the Author
//--------------------------------------------------------------------

I am a Freelance web Developer with Alot of exp in VBulletin modifications. I also run a blog about Web Development mostly using Yahoo, PHP and Linux Server stuff.
If you Like this modication please make a donation as it would make you feel all warm and fuzzy inside :P And helps me support the idea of future free module releases.


Support will be given to those that have Installed this modification only.

[ragtek]

<a href="http://www.ragtek.org/" target="_blank">http://www.ragtek.org/</a>

the navi modul at end of the site
it's just for "practice"

[Dankness]

O it's working as its being told to do on that page....

You need to include another list inside of your <li>

This should make a collapisble thing

PHP Code:

<ul>
  <li>Parent
    <ul><li>Child</li><li><Child 2</li></ul>
  </li>
<li>Parent 2
    <ul><li>Child</li><li><Child 2</li></ul>
</li>
</ul> 


You have to include Sublists to expand on, does that make sense?

[ragtek]

lol
now it makes sense
thx man
now i know how it have to be, and now i can try to make the part with the forumcache

thx very much

[iogames]

Wow! great job!

[ragtek]

now we have an error:
YAHOO.util.Anim is not a constructor

var a = new YAHOO.util.Anim(this.el, {opacity: {from: 0.1, to: 1, unit:""}},...

but its working
thx
maybe this is missing:

<script src="http://yui.yahooapis.com/2.3.1/build/animation/animation-min.js"></script>

edit: btw you have a mistake in your code
<ul><li>Child</li><li>Child 2</li></ul>

[Dankness]

Originally Posted by ragtek

http://www.ragtek.org/


the navi modul at end of the site
it's just for "practice"

Originally Posted by ragtek

now we have an error:
YAHOO.util.Anim is not a constructor

var a = new YAHOO.util.Anim(this.el, {opacity: {from: 0.1, to: 1, unit:""}},...

but its working
thx
maybe this is missing:

<script src="http://yui.yahooapis.com/2.3.1/build/animation/animation-min.js"></script>

edit: btw you have a mistake in your code
<ul><li>Child</li><li>Child 2</li></ul>

Well the Anim wont effect it only does the animation and thats a error that its not found.

The javascript is working properly because your Tree was wrapped in the list images, which if it didn't work you would'va been left with a list with regular bullets. For example visit the second demo site i posted and watch as the page loads, you'll see about 50-60 links in a ugly default list until the javascript adds the proper class to it and cleans it up., and the code i wrote in the quick reply box, it was just some example code to spread the theory not a working application Thats one of the main benefits of this script is it uses Progressive Enchantment to add the Javascript, so to a 'Lynx' browser or Google those links would still be in a very usable List format

[Trana]

A couple of questions....

Does this follow the forum permission system? If a user cannot see a forum will it display it in their list?

Also, my nested forums work great within the tree, but the forums at the root level are not showing any links. Any idea what I need to fix? Please note that my CMPS is in root and my forum is in /forum.

Thanks!

[PapaSmurf]

Im getting this issue, (see attached).

[memorex]

Great mod... there is just one small issue. the text color changes halfway down the list. I like the second color better, how would I go about making all the text this color.. www.mgn.cc is my domain.

[Invalid ID]

Looks cool. Thanks