(function($){
    $.fn.wslide = function(h){
        h = jQuery.extend({
            level: 0,
            col: 1,
            effect: 'swing',
            duration: 600,
            width: 300
        }, h);
        
        function gogogo(g){ 
   
            g.wrap("<div id='wrapper'></div>");
            
            var w = $('#wrapper');
            var u = g.children('ul');
            var b = u.children('li');
            
            function resultante(prop){
                var tempcalc = prop;
                tempcalc = tempcalc.split('px');
                tempcalc = tempcalc[0];
                return Number(tempcalc);
            }
            
            var litypex = h.width-(resultante(b.css('padding-left'))+resultante(b.css('padding-right')));
            
            w.css('overflow-x','hidden').css('position','relative').css('width',h.width+'px');
            u.css('position','relative').css('margin','0').css('padding','0').css('width',Number((h.col+0)*h.width)+'px');
            b.css('display','block').css('overflow','hidden').css('float','left').css('width',litypex+'px');
            
            b.each(function(i) {
                var offset = g.offset();  
                var thisoffset = $(this).offset();
                $(this).attr('rel', Number(i*(thisoffset.left-offset.left)) + ':' + Number(thisoffset.top-offset.top));
            });
            
            g.find('#root > li > a[rel]').click(function(){
                rel = $(this).attr('rel');

                if(rel != undefined){
                    ul =  $("ul[tag='" + rel +"']");
		if(ul.length != 0)
		{
		    h.level++;
                    content = ul.html();
		    level = $('#level' + h.level);
		    if(null != level)
		    {
                    	level.html("<ul>" + content + "</ul>");       
                    	reclick(u);
                    	animate(u);
		    }
		}	
                    
                }
            })

        }
        
    
        
        function reclick(u){
            $("li#level" + h.level + " > ul > li.back > a").click(function(){
                h.level--;
                animate(u);
            }); 
                                          
            $("li#level" + h.level + ' > ul > li.nested > a').bind('click', function(){
            
                rel = $(this).attr('rel');

                if(rel != undefined){
                    ul =  $("ul[tag='" + rel +"']");
		if(ul.length != 0)
		{
		    h.level++;
                    content = ul.html();
                    level = $('#level' + h.level);
		    if(null != level)
		    {
                    	level.html("<ul>" + content + "</ul>");       
                    	reclick(u);
                    	animate(u);
		    }
		}
                }
                
            })    
        }
        
        function animate(u){
             u.animate({left: Number(-h.width*h.level)+'px' }, h.duration );
        }
        
        function getSelected() {
            var s = $('#root li.selected');
            parentEls = s.parents('ul');
            var flag = true;
            var uls = new Array();
            parentEls.each(function(i) {
                if($(this).attr('id') == 'root')
                    flag = false;
                    
                if(flag) {
                    uls[i] = $(this).html();
                }
            })

            uls.reverse();
            h.level = uls.length;

            for (var i = 0; i < uls.length; i++) {

                $('#level' + Number(i+1)).html("<ul>" + uls[i] + "</ul>");               
                $("li#level" + Number(i+1) + " > ul > li.back > a").click(function(){
                    h.level--;
                    animate($('div.v-menu > ul'));
                }); 

                $("li#level" + Number(i+1) + ' > ul > li.nested > a').bind('click', function(){
                    rel = $(this).attr('rel');
                    if(rel != undefined){

                        ul =  $("ul[tag='" + rel +"']");
			if(ul.length != 0) {
		 	  h.level++;
                          content = ul.html();
                          level = $('#level' + h.level);
		    	  if(null != level) {
                    	    level.html("<ul>" + content + "</ul>");       
                      	    reclick($('#wrapper > div.v-menu > ul'));
                    	    animate($('#wrapper > div.v-menu > ul'));
			  }
			}
                    }
                
                })
	
            }
            
            if(uls.length)        
                animate($('div.v-menu > ul'));

        }
                      
        getSelected();
        gogogo(this);
        return this;
    }
})(jQuery);
