Template:AjaxWikiTree

    Table of contents
    No headers
    dekiapi();
    /*
        Based on CollapsibleTree template, by neilw, 2009
        Completely rewritten by Blake Harms to add AJAX
        Version: 1.5.1
        Changelog:
           1.2 - Fixed a MAJOR bug where IE didn't read XML properly
           1.3 - Fixed XML parsing for all major browsers.
           1.5 - Added Ajax checks for subpage #s and added depth to the bullets
           1.5.1 - Removed click function from pages that do not have subpages
           1.6 - Fixes for German language - Thanks Baum!
    */
    
    // NOTE: This template requires the file "collapse_icons.gif" to be installed in the location
    // specified below
    var icons = "http://developer.mindtouch.com/@api/deki/files/4538/=collapse_icons.gif";
    var loaderLocation = "http://developer.mindtouch.com/@api/deki/files/4568/=loadinfo.net.gif";
    
    // USAGE: template.collapsibleList(path, slide)
    //    "path": Path for wiki.tree to load.
    //    "slide": if true, use "slide" effect to show/hide subtrees (default: false)
    
    // Args
    var path = $0 ?? $path ?? page.path;
    var slide = $1 ?? $slide ?? false;
    
    // Output
    <html>
    <head>
    //
    // First script element is unique to each template call, passing args to the common code
    //
    <script type="text/javascript">"
    DekiWiki.$(document).ready(function($) {
    	collapse_list(Deki.$('#" .. @id .. "').find('ul'),0, "..json.emit(slide)..");
    });
    "</script>
    //
    // This script element is always the same, so only one copy will end up on the page even if the
    // template is called multiple times
    //
    <script type="text/javascript">"
    
    var collapseIcon_hide = '0px -64px';
    var collapseIcon_show = '0px -80px';
    
    function readXML(str){
        var xml;
        if ($.browser.msie && typeof str == 'string') {
            xml = new ActiveXObject('Microsoft.XMLDOM');
            xml.async = false;
            xml.loadXML(str);
        } else {
            var parser = new DOMParser();
            xml = parser.parseFromString(str, 'text/xml');
        }
        return xml;
    }
    
    function collapse_list(ul, depth, slide){
        Deki.$(ul).children().each(function(){
            var $child = Deki.$(this).css({'margin-left':'0', 'padding-left':'0', 'list-style-type':'none'}).prepend(
                '<img src=\"/skins/common/icons/icon-trans.gif\" style=\"background-image:url(".. icons .. ")\" /> ');
            var $img	= $child.children('img:first');
            var child_path = $child.children('a:first').attr('href');
            child_path = child_path.replace("..json.emit(site.uri)..",'');
             // Check each item for subpages, if they have them, add the + button, if not, set depth.
            Deki.$.ajax({
    	url: '/@api/deki/pages/='+Deki.url.encode(Deki.url.encode(unescape(encodeURIComponent(child_path))))+'/subpages',
    	    type: 'GET',
                data: {
                    limit:0
                },
                dataType: ($.browser.msie) ? 'text' : 'xml',
    	    complete: function(data) {
                    var xml = readXML(data.responseText);
                    var count = Deki.$('subpages',xml).attr('totalcount');
                    if(count > 0 ){
                        $img.css('background-position', collapseIcon_show);
                    }
                    else {
                        $img.css('background-position', '0px -'+(16+16*(depth%3))+'px')
                            .css('cursor','auto')
                            .unbind('click');
                    }
    	    }
    	});
    	// Set bullet to expand icon or appropriate UL bullet
    	$img.css('background-position', collapseIcon_show)
                .css('cursor','pointer')
                .click(function(){
                    $self= Deki.$(this);
                    $parent = $self.parent();
                    var subpages = $parent.children('ul:first');
                    if(subpages.css('display') == 'none'){        // subpages is hidden
                        //show sublist
                        if(slide)            subpages.slideDown('fast');
    		    else                 subpages.show();
                        $self.css('background-position',collapseIcon_hide);
                    }
                    else if(subpages.html() && subpages.html().length > 0){        // subpages is not hidden
                        //hide sublist
                        if(slide)            subpages.slideUp('fast');
    		    else                 subpages.hide();
    		    $self.css('background-position',collapseIcon_show);
                    }
                    else {    // the hard part...
                        // loader icon.
                        $self.css('background-image','url("..loaderLocation..")');
                        //strip all empty uls
                        $parent.find('ul').each(function(){
                            if(! subpages.html() || subpages.html().length <= 0){
                                Deki.$(this).remove();
                            }
                        });
    		    // collect parent's page path.
    		    var link = $parent.find('a');
    		    var path = link.attr('href').replace("..json.emit(site.uri)..",'');
                        // load list with ajax
                        // create and immediately hide the list
    		    subpages = Deki.$('<ul></ul>').css('display','none');
    		    
    		    Deki.$.ajax({
    		        url: '/@api/deki/pages/='+Deki.url.encode(Deki.url.encode(path))+'/subpages',
    			type: 'GET',
                            dataType: ($.browser.msie) ? 'text' : 'xml',
    			complete: function(data) {
                                var xml = readXML(data.responseText);
                                var titles = Deki.$('title',xml);
                                var paths = Deki.$('path',xml);
                                if(titles.length > 0 ){
                                    for(var i=0; i< titles.length;i++){
                                        var $child = Deki.$('<li></li>')
                                            .append(Deki.$('<a></a>')
                                                .text(Deki.$(titles[i]).text())
                                                .attr('href',Deki.url.encode('/' + Deki.$(paths[i]).text())))
                                            .appendTo(subpages);
                                    }
                                    $self.css('background-image','url("..icons..")')
                                         .css('background-position', collapseIcon_hide);
                                    $parent.append(subpages);
                                    if(slide)    subpages.slideDown('fast')
                                    else         subpages.show();
    			        collapse_list(subpages, depth+1, slide);
                                }
                                else {
                                    $self.css('background-image','url("..icons..")')
                                         .css('background-position', '0px -'+(16+16*(depth%3))+'px');
                                }
    			}
    		    });
                    }
                });
        });
    }
    "</script>
    </head>
    // Content goes in the body
    <body>
    	<p />    // This is a marker to help find the list that follows
            <div id=(@id)> wiki.tree(path,1) </div>;
    </body>
    </html>
    
        Send feedback