Upgrading my Ubuntu 7.04 w/ Gnome and KDE Desktop to Ubuntu Gutsy 7.10

To Upgrade to Gutsy, in my KDE Menu I Found the Following Option “Upgrade Manager”

After Opening this Application, It quickly informed me that Ubuntu 7.10 was out and I should Upgrade

On First Attempt, It viewed my Extra Repositories and found many which would not work, And gave me a error and could not upgrade.

To fix this for now I commented out all the Third Party Repositories I used afterwords I was given a nice list of Unsupported Packages, I decided after the Upgrade I can just fix my Repositories correctly Gutsy and Reinstall/Upgrade these packages (hopefully)

Now Everything went through and Ubuntu Asked to Agree to the Following License, Just hit Accept here

After removing all my Third Party Repository’s, Another Screen opened explaining how long this would take and what packages had to be removed, and what packages would be upgraded. Looking at my setup 19 Packages were to be removed out of 1.5k Packages so that’s not to bad I’m sure I can locate 19 packages to replace them with.

NOTE : On doing this again, I HIGHLY suggest you thin your packages out before hand. Remove all those packages you don’t use at all, Gutsy will upgrade every one of them later

As I wait on all these packages to Download, I am left wondering how much time I will spend fixing issues after this Upgrade and If upgrading will fix any of my problems

After Fetching all the required Packages, and on installation of the new upgrades, A Pop up Window Appeared and asked me to reconfigure a few minor things, which will all depend on your Installation. My Personal Installation asked me to reconfigure Apache, Gallery 2 MYSQL Password and PHPMyAdmin Support, nothing really major yet. All of which were just a simple Yes/No Answer.

Almost done at around 2 hours or so into the upgrade process

After this a very long update process began, and After around 2 hours my System was ready to Restart.
After rebooting this system, I noticed the GDM login screen is slightly different but not much else yet. After logging in afound afew problems to be solved and that is what
part 2 will consist of.

/*****************************************************************
//  Installing a Yahoo YUI! Treemenu into ModX CMS Systems
//  by ShawnC of http://www.shawnc.org
*****************************************************************/

Introduction

Along time ago, I wrote a method of having a Java-script Tree menu in ModX CMS using a script from Dynamic Drive. This modification involved modifying core ModX CMS php
files and It just wasn’t a great method of going about this. Now I have found a much better method of doing this using the excellent Yahoo YUI! Library. This Library
is very small in Size and is one of the best Java-Script Library’s released at this time. Its modular nature is the best thing going for it honestly. Well since I wrote a
Plug in for vBulletin a few weeks ago to use this System, I decided to go ahead and port the modification over to ModX as it is my favorite frame work for a CMS. So Let’s
Get Started on how to Do It! At the end of this Post, you will find a Download Link to the Files needed to Install this modification in your System.

The Basics

Ok this module will basically, offer visitors with java script a Excellent Opening and Closing Tree menu to Navigate your Site very Rapidly. Visitors without Java-script
will not get to see the module, but I have made it so that Search Engine Spiders will still get a excellent Un-Ordered List of your Pages, so for SEO this is a Good
Modification allowing Spiders to have 1 Click access to any page from any page!

Let’s Get Started!

Ok, Go Ahead and Download the Modification Package At the bottom of this post and Unzip it into a Directory you can find. Also Open up a FTP Program and Navigate to your
sites ModX Root Folder ( the one that has the Assets, Manager, Index files/folders in it ). Go ahead and Upload the UPLOAD directory to this location and click overwrite all
if it asks you for that.

Ok So Now All the Java-Script, CSS and Image Files are Uploaded on your Server in the Assets Directory

Editing Your Head Section of the Template

Ok in the Header Section of your Page Templates you want to View this Modification on Add the Following Lines inside of your section ( before )

NOTE : One Tip I Noticed, I Find it wise to include your Sites URL in the links such as this, It will help solve any errors later on the installation

<!-- Addition Javascript for Treemenu by www.shawnc.org -->
<link   href="http://www.earthbeans.org/assets/yui/assets/tree.css" rel="stylesheet" type="text/css" media="screen" />

Above was just a example of what you should change, Below you need to copy/paste into your Template Above the Section

<!-- Addition Javascript for Treemenu by www.shawnc.org -->
<link   href="assets/yui/assets/tree.css" rel="stylesheet" type="text/css" media="screen" /> 
<script src="assets/yui/yahoo-dom-event-min.js" type="text/javascript"></script> 
<script src="assets/yui/animation-min.js" type="text/javascript" ></script>
<script src="assets/yui/treeview-min.js" type="text/javascript" ></script>
<!-- Addition Javascript for Treemenu by www.shawnc.org -->

Adding the Actual Tree Module to your Pages

Ok this is done different depending on how your template is designed honestly But I will show you how mine looks and I hope you can figure it out from there.
it’s not really hard, but if you don’t understand HTML then you may need to hire someone to help you with this part as every template is designed different.

Ok, a Basic Explanation of this method. For 1 i am using a Thrash-Box for the Markup, The only truly important parts of this example I will mark with HTML comments
and give a Brief Explanation of what they do.

<div id="NavDiv" style="visibility:hidden;"> <!-- Needed See Note 1 -->
  <div class="cssbox">
    <div class="cssbox_head" style="text-align:left;">
      <h2>Menu</h2>
    </div>
    <div class="cssbox_body" >
      <div id="treeDiv2" style="padding-left:-20px;"> <!-- Needed See Note 2 -->
         [!Wayfinder?startId=`0`  &hereClass=`` &rowTpl=``&titleOfLinks=`description`&selfClass=`` &outerClass=`treeDiv2` &innerClass=`treeDiv2`!] <!-- Needed See Note 3 -->
      </div>
    </div>
  </div>
</div>

Notes :

1. This DIV must be outside of your Outer Most section for the module to hide the Links until Javascript have made a Tree
2. This DIV must be there, It is what the Treemenu Javascript looks for to parse the tree
3. This is the WayFinder Line I used, you may expermint with it but I know the classes should be like that

The Actual YUI! Javascript Magic

Now at the bottom of your template, directly before the Statement, We need to add our Javascript Function to make the Magic Happen It Looks like This
What this does, is Take your existing UnOrder List and turn it into a JavaScript Tree. It also Hides the Container Div until After the Tree has been rendered so
that it looks better.

 
<script type="text/javascript">
//<![CDATA[
 
var ultree;
(function() {
 
    function treeInit() {
        ultree = new YAHOO.widget.TreeView("treeDiv2");
 
       ultree.setExpandAnim(YAHOO.widget.TVAnim.FADE_IN);
       ultree.setCollapseAnim(YAHOO.widget.TVAnim.FADE_OUT);      
       ultree.readList();
 
       ultree.subscribe("expand", function(node) {
           });
 
       ultree.subscribe("collapse", function(node) {
           });
 
       ultree.subscribe("labelClick", function(node) {
           });
 
 
        ultree.draw();
				YAHOO.util.Dom.get("NavDiv").style.visibility = 'visible';
    }
 
    YAHOO.util.Event.addListener(window, "load", treeInit);
 
})();
 
//]]>
</script>

Conclusion

Well I hope this makes sense to some people on the usage of the Yahoo YUI! Treeview module. If you have any problems using this code please comment at my blog
and you will recive support much faster then anywhere else as I check it once a day whereas I check other forums on a maybe once a week basis.

Download Links

And what everybody has been waiting for the download link.