source: temp/branches/ec-cube-beta/html/test/kakinaka/js/treeview/treeview.js @ 11375

Revision 11375, 52.4 KB checked in by kaki, 18 years ago (diff)
  • Property svn:eol-style set to native
  • Property svn:keywords set to Author Date Id Revision
Line 
1/*                                                                                                                                                     
2Copyright (c) 2006, Yahoo! Inc. All rights reserved.
3Code licensed under the BSD License:
4http://developer.yahoo.net/yui/license.txt
5version: 0.11.3
6*/
7
8/**
9 * Contains the tree view state data and the root node.  This is an
10 * ordered tree; child nodes will be displayed in the order created, and
11 * there currently is no way to change this.
12 *
13 * @constructor
14 * @param {string|HTMLElement} id The id of the element, or the element
15 * itself that the tree will be inserted into.
16 */
17YAHOO.widget.TreeView = function(id) {
18    if (id) { this.init(id); }
19};
20
21/**
22 * Count of all nodes in all trees
23 * @type int
24 */
25YAHOO.widget.TreeView.nodeCount = 0;
26
27YAHOO.widget.TreeView.prototype = {
28
29    /**
30     * The id of tree container element
31     *
32     * @type String
33     */
34    id: null,
35
36    /**
37     * The host element for this tree
38     * @private
39     */
40    _el: null,
41
42     /**
43     * Flat collection of all nodes in this tree
44     *
45     * @type Node[]
46     * @private
47     */
48    _nodes: null,
49
50    /**
51     * We lock the tree control while waiting for the dynamic loader to return
52     *
53     * @type boolean
54     */
55    locked: false,
56
57    /**
58     * The animation to use for expanding children, if any
59     *
60     * @type string
61     * @private
62     */
63    _expandAnim: null,
64
65    /**
66     * The animation to use for collapsing children, if any
67     *
68     * @type string
69     * @private
70     */
71    _collapseAnim: null,
72
73    /**
74     * The current number of animations that are executing
75     *
76     * @type int
77     * @private
78     */
79    _animCount: 0,
80
81    /**
82     * The maximum number of animations to run at one time.
83     *
84     * @type int
85     */
86    maxAnim: 2,
87
88    /**
89     * Sets up the animation for expanding children
90     *
91     * @param {string} the type of animation (acceptable values defined in
92     * YAHOO.widget.TVAnim)
93     */
94    setExpandAnim: function(type) {
95        if (YAHOO.widget.TVAnim.isValid(type)) {
96            this._expandAnim = type;
97        }
98    },
99
100    /**
101     * Sets up the animation for collapsing children
102     *
103     * @param {string} the type of animation (acceptable values defined in
104     * YAHOO.widget.TVAnim)
105     */
106    setCollapseAnim: function(type) {
107        if (YAHOO.widget.TVAnim.isValid(type)) {
108            this._collapseAnim = type;
109        }
110    },
111
112    /**
113     * Perform the expand animation if configured, or just show the
114     * element if not configured or too many animations are in progress
115     *
116     * @param el {HTMLElement} the element to animate
117     * @return {boolean} true if animation could be invoked, false otherwise
118     */
119    animateExpand: function(el) {
120
121        if (this._expandAnim && this._animCount < this.maxAnim) {
122            // this.locked = true;
123            var tree = this;
124            var a = YAHOO.widget.TVAnim.getAnim(this._expandAnim, el,
125                            function() { tree.expandComplete(); });
126            if (a) {
127                ++this._animCount;
128                a.animate();
129            }
130
131            return true;
132        }
133
134        return false;
135    },
136
137    /**
138     * Perform the collapse animation if configured, or just show the
139     * element if not configured or too many animations are in progress
140     *
141     * @param el {HTMLElement} the element to animate
142     * @return {boolean} true if animation could be invoked, false otherwise
143     */
144    animateCollapse: function(el) {
145
146        if (this._collapseAnim && this._animCount < this.maxAnim) {
147            // this.locked = true;
148            var tree = this;
149            var a = YAHOO.widget.TVAnim.getAnim(this._collapseAnim, el,
150                            function() { tree.collapseComplete(); });
151            if (a) {
152                ++this._animCount;
153                a.animate();
154            }
155
156            return true;
157        }
158
159        return false;
160    },
161
162    /**
163     * Function executed when the expand animation completes
164     */
165    expandComplete: function() {
166        --this._animCount;
167        // this.locked = false;
168    },
169
170    /**
171     * Function executed when the collapse animation completes
172     */
173    collapseComplete: function() {
174        --this._animCount;
175        // this.locked = false;
176    },
177
178    /**
179     * Initializes the tree
180     *
181     * @parm {string|HTMLElement} id the id of the element that will hold the tree
182     * @private
183     */
184    init: function(id) {
185
186        this.id = id;
187
188        if ("string" !== typeof id) {
189            this._el = id;
190            this.id = this.generateId(id);
191        }
192
193        this._nodes = [];
194
195        // store a global reference
196        YAHOO.widget.TreeView.trees[this.id] = this;
197
198        // Set up the root node
199        this.root = new YAHOO.widget.RootNode(this);
200
201
202    },
203
204    /**
205     * Renders the tree boilerplate and visible nodes
206     */
207    draw: function() {
208        var html = this.root.getHtml();
209        this.getEl().innerHTML = html;
210        this.firstDraw = false;
211    },
212
213    /**
214     * Returns the tree's host element
215     * @return {HTMLElement} the host element
216     */
217    getEl: function() {
218        if (! this._el) {
219            this._el = document.getElementById(this.id);
220        }
221        return this._el;
222    },
223
224    /**
225     * Nodes register themselves with the tree instance when they are created.
226     *
227     * @param node {Node} the node to register
228     * @private
229     */
230    regNode: function(node) {
231        this._nodes[node.index] = node;
232    },
233
234    /**
235     * Returns the root node of this tree
236     *
237     * @return {Node} the root node
238     */
239    getRoot: function() {
240        return this.root;
241    },
242
243    /**
244     * Configures this tree to dynamically load all child data
245     *
246     * @param {function} fnDataLoader the function that will be called to get the data
247     * @param iconMode {int} configures the icon that is displayed when a dynamic
248     * load node is expanded the first time without children.  By default, the
249     * "collapse" icon will be used.  If set to 1, the leaf node icon will be
250     * displayed.
251     */
252    setDynamicLoad: function(fnDataLoader, iconMode) {
253        this.root.setDynamicLoad(fnDataLoader, iconMode);
254    },
255
256    /**
257     * Expands all child nodes.  Note: this conflicts with the "multiExpand"
258     * node property.  If expand all is called in a tree with nodes that
259     * do not allow multiple siblings to be displayed, only the last sibling
260     * will be expanded.
261     */
262    expandAll: function() {
263        if (!this.locked) {
264            this.root.expandAll();
265        }
266    },
267
268    /**
269     * Collapses all expanded child nodes in the entire tree.
270     */
271    collapseAll: function() {
272        if (!this.locked) {
273            this.root.collapseAll();
274        }
275    },
276
277    /**
278     * Returns a node in the tree that has the specified index (this index
279     * is created internally, so this function probably will only be used
280     * in html generated for a given node.)
281     *
282     * @param {int} nodeIndex the index of the node wanted
283     * @return {Node} the node with index=nodeIndex, null if no match
284     */
285    getNodeByIndex: function(nodeIndex) {
286        var n = this._nodes[nodeIndex];
287        return (n) ? n : null;
288    },
289
290    /**
291     * Returns a node that has a matching property and value in the data
292     * object that was passed into its constructor.
293     *
294     * @param {object} property the property to search (usually a string)
295     * @param {object} value the value we want to find (usuall an int or string)
296     * @return {Node} the matching node, null if no match
297     */
298    getNodeByProperty: function(property, value) {
299        for (var i in this._nodes) {
300            var n = this._nodes[i];
301            if (n.data && value == n.data[property]) {
302                return n;
303            }
304        }
305
306        return null;
307    },
308
309    /**
310     * Returns a collection of nodes that have a matching property
311     * and value in the data object that was passed into its constructor. 
312     *
313     * @param {object} property the property to search (usually a string)
314     * @param {object} value the value we want to find (usuall an int or string)
315     * @return {Array} the matching collection of nodes, null if no match
316     */
317    getNodesByProperty: function(property, value) {
318        var values = [];
319        for (var i in this._nodes) {
320            var n = this._nodes[i];
321            if (n.data && value == n.data[property]) {
322                values.push(n);
323            }
324        }
325
326        return (values.length) ? values : null;
327    },
328
329    /**
330     * Removes the node and its children, and optionally refreshes the
331     * branch of the tree that was affected.
332     * @param {Node} The node to remove
333     * @param {boolean} autoRefresh automatically refreshes branch if true
334     * @return {boolean} False is there was a problem, true otherwise.
335     */
336    removeNode: function(node, autoRefresh) {
337
338        // Don't delete the root node
339        if (node.isRoot()) {
340            return false;
341        }
342
343        // Get the branch that we may need to refresh
344        var p = node.parent;
345        if (p.parent) {
346            p = p.parent;
347        }
348
349        // Delete the node and its children
350        this._deleteNode(node);
351
352        // Refresh the parent of the parent
353        if (autoRefresh && p && p.childrenRendered) {
354            p.refresh();
355        }
356
357        return true;
358    },
359
360    /**
361     * Deletes this nodes child collection, recursively.  Also collapses
362     * the node, and resets the dynamic load flag.  The primary use for
363     * this method is to purge a node and allow it to fetch its data
364     * dynamically again.
365     * @param {Node} node the node to purge
366     */
367    removeChildren: function(node) {
368        while (node.children.length) {
369             this._deleteNode(node.children[0]);
370        }
371
372        node.childrenRendered = false;
373        node.dynamicLoadComplete = false;
374        // node.collapse();
375        node.expand();
376        node.collapse();
377    },
378
379    /**
380     * Deletes the node and recurses children
381     * @private
382     */
383    _deleteNode: function(node) {
384        // Remove all the child nodes first
385        this.removeChildren(node);
386
387        // Remove the node from the tree
388        this.popNode(node);
389    },
390
391    /**
392     * Removes the node from the tree, preserving the child collection
393     * to make it possible to insert the branch into another part of the
394     * tree, or another tree.
395     * @param {Node} the node to remove
396     */
397    popNode: function(node) {
398        var p = node.parent;
399
400        // Update the parent's collection of children
401        var a = [];
402
403        for (var i=0, len=p.children.length;i<len;++i) {
404            if (p.children[i] != node) {
405                a[a.length] = p.children[i];
406            }
407        }
408
409        p.children = a;
410
411        // reset the childrenRendered flag for the parent
412        p.childrenRendered = false;
413
414         // Update the sibling relationship
415        if (node.previousSibling) {
416            node.previousSibling.nextSibling = node.nextSibling;
417        }
418
419        if (node.nextSibling) {
420            node.nextSibling.previousSibling = node.previousSibling;
421        }
422
423        node.parent = null;
424        node.previousSibling = null;
425        node.nextSibling = null;
426        node.tree = null;
427
428        // Update the tree's node collection
429        delete this._nodes[node.index];
430    },
431
432    /**
433     * toString
434     * @return {string} string representation of the tree
435     */
436    toString: function() {
437        return "TreeView " + this.id;
438    },
439
440    /**
441     * private
442     */
443    generateId: function(el) {
444        var id = el.id;
445
446        if (!id) {
447            id = "yui-tv-auto-id-" + YAHOO.widget.TreeView.counter;
448            YAHOO.widget.TreeView.counter++;
449        }
450
451        return id;
452    },
453
454    /**
455     * Abstract method that is executed when a node is expanded
456     * @param node {Node} the node that was expanded
457     */
458    onExpand: function(node) { },
459
460    /**
461     * Abstract method that is executed when a node is collapsed
462     * @param node {Node} the node that was collapsed.
463     */
464    onCollapse: function(node) { }
465
466};
467
468/**
469 * Global cache of tree instances
470 *
471 * @type Array
472 * @private
473 */
474YAHOO.widget.TreeView.trees = [];
475
476/**
477 * @private
478 */
479YAHOO.widget.TreeView.counter = 0;
480
481/**
482 * Global method for getting a tree by its id.  Used in the generated
483 * tree html.
484 *
485 * @param treeId {String} the id of the tree instance
486 * @return {TreeView} the tree instance requested, null if not found.
487 */
488YAHOO.widget.TreeView.getTree = function(treeId) {
489    var t = YAHOO.widget.TreeView.trees[treeId];
490    return (t) ? t : null;
491};
492
493/**
494 * Global method for getting a node by its id.  Used in the generated
495 * tree html.
496 *
497 * @param treeId {String} the id of the tree instance
498 * @param nodeIndex {String} the index of the node to return
499 * @return {Node} the node instance requested, null if not found
500 */
501YAHOO.widget.TreeView.getNode = function(treeId, nodeIndex) {
502    var t = YAHOO.widget.TreeView.getTree(treeId);
503    return (t) ? t.getNodeByIndex(nodeIndex) : null;
504};
505
506/**
507 * Adds an event.  Replace with event manager when available
508 *
509 * @param el the elment to bind the handler to
510 * @param {string} sType the type of event handler
511 * @param {function} fn the callback to invoke
512 * @param {boolean} capture if true event is capture phase, bubble otherwise
513 */
514YAHOO.widget.TreeView.addHandler = function (el, sType, fn, capture) {
515    capture = (capture) ? true : false;
516    if (el.addEventListener) {
517        el.addEventListener(sType, fn, capture);
518    } else if (el.attachEvent) {
519        el.attachEvent("on" + sType, fn);
520    } else {
521        el["on" + sType] = fn;
522    }
523};
524
525/**
526 * Attempts to preload the images defined in the styles used to draw the tree by
527 * rendering off-screen elements that use the styles.
528 */
529YAHOO.widget.TreeView.preload = function(prefix) {
530    prefix = prefix || "ygtv";
531    var styles = ["tn","tm","tmh","tp","tph","ln","lm","lmh","lp","lph","loading"];
532
533    var sb = [];
534   
535    for (var i = 0; i < styles.length; ++i) {
536        sb[sb.length] = '<span class="' + prefix + styles[i] + '">&#160;</span>';
537    }
538
539    var f = document.createElement("DIV");
540    var s = f.style;
541    s.position = "absolute";
542    s.top = "-1000px";
543    s.left = "-1000px";
544    f.innerHTML = sb.join("");
545
546    document.body.appendChild(f);
547};
548
549YAHOO.widget.TreeView.addHandler(window,
550                "load", YAHOO.widget.TreeView.preload);
551
552/**
553 * The base class for all tree nodes.  The node's presentation and behavior in
554 * response to mouse events is handled in Node subclasses.
555 *
556 * @param oData {object} a string or object containing the data that will
557 * be used to render this node
558 * @param oParent {Node} this node's parent node
559 * @param expanded {boolean} the initial expanded/collapsed state
560 * @constructor
561 */
562YAHOO.widget.Node = function(oData, oParent, expanded) {
563    if (oData) { this.init(oData, oParent, expanded); }
564};
565
566YAHOO.widget.Node.prototype = {
567
568    /**
569     * The index for this instance obtained from global counter in YAHOO.widget.TreeView.
570     *
571     * @type int
572     */
573    index: 0,
574
575    /**
576     * This node's child node collection.
577     *
578     * @type Node[]
579     */
580    children: null,
581
582    /**
583     * Tree instance this node is part of
584     *
585     * @type TreeView
586     */
587    tree: null,
588
589    /**
590     * The data linked to this node.  This can be any object or primitive
591     * value, and the data can be used in getNodeHtml().
592     *
593     * @type object
594     */
595    data: null,
596
597    /**
598     * Parent node
599     *
600     * @type Node
601     */
602    parent: null,
603
604    /**
605     * The depth of this node.  We start at -1 for the root node.
606     *
607     * @type int
608     */
609    depth: -1,
610
611    /**
612     * The href for the node's label.  If one is not specified, the href will
613     * be set so that it toggles the node.
614     *
615     * @type string
616     */
617    href: null,
618
619    /**
620     * The label href target, defaults to current window
621     *
622     * @type string
623     */
624    target: "_self",
625
626    /**
627     * The node's expanded/collapsed state
628     *
629     * @type boolean
630     */
631    expanded: false,
632
633    /**
634     * Can multiple children be expanded at once?
635     *
636     * @type boolean
637     */
638    multiExpand: true,
639
640    /**
641     * Should we render children for a collapsed node?  It is possible that the
642     * implementer will want to render the hidden data...  @todo verify that we
643     * need this, and implement it if we do.
644     *
645     * @type boolean
646     */
647    renderHidden: false,
648
649    /**
650     * This flag is set to true when the html is generated for this node's
651     * children, and set to false when new children are added.
652     * @type boolean
653     */
654    childrenRendered: false,
655
656    /**
657     * Dynamically loaded nodes only fetch the data the first time they are
658     * expanded.  This flag is set to true once the data has been fetched.
659     * @type boolean
660     */
661    dynamicLoadComplete: false,
662
663    /**
664     * This node's previous sibling
665     *
666     * @type Node
667     */
668    previousSibling: null,
669
670    /**
671     * This node's next sibling
672     *
673     * @type Node
674     */
675    nextSibling: null,
676
677    /**
678     * We can set the node up to call an external method to get the child
679     * data dynamically.
680     *
681     * @type boolean
682     * @private
683     */
684    _dynLoad: false,
685
686    /**
687     * Function to execute when we need to get this node's child data.
688     *
689     * @type function
690     */
691    dataLoader: null,
692
693    /**
694     * This is true for dynamically loading nodes while waiting for the
695     * callback to return.
696     *
697     * @type boolean
698     */
699    isLoading: false,
700
701    /**
702     * The toggle/branch icon will not show if this is set to false.  This
703     * could be useful if the implementer wants to have the child contain
704     * extra info about the parent, rather than an actual node.
705     *
706     * @type boolean
707     */
708    hasIcon: true,
709
710    /**
711     * Used to configure what happens when a dynamic load node is expanded
712     * and we discover that it does not have children.  By default, it is
713     * treated as if it still could have children (plus/minus icon).  Set
714     * iconMode to have it display like a leaf node instead.
715     * @type int
716     */
717    iconMode: 0,
718
719    /**
720     * The node type
721     * @private
722     */
723    _type: "Node",
724
725    /*
726    spacerPath: "http://us.i1.yimg.com/us.yimg.com/i/space.gif",
727    expandedText: "Expanded",
728    collapsedText: "Collapsed",
729    loadingText: "Loading",
730    */
731
732    /**
733     * Initializes this node, gets some of the properties from the parent
734     *
735     * @param oData {object} a string or object containing the data that will
736     * be used to render this node
737     * @param oParent {Node} this node's parent node
738     * @param expanded {boolean} the initial expanded/collapsed state
739     */
740    init: function(oData, oParent, expanded, index) {
741        this.data       = oData;
742        this.children   = [];
743       
744        if(typeof index == "number"){
745            this.index      = index;
746        }else{
747            this.index      = YAHOO.widget.TreeView.nodeCount;
748            ++YAHOO.widget.TreeView.nodeCount;
749        }
750        this.expanded   = expanded;
751       
752
753        // oParent should never be null except when we create the root node.
754        if (oParent) {
755            oParent.appendChild(this);
756        }
757    },
758
759    /**
760     * Certain properties for the node cannot be set until the parent
761     * is known. This is called after the node is inserted into a tree.
762     * the parent is also applied to this node's children in order to
763     * make it possible to move a branch from one tree to another.
764     * @param {Node} parentNode this node's parent node
765     * @return {boolean} true if the application was successful
766     */
767    applyParent: function(parentNode) {
768        if (!parentNode) {
769            return false;
770        }
771
772        this.tree   = parentNode.tree;
773        this.parent = parentNode;
774        this.depth  = parentNode.depth + 1;
775
776        if (! this.href) {
777            this.href = "javascript:" + this.getToggleLink();
778        }
779
780        if (! this.multiExpand) {
781            this.multiExpand = parentNode.multiExpand;
782        }
783
784        this.tree.regNode(this);
785        parentNode.childrenRendered = false;
786
787        // cascade update existing children
788        for (var i=0, len=this.children.length;i<len;++i) {
789            this.children[i].applyParent(this);
790        }
791
792        return true;
793    },
794
795    /**
796     * Appends a node to the child collection.
797     *
798     * @param childNode {Node} the new node
799     * @return {Node} the child node
800     * @private
801     */
802    appendChild: function(childNode) {
803        if (this.hasChildren()) {
804            var sib = this.children[this.children.length - 1];
805            sib.nextSibling = childNode;
806            childNode.previousSibling = sib;
807        }
808        this.children[this.children.length] = childNode;
809        childNode.applyParent(this);
810
811        return childNode;
812    },
813
814    /**
815     * Appends this node to the supplied node's child collection
816     * @param parentNode {Node} the node to append to.
817     * @return {Node} The appended node
818     */
819    appendTo: function(parentNode) {
820        return parentNode.appendChild(this);
821    },
822
823    /**
824    * Inserts this node before this supplied node
825    *
826    * @param node {Node} the node to insert this node before
827    * @return {Node} the inserted node
828    */
829    insertBefore: function(node) {
830        var p = node.parent;
831        if (p) {
832
833            if (this.tree) {
834                this.tree.popNode(this);
835            }
836
837            var refIndex = node.isChildOf(p);
838            p.children.splice(refIndex, 0, this);
839            if (node.previousSibling) {
840                node.previousSibling.nextSibling = this;
841            }
842            this.previousSibling = node.previousSibling;
843            this.nextSibling = node;
844            node.previousSibling = this;
845
846            this.applyParent(p);
847        }
848
849        return this;
850    },
851 
852    /**
853    * Inserts this node after the supplied node
854    *
855    * @param node {Node} the node to insert after
856    * @return {Node} the inserted node
857    */
858    insertAfter: function(node) {
859        var p = node.parent;
860        if (p) {
861
862            if (this.tree) {
863                this.tree.popNode(this);
864            }
865
866            var refIndex = node.isChildOf(p);
867
868            if (!node.nextSibling) {
869                return this.appendTo(p);
870            }
871
872            p.children.splice(refIndex + 1, 0, this);
873
874            node.nextSibling.previousSibling = this;
875            this.previousSibling = node;
876            this.nextSibling = node.nextSibling;
877            node.nextSibling = this;
878
879            this.applyParent(p);
880        }
881
882        return this;
883    },
884
885    /**
886    * Returns true if the Node is a child of supplied Node
887    *
888    * @param parentNode {Node} the Node to check
889    * @return {boolean} The node index if this Node is a child of
890    *                   supplied Node, else -1.
891    * @private
892    */
893    isChildOf: function(parentNode) {
894        if (parentNode && parentNode.children) {
895            for (var i=0, len=parentNode.children.length; i<len ; ++i) {
896                if (parentNode.children[i] === this) {
897                    return i;
898                }
899            }
900        }
901
902        return -1;
903    },
904
905    /**
906     * Returns a node array of this node's siblings, null if none.
907     *
908     * @return Node[]
909     */
910    getSiblings: function() {
911        return this.parent.children;
912    },
913
914    /**
915     * Shows this node's children
916     */
917    showChildren: function() {
918        if (!this.tree.animateExpand(this.getChildrenEl())) {
919            if (this.hasChildren()) {
920                this.getChildrenEl().style.display = "";
921            }
922        }
923    },
924
925    /**
926     * Hides this node's children
927     */
928    hideChildren: function() {
929
930        if (!this.tree.animateCollapse(this.getChildrenEl())) {
931            this.getChildrenEl().style.display = "none";
932        }
933    },
934
935    /**
936     * Returns the id for this node's container div
937     *
938     * @return {string} the element id
939     */
940    getElId: function() {
941        return "ygtv" + this.index;
942    },
943
944    /**
945     * Returns the id for this node's children div
946     *
947     * @return {string} the element id for this node's children div
948     */
949    getChildrenElId: function() {
950        return "ygtvc" + this.index;
951    },
952
953    /**
954     * Returns the id for this node's toggle element
955     *
956     * @return {string} the toggel element id
957     */
958    getToggleElId: function() {
959        return "ygtvt" + this.index;
960    },
961
962    /**
963     * Returns the id for this node's spacer image.  The spacer is positioned
964     * over the toggle and provides feedback for screen readers.
965     * @return {string} the id for the spacer image
966     */
967    /*
968    getSpacerId: function() {
969        return "ygtvspacer" + this.index;
970    },
971    */
972
973    /**
974     * Returns this node's container html element
975     * @return {HTMLElement} the container html element
976     */
977    getEl: function() {
978        return document.getElementById(this.getElId());
979    },
980
981    /**
982     * Returns the div that was generated for this node's children
983     * @return {HTMLElement} this node's children div
984     */
985    getChildrenEl: function() {
986        return document.getElementById(this.getChildrenElId());
987    },
988
989    /**
990     * Returns the element that is being used for this node's toggle.
991     * @return {HTMLElement} this node's toggle html element
992     */
993    getToggleEl: function() {
994        return document.getElementById(this.getToggleElId());
995    },
996
997    /**
998     * Returns the element that is being used for this node's spacer.
999     * @return {HTMLElement} this node's spacer html element
1000     */
1001    /*
1002    getSpacer: function() {
1003        return document.getElementById( this.getSpacerId() ) || {};
1004    },
1005    */
1006
1007    /*
1008    getStateText: function() {
1009        if (this.isLoading) {
1010            return this.loadingText;
1011        } else if (this.hasChildren(true)) {
1012            if (this.expanded) {
1013                return this.expandedText;
1014            } else {
1015                return this.collapsedText;
1016            }
1017        } else {
1018            return "";
1019        }
1020    },
1021    */
1022
1023    /**
1024     * Generates the link that will invoke this node's toggle method
1025     * @return {string} the javascript url for toggling this node
1026     */
1027    getToggleLink: function() {
1028        return "YAHOO.widget.TreeView.getNode(\'" + this.tree.id + "\'," +
1029            this.index + ").toggle()";
1030    },
1031
1032    /**
1033     * Hides this nodes children (creating them if necessary), changes the
1034     * toggle style.
1035     */
1036    collapse: function() {
1037        // Only collapse if currently expanded
1038        if (!this.expanded) { return; }
1039
1040        // fire the collapse event handler
1041        var ret = this.tree.onCollapse(this);
1042
1043        if ("undefined" != typeof ret && !ret) {
1044            return;
1045        }
1046
1047        if (!this.getEl()) {
1048            this.expanded = false;
1049            return;
1050        }
1051
1052        // hide the child div
1053        this.hideChildren();
1054        this.expanded = false;
1055
1056        if (this.hasIcon) {
1057            this.getToggleEl().className = this.getStyle();
1058        }
1059
1060        // this.getSpacer().title = this.getStateText();
1061
1062    },
1063
1064    /**
1065     * Shows this nodes children (creating them if necessary), changes the
1066     * toggle style, and collapses its siblings if multiExpand is not set.
1067     */
1068    expand: function() {
1069        // Only expand if currently collapsed.
1070        if (this.expanded) { return; }
1071
1072        // fire the expand event handler
1073        var ret = this.tree.onExpand(this);
1074
1075        if ("undefined" != typeof ret && !ret) {
1076            return;
1077        }
1078
1079        if (!this.getEl()) {
1080            this.expanded = true;
1081            return;
1082        }
1083
1084        if (! this.childrenRendered) {
1085            this.getChildrenEl().innerHTML = this.renderChildren();
1086        } else {
1087        }
1088
1089        this.expanded = true;
1090        if (this.hasIcon) {
1091            this.getToggleEl().className = this.getStyle();
1092        }
1093
1094        // this.getSpacer().title = this.getStateText();
1095
1096        // We do an extra check for children here because the lazy
1097        // load feature can expose nodes that have no children.
1098
1099        // if (!this.hasChildren()) {
1100        if (this.isLoading) {
1101            this.expanded = false;
1102            return;
1103        }
1104
1105        if (! this.multiExpand) {
1106            var sibs = this.getSiblings();
1107            for (var i=0; i<sibs.length; ++i) {
1108                if (sibs[i] != this && sibs[i].expanded) {
1109                    sibs[i].collapse();
1110                }
1111            }
1112        }
1113
1114        this.showChildren();
1115    },
1116
1117    /**
1118     * Returns the css style name for the toggle
1119     *
1120     * @return {string} the css class for this node's toggle
1121     */
1122    getStyle: function() {
1123        if (this.isLoading) {
1124            return "ygtvloading";
1125        } else {
1126            // location top or bottom, middle nodes also get the top style
1127            var loc = (this.nextSibling) ? "t" : "l";
1128
1129            // type p=plus(expand), m=minus(collapase), n=none(no children)
1130            var type = "n";
1131            if (this.hasChildren(true) || (this.isDynamic() && !this.getIconMode())) {
1132            // if (this.hasChildren(true)) {
1133                type = (this.expanded) ? "m" : "p";
1134            }
1135
1136            return "ygtv" + loc + type;
1137        }
1138    },
1139
1140    /**
1141     * Returns the hover style for the icon
1142     * @return {string} the css class hover state
1143     */
1144    getHoverStyle: function() {
1145        var s = this.getStyle();
1146        if (this.hasChildren(true) && !this.isLoading) {
1147            s += "h";
1148        }
1149        return s;
1150    },
1151
1152    /**
1153     * Recursively expands all of this node's children.
1154     */
1155    expandAll: function() {
1156        for (var i=0;i<this.children.length;++i) {
1157            var c = this.children[i];
1158            if (c.isDynamic()) {
1159                alert("Not supported (lazy load + expand all)");
1160                break;
1161            } else if (! c.multiExpand) {
1162                alert("Not supported (no multi-expand + expand all)");
1163                break;
1164            } else {
1165                c.expand();
1166                c.expandAll();
1167            }
1168        }
1169    },
1170
1171    /**
1172     * Recursively collapses all of this node's children.
1173     */
1174    collapseAll: function() {
1175        for (var i=0;i<this.children.length;++i) {
1176            this.children[i].collapse();
1177            this.children[i].collapseAll();
1178        }
1179    },
1180
1181    /**
1182     * Configures this node for dynamically obtaining the child data
1183     * when the node is first expanded.  Calling it without the callback
1184     * will turn off dynamic load for the node.
1185     *
1186     * @param fmDataLoader {function} the function that will be used to get the data.
1187     * @param iconMode {int} configures the icon that is displayed when a dynamic
1188     * load node is expanded the first time without children.  By default, the
1189     * "collapse" icon will be used.  If set to 1, the leaf node icon will be
1190     * displayed.
1191     */
1192    setDynamicLoad: function(fnDataLoader, iconMode) {
1193        if (fnDataLoader) {
1194            this.dataLoader = fnDataLoader;
1195            this._dynLoad = true;
1196        } else {
1197            this.dataLoader = null;
1198            this._dynLoad = false;
1199        }
1200
1201        if (iconMode) {
1202            this.iconMode = iconMode;
1203        }
1204    },
1205
1206    /**
1207     * Evaluates if this node is the root node of the tree
1208     *
1209     * @return {boolean} true if this is the root node
1210     */
1211    isRoot: function() {
1212        return (this == this.tree.root);
1213    },
1214
1215    /**
1216     * Evaluates if this node's children should be loaded dynamically.  Looks for
1217     * the property both in this instance and the root node.  If the tree is
1218     * defined to load all children dynamically, the data callback function is
1219     * defined in the root node
1220     *
1221     * @return {boolean} true if this node's children are to be loaded dynamically
1222     */
1223    isDynamic: function() {
1224        var lazy = (!this.isRoot() && (this._dynLoad || this.tree.root._dynLoad));
1225        return lazy;
1226    },
1227
1228    getIconMode: function() {
1229        return (this.iconMode || this.tree.root.iconMode);
1230    },
1231
1232    /**
1233     * Checks if this node has children.  If this node is lazy-loading and the
1234     * children have not been rendered, we do not know whether or not there
1235     * are actual children.  In most cases, we need to assume that there are
1236     * children (for instance, the toggle needs to show the expandable
1237     * presentation state).  In other times we want to know if there are rendered
1238     * children.  For the latter, "checkForLazyLoad" should be false.
1239     *
1240     * @param checkForLazyLoad {boolean} should we check for unloaded children?
1241     * @return {boolean} true if this has children or if it might and we are
1242     * checking for this condition.
1243     */
1244    hasChildren: function(checkForLazyLoad) {
1245        return ( this.children.length > 0 ||
1246                (checkForLazyLoad && this.isDynamic() && !this.dynamicLoadComplete) );
1247    },
1248
1249    /**
1250     * Expands if node is collapsed, collapses otherwise.
1251     */
1252    toggle: function() {
1253        if (!this.tree.locked && ( this.hasChildren(true) || this.isDynamic()) ) {
1254            if (this.expanded) { this.collapse(); } else { this.expand(); }
1255        }
1256    },
1257
1258    /**
1259     * Returns the markup for this node and its children.
1260     *
1261     * @return {string} the markup for this node and its expanded children.
1262     */
1263    getHtml: function() {
1264        var sb = [];
1265        sb[sb.length] = '<div class="ygtvitem" id="' + this.getElId() + '">';
1266        sb[sb.length] = this.getNodeHtml();
1267        sb[sb.length] = this.getChildrenHtml();
1268        sb[sb.length] = '</div>';
1269        return sb.join("");
1270    },
1271
1272    /**
1273     * Called when first rendering the tree.  We always build the div that will
1274     * contain this nodes children, but we don't render the children themselves
1275     * unless this node is expanded.
1276     *
1277     * @return {string} the children container div html and any expanded children
1278     * @private
1279     */
1280    getChildrenHtml: function() {
1281
1282        var sb = [];
1283        sb[sb.length] = '<div class="ygtvchildren"';
1284        sb[sb.length] = ' id="' + this.getChildrenElId() + '"';
1285        if (!this.expanded) {
1286            sb[sb.length] = ' style="display:none;"';
1287        }
1288        sb[sb.length] = '>';
1289
1290        // Don't render the actual child node HTML unless this node is expanded.
1291        if ( (this.hasChildren(true) && this.expanded) ||
1292                (this.renderHidden && !this.isDynamic()) ) {
1293            sb[sb.length] = this.renderChildren();
1294        }
1295
1296        sb[sb.length] = '</div>';
1297
1298        return sb.join("");
1299    },
1300
1301    /**
1302     * Generates the markup for the child nodes.  This is not done until the node
1303     * is expanded.
1304     *
1305     * @return {string} the html for this node's children
1306     * @private
1307     */
1308    renderChildren: function() {
1309
1310
1311        var node = this;
1312
1313        if (this.isDynamic() && !this.dynamicLoadComplete) {
1314            this.isLoading = true;
1315            this.tree.locked = true;
1316
1317            if (this.dataLoader) {
1318
1319                setTimeout(
1320                    function() {
1321                        node.dataLoader(node,
1322                            function() {
1323                                node.loadComplete();
1324                            });
1325                    }, 10);
1326               
1327            } else if (this.tree.root.dataLoader) {
1328
1329                setTimeout(
1330                    function() {
1331                        node.tree.root.dataLoader(node,
1332                            function() {
1333                                node.loadComplete();
1334                            });
1335                    }, 10);
1336
1337            } else {
1338                return "Error: data loader not found or not specified.";
1339            }
1340
1341            return "";
1342
1343        } else {
1344            return this.completeRender();
1345        }
1346    },
1347
1348    /**
1349     * Called when we know we have all the child data.
1350     * @return {string} children html
1351     */
1352    completeRender: function() {
1353        var sb = [];
1354
1355        for (var i=0; i < this.children.length; ++i) {
1356            this.children[i].childrenRendered = false;
1357            sb[sb.length] = this.children[i].getHtml();
1358        }
1359       
1360        this.childrenRendered = true;
1361
1362        return sb.join("");
1363    },
1364
1365    /**
1366     * Load complete is the callback function we pass to the data provider
1367     * in dynamic load situations.
1368     */
1369    loadComplete: function() {
1370        this.getChildrenEl().innerHTML = this.completeRender();
1371        this.dynamicLoadComplete = true;
1372        this.isLoading = false;
1373        this.expand();
1374        this.tree.locked = false;
1375    },
1376
1377    /**
1378     * Returns this node's ancestor at the specified depth.
1379     *
1380     * @param {int} depth the depth of the ancestor.
1381     * @return {Node} the ancestor
1382     */
1383    getAncestor: function(depth) {
1384        if (depth >= this.depth || depth < 0)  {
1385            return null;
1386        }
1387
1388        var p = this.parent;
1389       
1390        while (p.depth > depth) {
1391            p = p.parent;
1392        }
1393
1394        return p;
1395    },
1396
1397    /**
1398     * Returns the css class for the spacer at the specified depth for
1399     * this node.  If this node's ancestor at the specified depth
1400     * has a next sibling the presentation is different than if it
1401     * does not have a next sibling
1402     *
1403     * @param {int} depth the depth of the ancestor.
1404     * @return {string} the css class for the spacer
1405     */
1406    getDepthStyle: function(depth) {
1407        return (this.getAncestor(depth).nextSibling) ?
1408            "ygtvdepthcell" : "ygtvblankdepthcell";
1409    },
1410
1411    /**
1412     * Get the markup for the node.  This is designed to be overrided so that we can
1413     * support different types of nodes.
1414     *
1415     * @return {string} The HTML that will render this node.
1416     */
1417    getNodeHtml: function() {
1418        return "";
1419    },
1420
1421    /**
1422     * Regenerates the html for this node and its children.  To be used when the
1423     * node is expanded and new children have been added.
1424     */
1425    refresh: function() {
1426        // this.loadComplete();
1427        this.getChildrenEl().innerHTML = this.completeRender();
1428
1429        if (this.hasIcon) {
1430            var el = this.getToggleEl();
1431            if (el) {
1432                el.className = this.getStyle();
1433            }
1434        }
1435    },
1436
1437    /**
1438     * toString
1439     * @return {string} string representation of the node
1440     */
1441    toString: function() {
1442        return "Node (" + this.index + ")";
1443    }
1444
1445};
1446
1447/**
1448 * A custom YAHOO.widget.Node that handles the unique nature of
1449 * the virtual, presentationless root node.
1450 *
1451 * @extends YAHOO.widget.Node
1452 * @constructor
1453 */
1454YAHOO.widget.RootNode = function(oTree) {
1455    // Initialize the node with null params.  The root node is a
1456    // special case where the node has no presentation.  So we have
1457    // to alter the standard properties a bit.
1458    this.init(null, null, true);
1459   
1460    /**
1461     * For the root node, we get the tree reference from as a param
1462     * to the constructor instead of from the parent element.
1463     *
1464     * @type TreeView
1465     */
1466    this.tree = oTree;
1467};
1468
1469YAHOO.widget.RootNode.prototype = new YAHOO.widget.Node();
1470
1471// overrides YAHOO.widget.Node
1472YAHOO.widget.RootNode.prototype.getNodeHtml = function() {
1473    return "";
1474};
1475
1476YAHOO.widget.RootNode.prototype.toString = function() {
1477    return "RootNode";
1478};
1479
1480YAHOO.widget.RootNode.prototype.loadComplete = function() {
1481    this.tree.draw();
1482};
1483/**
1484 * The default node presentation.  The first parameter should be
1485 * either a string that will be used as the node's label, or an object
1486 * that has a string propery called label.  By default, the clicking the
1487 * label will toggle the expanded/collapsed state of the node.  By
1488 * changing the href property of the instance, this behavior can be
1489 * changed so that the label will go to the specified href.
1490 *
1491 * @extends YAHOO.widget.Node
1492 * @constructor
1493 * @param oData {object} a string or object containing the data that will
1494 * be used to render this node
1495 * @param oParent {YAHOO.widget.Node} this node's parent node
1496 * @param expanded {boolean} the initial expanded/collapsed state
1497 */
1498YAHOO.widget.TextNode = function(oData, oParent, expanded, index) {
1499    // this.type = "TextNode";
1500
1501    if (oData) {
1502        this.init(oData, oParent, expanded, index);
1503        this.setUpLabel(oData);
1504    }
1505
1506    /**
1507     * @private
1508     */
1509};
1510
1511YAHOO.widget.TextNode.prototype = new YAHOO.widget.Node();
1512
1513/**
1514 * The CSS class for the label href.  Defaults to ygtvlabel, but can be
1515 * overridden to provide a custom presentation for a specific node.
1516 *
1517 * @type string
1518 */
1519YAHOO.widget.TextNode.prototype.labelStyle = "ygtvlabel";
1520
1521/**
1522 * The derived element id of the label for this node
1523 *
1524 * @type string
1525 */
1526YAHOO.widget.TextNode.prototype.labelElId = null;
1527
1528/**
1529 * The text for the label.  It is assumed that the oData parameter will
1530 * either be a string that will be used as the label, or an object that
1531 * has a property called "label" that we will use.
1532 *
1533 * @type string
1534 */
1535YAHOO.widget.TextNode.prototype.label = null;
1536
1537/**
1538 * Sets up the node label
1539 *
1540 * @param oData string containing the label, or an object with a label property
1541 */
1542YAHOO.widget.TextNode.prototype.setUpLabel = function(oData) {
1543    if (typeof oData == "string") {
1544        oData = { label: oData };
1545    }
1546    this.label = oData.label;
1547   
1548    // update the link
1549    if (oData.href) {
1550        this.href = oData.href;
1551    }
1552
1553    // set the target
1554    if (oData.target) {
1555        this.target = oData.target;
1556    }
1557
1558    if (oData.style) {
1559        this.labelStyle = oData.style;
1560    }
1561
1562    this.labelElId = "ygtvlabelel" + this.index;
1563};
1564
1565/**
1566 * Returns the label element
1567 *
1568 * @return {object} the element
1569 */
1570YAHOO.widget.TextNode.prototype.getLabelEl = function() {
1571    return document.getElementById(this.labelElId);
1572};
1573
1574// overrides YAHOO.widget.Node
1575YAHOO.widget.TextNode.prototype.getNodeHtml = function() {
1576    var sb = [];
1577
1578    sb[sb.length] = '<table border="0" cellpadding="0" cellspacing="0">';
1579    sb[sb.length] = '<tr>';
1580   
1581    for (i=0;i<this.depth;++i) {
1582        // sb[sb.length] = '<td class="ygtvdepthcell">&#160;</td>';
1583        sb[sb.length] = '<td class="' + this.getDepthStyle(i) + '">&#160;</td>';
1584    }
1585
1586    var getNode = 'YAHOO.widget.TreeView.getNode(\'' +
1587                    this.tree.id + '\',' + this.index + ')';
1588
1589    sb[sb.length] = '<td';
1590    // sb[sb.length] = ' onselectstart="return false"';
1591    sb[sb.length] = ' id="' + this.getToggleElId() + '"';
1592    sb[sb.length] = ' class="' + this.getStyle() + '"';
1593    if (this.hasChildren(true)) {
1594        sb[sb.length] = ' onmouseover="this.className=';
1595        sb[sb.length] = getNode + '.getHoverStyle()"';
1596        sb[sb.length] = ' onmouseout="this.className=';
1597        sb[sb.length] = getNode + '.getStyle()"';
1598    }
1599    sb[sb.length] = ' onclick="javascript:' + this.getToggleLink() + '">';
1600
1601    /*
1602    sb[sb.length] = '<img id="' + this.getSpacerId() + '"';
1603    sb[sb.length] = ' alt=""';
1604    sb[sb.length] = ' tabindex=0';
1605    sb[sb.length] = ' src="' + this.spacerPath + '"';
1606    sb[sb.length] = ' title="' + this.getStateText() + '"';
1607    sb[sb.length] = ' class="ygtvspacer"';
1608    // sb[sb.length] = ' onkeypress="return ' + getNode + '".onKeyPress()"';
1609    sb[sb.length] = ' />';
1610    */
1611
1612    sb[sb.length] = '&#160;';
1613
1614    sb[sb.length] = '</td>';
1615    sb[sb.length] = '<td>';
1616    sb[sb.length] = '<a';
1617    sb[sb.length] = ' id="' + this.labelElId + '"';
1618    sb[sb.length] = ' class="' + this.labelStyle + '"';
1619    sb[sb.length] = ' href="' + this.href + '"';
1620    sb[sb.length] = ' target="' + this.target + '"';
1621    sb[sb.length] = ' onclick="return ' + getNode + '.onLabelClick(' + getNode +')"';
1622    if (this.hasChildren(true)) {
1623        sb[sb.length] = ' onmouseover="document.getElementById(\'';
1624        sb[sb.length] = this.getToggleElId() + '\').className=';
1625        sb[sb.length] = getNode + '.getHoverStyle()"';
1626        sb[sb.length] = ' onmouseout="document.getElementById(\'';
1627        sb[sb.length] = this.getToggleElId() + '\').className=';
1628        sb[sb.length] = getNode + '.getStyle()"';
1629    }
1630    sb[sb.length] = ' >';
1631    sb[sb.length] = this.label;
1632    sb[sb.length] = '</a>';
1633    sb[sb.length] = '</td>';
1634    sb[sb.length] = '</tr>';
1635    sb[sb.length] = '</table>';
1636
1637    return sb.join("");
1638};
1639
1640/**
1641 * Executed when the label is clicked
1642 * @param me {Node} this node
1643 * @scope the anchor tag clicked
1644 * @return false to cancel the anchor click
1645 */
1646YAHOO.widget.TextNode.prototype.onLabelClick = function(me) {
1647    //return true;
1648};
1649
1650YAHOO.widget.TextNode.prototype.toString = function() {
1651    return "TextNode (" + this.index + ") " + this.label;
1652};
1653
1654/**
1655 * A menu-specific implementation that differs from TextNode in that only
1656 * one sibling can be expanded at a time.
1657 * @extends YAHOO.widget.TextNode
1658 * @constructor
1659 */
1660YAHOO.widget.MenuNode = function(oData, oParent, expanded) {
1661    if (oData) {
1662        this.init(oData, oParent, expanded);
1663        this.setUpLabel(oData);
1664    }
1665
1666    /**
1667     * Menus usually allow only one branch to be open at a time.
1668     * @type boolean
1669     */
1670    this.multiExpand = false;
1671
1672    /**
1673     * @private
1674     */
1675
1676};
1677
1678YAHOO.widget.MenuNode.prototype = new YAHOO.widget.TextNode();
1679
1680YAHOO.widget.MenuNode.prototype.toString = function() {
1681    return "MenuNode (" + this.index + ") " + this.label;
1682};
1683
1684/**
1685 * This implementation takes either a string or object for the
1686 * oData argument.  If is it a string, we will use it for the display
1687 * of this node (and it can contain any html code).  If the parameter
1688 * is an object, we look for a parameter called "html" that will be
1689 * used for this node's display.
1690 *
1691 * @extends YAHOO.widget.Node
1692 * @constructor
1693 * @param oData {object} a string or object containing the data that will
1694 * be used to render this node
1695 * @param oParent {YAHOO.widget.Node} this node's parent node
1696 * @param expanded {boolean} the initial expanded/collapsed state
1697 * @param hasIcon {boolean} specifies whether or not leaf nodes should
1698 * have an icon
1699 */
1700YAHOO.widget.HTMLNode = function(oData, oParent, expanded, hasIcon) {
1701    if (oData) {
1702        this.init(oData, oParent, expanded);
1703        this.initContent(oData, hasIcon);
1704    }
1705};
1706
1707YAHOO.widget.HTMLNode.prototype = new YAHOO.widget.Node();
1708
1709/**
1710 * The CSS class for the html content container.  Defaults to ygtvhtml, but
1711 * can be overridden to provide a custom presentation for a specific node.
1712 *
1713 * @type string
1714 */
1715YAHOO.widget.HTMLNode.prototype.contentStyle = "ygtvhtml";
1716
1717/**
1718 * The generated id that will contain the data passed in by the implementer.
1719 *
1720 * @type string
1721 */
1722YAHOO.widget.HTMLNode.prototype.contentElId = null;
1723
1724/**
1725 * The HTML content to use for this node's display
1726 *
1727 * @type string
1728 */
1729YAHOO.widget.HTMLNode.prototype.content = null;
1730
1731/**
1732 * Sets up the node label
1733 *
1734 * @param {object} An html string or object containing an html property
1735 * @param {boolean} hasIcon determines if the node will be rendered with an
1736 * icon or not
1737 */
1738YAHOO.widget.HTMLNode.prototype.initContent = function(oData, hasIcon) {
1739    if (typeof oData == "string") {
1740        oData = { html: oData };
1741    }
1742
1743    this.html = oData.html;
1744    this.contentElId = "ygtvcontentel" + this.index;
1745    this.hasIcon = hasIcon;
1746
1747    /**
1748     * @private
1749     */
1750};
1751
1752/**
1753 * Returns the outer html element for this node's content
1754 *
1755 * @return {HTMLElement} the element
1756 */
1757YAHOO.widget.HTMLNode.prototype.getContentEl = function() {
1758    return document.getElementById(this.contentElId);
1759};
1760
1761// overrides YAHOO.widget.Node
1762YAHOO.widget.HTMLNode.prototype.getNodeHtml = function() {
1763    var sb = [];
1764
1765    sb[sb.length] = '<table border="0" cellpadding="0" cellspacing="0">';
1766    sb[sb.length] = '<tr>';
1767   
1768    for (i=0;i<this.depth;++i) {
1769        sb[sb.length] = '<td class="' + this.getDepthStyle(i) + '">&#160;</td>';
1770    }
1771
1772    if (this.hasIcon) {
1773        sb[sb.length] = '<td';
1774        sb[sb.length] = ' id="' + this.getToggleElId() + '"';
1775        sb[sb.length] = ' class="' + this.getStyle() + '"';
1776        sb[sb.length] = ' onclick="javascript:' + this.getToggleLink() + '"';
1777        if (this.hasChildren(true)) {
1778            sb[sb.length] = ' onmouseover="this.className=';
1779            sb[sb.length] = 'YAHOO.widget.TreeView.getNode(\'';
1780            sb[sb.length] = this.tree.id + '\',' + this.index +  ').getHoverStyle()"';
1781            sb[sb.length] = ' onmouseout="this.className=';
1782            sb[sb.length] = 'YAHOO.widget.TreeView.getNode(\'';
1783            sb[sb.length] = this.tree.id + '\',' + this.index +  ').getStyle()"';
1784        }
1785        sb[sb.length] = '>&#160;</td>';
1786    }
1787
1788    sb[sb.length] = '<td';
1789    sb[sb.length] = ' id="' + this.contentElId + '"';
1790    sb[sb.length] = ' class="' + this.contentStyle + '"';
1791    sb[sb.length] = ' >';
1792    sb[sb.length] = this.html;
1793    sb[sb.length] = '</td>';
1794    sb[sb.length] = '</tr>';
1795    sb[sb.length] = '</table>';
1796
1797    return sb.join("");
1798};
1799
1800YAHOO.widget.HTMLNode.prototype.toString = function() {
1801    return "HTMLNode (" + this.index + ")";
1802};
1803
1804/**
1805 * A static factory class for tree view expand/collapse animations
1806 *
1807 * @constructor
1808 */
1809YAHOO.widget.TVAnim = function() {
1810    return {
1811        /**
1812         * Constant for the fade in animation
1813         *
1814         * @type string
1815         */
1816        FADE_IN: "TVFadeIn",
1817
1818        /**
1819         * Constant for the fade out animation
1820         *
1821         * @type string
1822         */
1823        FADE_OUT: "TVFadeOut",
1824
1825        /**
1826         * Returns a ygAnim instance of the given type
1827         *
1828         * @param type {string} the type of animation
1829         * @param el {HTMLElement} the element to element (probably the children div)
1830         * @param callback {function} function to invoke when the animation is done.
1831         * @return {YAHOO.util.Animation} the animation instance
1832         */
1833        getAnim: function(type, el, callback) {
1834            if (YAHOO.widget[type]) {
1835                return new YAHOO.widget[type](el, callback);
1836            } else {
1837                return null;
1838            }
1839        },
1840
1841        /**
1842         * Returns true if the specified animation class is available
1843         *
1844         * @param type {string} the type of animation
1845         * @return {boolean} true if valid, false if not
1846         */
1847        isValid: function(type) {
1848            return (YAHOO.widget[type]);
1849        }
1850    };
1851} ();
1852
1853/**
1854 * A 1/2 second fade-in animation.
1855 *
1856 * @constructor
1857 * @param el {HTMLElement} the element to animate
1858 * @param callback {function} function to invoke when the animation is finished
1859 */
1860YAHOO.widget.TVFadeIn = function(el, callback) {
1861    /**
1862     * The element to animate
1863     * @type HTMLElement
1864     */
1865    this.el = el;
1866
1867    /**
1868     * the callback to invoke when the animation is complete
1869     *
1870     * @type function
1871     */
1872    this.callback = callback;
1873
1874    /**
1875     * @private
1876     */
1877};
1878
1879/**
1880 * Performs the animation
1881 */
1882YAHOO.widget.TVFadeIn.prototype = {
1883    animate: function() {
1884        var tvanim = this;
1885
1886        var s = this.el.style;
1887        s.opacity = 0.1;
1888        s.filter = "alpha(opacity=10)";
1889        s.display = "";
1890
1891        // var dur = ( navigator.userAgent.match(/msie/gi) ) ? 0.05 : 0.4;
1892        var dur = 0.4;
1893        // var a = new ygAnim_Fade(this.el, dur, 1);
1894        // a.setStart(0.1);
1895        // a.onComplete = function() { tvanim.onComplete(); };
1896
1897        // var a = new YAHOO.util.Anim(this.el, 'opacity', 0.1, 1);
1898        var a = new YAHOO.util.Anim(this.el, {opacity: {from: 0.1, to: 1, unit:""}}, dur);
1899        a.onComplete.subscribe( function() { tvanim.onComplete(); } );
1900        a.animate();
1901    },
1902
1903    /**
1904     * Clean up and invoke callback
1905     */
1906    onComplete: function() {
1907        this.callback();
1908    },
1909
1910    toString: function() {
1911        return "TVFadeIn";
1912    }
1913};
1914
1915/**
1916 * A 1/2 second fade out animation.
1917 *
1918 * @constructor
1919 * @param el {HTMLElement} the element to animate
1920 * @param callback {Function} function to invoke when the animation is finished
1921 */
1922YAHOO.widget.TVFadeOut = function(el, callback) {
1923    /**
1924     * The element to animate
1925     * @type HTMLElement
1926     */
1927    this.el = el;
1928
1929    /**
1930     * the callback to invoke when the animation is complete
1931     *
1932     * @type function
1933     */
1934    this.callback = callback;
1935
1936    /**
1937     * @private
1938     */
1939};
1940
1941/**
1942 * Performs the animation
1943 */
1944YAHOO.widget.TVFadeOut.prototype = {
1945    animate: function() {
1946        var tvanim = this;
1947        // var dur = ( navigator.userAgent.match(/msie/gi) ) ? 0.05 : 0.4;
1948        var dur = 0.4;
1949        // var a = new ygAnim_Fade(this.el, dur, 0.1);
1950        // a.onComplete = function() { tvanim.onComplete(); };
1951
1952        // var a = new YAHOO.util.Anim(this.el, 'opacity', 1, 0.1);
1953        var a = new YAHOO.util.Anim(this.el, {opacity: {from: 1, to: 0.1, unit:""}}, dur);
1954        a.onComplete.subscribe( function() { tvanim.onComplete(); } );
1955        a.animate();
1956    },
1957
1958    /**
1959     * Clean up and invoke callback
1960     */
1961    onComplete: function() {
1962        var s = this.el.style;
1963        s.display = "none";
1964        // s.opacity = 1;
1965        s.filter = "alpha(opacity=100)";
1966        this.callback();
1967    },
1968
1969    toString: function() {
1970        return "TVFadeOut";
1971    }
1972};
1973
Note: See TracBrowser for help on using the repository browser.