Loading ...
Sorry, an error occurred while loading the content.

Re: how to make leaf nodes with TreeView.setDynamicLoad()

Expand Messages
  • coryrauch
    Hi, I have exactly the same issue with dynamic loading tree that displays [+] when there is no children. I was not able to get the desired affect by altering
    Message 1 of 10 , Feb 15, 2006
    View Source
    • 0 Attachment
      Hi,

      I have exactly the same issue with dynamic loading tree that displays
      [+] when there is no children. I was not able to get the desired
      affect by altering node.js, taking this.isDynamic(), out of the
      equation of getStyle. It seems also that the hasChildren function also
      takes in to consideration if the tree is dynamic and alot of function
      base there behavior on that function. So I tried the other method
      suggested of doing a dynamic load at the node level and that works
      very well. I figured I would share a code example. The only thing with
      this is you have to code in additional logic on you backend code to
      determine when to allow expanding or not. Example below:

      // Set up the tree
      var tree;
      tree = new YAHOO.widget.TreeView("treecontainer");
      var root = tree.getRoot();

      // Start adding nodes
      var treeOptions = new Array();

      // Our first node will be expandable
      var data = { id: "node1", label: "One" }
      data = new YAHOO.widget.TextNode(data, root, false);

      /* Since its expandable we add the DynamicLoad handler on. This
      *function should work just as a tree dynamic load handler.
      */
      data.setDynamicLoad(treeLoadData);
      treeOptions.push(data);

      // Our second node is not expandable
      var data = { id: "node2", label: "Two" }
      data = new YAHOO.widget.TextNode(data, root, false);
      // No dynamic load handler added.
      treeOptions.push(data);
      tree.draw();

      Hopefully this helps. This is a great widget, and thank Yahoo for
      providing it.

      Best Regards,

      Cory Rauch
      cory@...
      www.sysbotz.com

      --- In ydn-javascript@yahoogroups.com, Eric Miraglia <miraglia@...> wrote:
      >
      > Greg,
      >
      > A TextNode with no children, one on which you haven't invoked
      > setDynamicLoad, won't display the [+]. Once a TextNode is set to
      > load dynamically, the expand icon does persist (even when the node
      > turns out to be childless). This was actually an interaction design
      > decision -- this solution either tested better or seemed more
      > intuitive to the designers.
      >
      > It appears that you can change the behavior pretty easily by
      > subclassing whichever node class you're using and then overriding the
      > getStyle method in that subclass. Look at the getStyle method in
      > Node.js for a baseline; start with that method:
      >
      > getStyle: function() {
      > if (this.isLoading) {
      > this.logger.debug("returning the loading icon");
      > return "ygtvloading";
      > } else {
      > // location top or bottom, middle nodes also get the top
      > style
      > var loc = (this.nextSibling) ? "t" : "l";
      >
      > // type p=plus(expand), m=minus(collapase), n=none(no
      > children)
      > var type = "n";
      > if (this.hasChildren(true) || this.isDynamic()) {
      > type = (this.expanded) ? "m" : "p";
      > }
      >
      > this.logger.debug("ygtv" + loc + type);
      > return "ygtv" + loc + type;
      > }
      > }
      >
      > Check out the line that reads if (this.hasChildren(true) ||
      > this.isDynamic()) {; remove the conditional on this.isDynamic(), so
      > that it evaluates only based on hasChildren(). That should get you
      > the result you're looking for, if I understand your needs correctly.
      >
      > Good luck...let us know how it goes.
      >
      > Eric
      >
      >
      >
      >
      > On Feb 14, 2006, at 4:48 PM, ggederer wrote:
      >
      > > Eric,
      > >
      > > Thanks for the response. The workaround you suggest is pretty good
      > > except that empty nodes that can have children (like empty folders in
      > > a file browser) render as if they, in fact, had children (little plus
      > > sign next to the folder.)
      > >
      > > Just glancing at the sources, it looks like it would be fairly easy to
      > > implement something like setCanHaveChildren(). Is this the approach
      > > you are considering? I may just do this or something similar for my
      > > own needs. If I do, I would be happy to send you the diffs.
      > >
      > > I like your library.
      > >
      > > Cheers,
      > >
      > > Greg
      > >
      > > --- In ydn-javascript@yahoogroups.com, Eric Miraglia <miraglia@>
      > > wrote:
      > >>
      > >> Greg,
      > >>
      > >> There's no way currently to indicate that a specific child has no
      > >> children of its own. This is something we see a need for, but we
      > >> don't have it yet.
      > >>
      > >> One workaround for this is to use the setDynamicLoad method at the
      > >> node level rather than at the tree level. Invoke that method for all
      > >> nodes that either have or might have children; for those you know
      > >> won't have children, just skip that step.
      > >>
      > >> That will result in the behavior you're looking for, I think.
      > >>
      > >> Regards,
      > >> Eric
      > >>
      > >>
      > >> On Feb 14, 2006, at 2:35 PM, ggederer wrote:
      > >>
      > >>> Hi,
      > >>>
      > >>> I have got a dynamically loding tree working; but, all of the
      > >>> dynamically loaded nodes are expandable. How do I indicate that a
      > >>> dynamically loaded node has no children?
      > >>>
      > >>> Great library!
      > >>>
      > >>> Cheers,
      > >>>
      > >>> Greg
      > >>>
      > >>>
      > >>>
      > >>>
      > >>>
      > >>>
      > >>>
      > >>> Yahoo! Groups Links
      > >>>
      > >>>
      > >>>
      > >>>
      > >>>
      > >>>
      > >>>
      > >>
      > >
      > >
      > >
      > >
      > >
      > >
      > > Yahoo! Groups Links
      > >
      > >
      > >
      > >
      > >
      > >
      > >
      > >
      >
    • ggederer
      Hi Cory, Thanks for the response. I think this is going to be a great community. After looking at Eric s suggestion, I ve decided that what I really need is a
      Message 2 of 10 , Feb 15, 2006
      View Source
      • 0 Attachment
        Hi Cory,

        Thanks for the response.  I think this is going to be a great community.

        After looking at Eric's suggestion, I've decided that what I really need is a specialized RemoteFileNode type with an isDirectory() method and a hasRemoteChildren() method.  Looking at Node.getStyle() . . .

            /**
             * Returns the css style name for the toggle
             *
             * @return {string} the css class for this node's toggle
             */
            getStyle: function() {
                if (this.isLoading) {
                    this.logger.debug("returning the loading icon");
                    return "ygtvloading";
                } else {
                    // location top or bottom, middle nodes also get the top style
                    var loc = (this.nextSibling) ? "t" : "l";

                    // type p=plus(expand), m=minus(collapase), n=none(no children)
                    var type = "n";
                    if (this.hasChildren(true) || this.isDynamic()) {
                        type = (this.expanded) ? "m" : "p";
                    }

                    this.logger.debug("ygtv" + loc + type);
                    return "ygtv" + loc + type;
                }
            },


        I see that my only choices are a parent that has children (which may either be expanded or collapsed), or a leaf node.  What I need is a parent node that doesn't have children, but can have children; and a parent node that has children, even though they're not loaded from the server yet.

        In order to achieve this, I'll have to create couple of new tokens (in addition to "p", "m" and "n", above), and I'll have to produce some code to interpret the new tokens (not sure where I do that yet.)

        I think this approach makes sense, and that a remote asset browser is a common enough use case to warrant this work.  Comments?

        Cheers,

        Greg

        --- In ydn-javascript@yahoogroups.com, "coryrauch" <coryrauch@...> wrote:
        >
        > Hi,
        >
        > I have exactly the same issue with dynamic loading tree that displays
        > [+] when there is no children. I was not able to get the desired
        > affect by altering node.js, taking this.isDynamic(), out of the
        > equation of getStyle. It seems also that the hasChildren function also
        > takes in to consideration if the tree is dynamic and alot of function
        > base there behavior on that function. So I tried the other method
        > suggested of doing a dynamic load at the node level and that works
        > very well. I figured I would share a code example. The only thing with
        > this is you have to code in additional logic on you backend code to
        > determine when to allow expanding or not. Example below:
        >
        > // Set up the tree
        > var tree;
        > tree = new YAHOO.widget.TreeView("treecontainer");
        > var root = tree.getRoot();
        >
        > // Start adding nodes
        > var treeOptions = new Array();
        >
        > // Our first node will be expandable
        > var data = { id: "node1", label: "One" }
        > data = new YAHOO.widget.TextNode(data, root, false);
        >
        > /* Since its expandable we add the DynamicLoad handler on. This
        > *function should work just as a tree dynamic load handler.
        > */
        > data.setDynamicLoad(treeLoadData);
        > treeOptions.push(data);
        >
        > // Our second node is not expandable
        > var data = { id: "node2", label: "Two" }
        > data = new YAHOO.widget.TextNode(data, root, false);
        > // No dynamic load handler added.
        > treeOptions.push(data);
        > tree.draw();
        >
        > Hopefully this helps. This is a great widget, and thank Yahoo for
        > providing it.
        >
        > Best Regards,
        >
        > Cory Rauch
        > cory@...
        > www.sysbotz.com
        >
        > --- In ydn-javascript@yahoogroups.com, Eric Miraglia miraglia@ wrote:
        > >
        > > Greg,
        > >
        > > A TextNode with no children, one on which you haven't invoked
        > > setDynamicLoad, won't display the [+]. Once a TextNode is set to
        > > load dynamically, the expand icon does persist (even when the node
        > > turns out to be childless). This was actually an interaction design
        > > decision -- this solution either tested better or seemed more
        > > intuitive to the designers.
        > >
        > > It appears that you can change the behavior pretty easily by
        > > subclassing whichever node class you're using and then overriding the
        > > getStyle method in that subclass. Look at the getStyle method in
        > > Node.js for a baseline; start with that method:
        > >
        > > getStyle: function() {
        > > if (this.isLoading) {
        > > this.logger.debug("returning the loading icon");
        > > return "ygtvloading";
        > > } else {
        > > // location top or bottom, middle nodes also get the top
        > > style
        > > var loc = (this.nextSibling) ? "t" : "l";
        > >
        > > // type p=plus(expand), m=minus(collapase), n=none(no
        > > children)
        > > var type = "n";
        > > if (this.hasChildren(true) || this.isDynamic()) {
        > > type = (this.expanded) ? "m" : "p";
        > > }
        > >
        > > this.logger.debug("ygtv" + loc + type);
        > > return "ygtv" + loc + type;
        > > }
        > > }
        > >
        > > Check out the line that reads if (this.hasChildren(true) ||
        > > this.isDynamic()) {; remove the conditional on this.isDynamic(), so
        > > that it evaluates only based on hasChildren(). That should get you
        > > the result you're looking for, if I understand your needs correctly.
        > >
        > > Good luck...let us know how it goes.
        > >
        > > Eric
        > >
        > >
        > >
        > >
        > > On Feb 14, 2006, at 4:48 PM, ggederer wrote:
        > >
        > > > Eric,
        > > >
        > > > Thanks for the response. The workaround you suggest is pretty good
        > > > except that empty nodes that can have children (like empty folders in
        > > > a file browser) render as if they, in fact, had children (little plus
        > > > sign next to the folder.)
        > > >
        > > > Just glancing at the sources, it looks like it would be fairly easy to
        > > > implement something like setCanHaveChildren(). Is this the approach
        > > > you are considering? I may just do this or something similar for my
        > > > own needs. If I do, I would be happy to send you the diffs.
        > > >
        > > > I like your library.
        > > >
        > > > Cheers,
        > > >
        > > > Greg
        > > >
        > > > --- In ydn-javascript@yahoogroups.com, Eric Miraglia <miraglia@>
        > > > wrote:
        > > >>
        > > >> Greg,
        > > >>
        > > >> There's no way currently to indicate that a specific child has no
        > > >> children of its own. This is something we see a need for, but we
        > > >> don't have it yet.
        > > >>
        > > >> One workaround for this is to use the setDynamicLoad method at the
        > > >> node level rather than at the tree level. Invoke that method for all
        > > >> nodes that either have or might have children; for those you know
        > > >> won't have children, just skip that step.
        > > >>
        > > >> That will result in the behavior you're looking for, I think.
        > > >>
        > > >> Regards,
        > > >> Eric
        > > >>
        > > >>
        > > >> On Feb 14, 2006, at 2:35 PM, ggederer wrote:
        > > >>
        > > >>> Hi,
        > > >>>
        > > >>> I have got a dynamically loding tree working; but, all of the
        > > >>> dynamically loaded nodes are expandable. How do I indicate that a
        > > >>> dynamically loaded node has no children?
        > > >>>
        > > >>> Great library!
        > > >>>
        > > >>> Cheers,
        > > >>>
        > > >>> Greg
        > > >>>
        > > >>>
        > > >>>
        > > >>>
        > > >>>
        > > >>>
        > > >>>
        > > >>> Yahoo! Groups Links
        > > >>>
        > > >>>
        > > >>>
        > > >>>
        > > >>>
        > > >>>
        > > >>>
        > > >>
        > > >
        > > >
        > > >
        > > >
        > > >
        > > >
        > > > Yahoo! Groups Links
        > > >
        > > >
        > > >
        > > >
        > > >
        > > >
        > > >
        > > >
        > >
        >
      • mpechner
        Set dynamic load on each treenode that should expand instead of the tree. The treenodes without the dynamic load method set will be leafs.
        Message 3 of 10 , Feb 15, 2006
        View Source
        • 0 Attachment
          Set dynamic load on each treenode that should expand instead of the tree.

          The treenodes without the dynamic load method set will be leafs.

          --- In ydn-javascript@yahoogroups.com, "ggederer" <ggederer@...> wrote:
          >
          > Hi,
          >
          > I have got a dynamically loding tree working; but, all of the
          > dynamically loaded nodes are expandable. How do I indicate that a
          > dynamically loaded node has no children?
          >
          > Great library!
          >
          > Cheers,
          >
          > Gre
        • Chun
          Greg, I had the same problem a week ago. But I soon replied to my original post with a solution. (http://groups.yahoo.com/group/ydn-javascript/message/837) If
          Message 4 of 10 , Apr 10 1:45 PM
          View Source
          • 0 Attachment
            Greg,

            I had the same problem a week ago. But I soon replied to my original
            post with a solution.
            (http://groups.yahoo.com/group/ydn-javascript/message/837) If you set
            the whole tree to be dynamically loaded, you won't be able to turn it
            off on any of its nodes. Instead, you don't set it on the top level,
            but only set it on nodes that are expandable.

            Chun
            p.s. Thanks to David who also replied to my post with a similar solution.

            --- In ydn-javascript@yahoogroups.com, "ggederer" <ggederer@...> wrote:
            >
            > Hi,
            >
            > I have got a dynamically loding tree working; but, all of the
            > dynamically loaded nodes are expandable. How do I indicate that a
            > dynamically loaded node has no children?
            >
            > Great library!
            >
            > Cheers,
            >
            > Greg
            >
          Your message has been successfully submitted and would be delivered to recipients shortly.