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

Drag and Drop Scrolling Inside a Container Div

Expand Messages
  • sweintraut
    I am trying to convert a system I wrote using scriptaculous over to yui scriptaculous was too slow when doing large drag and drop lists as everytime you want
    Message 1 of 8 , Oct 28, 2007
    • 0 Attachment
      I am trying to convert a system I wrote using scriptaculous over to yui

      scriptaculous was too slow when doing large drag and drop lists as everytime you want to
      update the list you have to destroy all the elements and recreate the sortable drag and drop
      list. On a list of 50 items, this was taking 4 to 5 seconds

      but now the problem I am having with YUI is I am unable to figure out how to get my
      container div to scroll if I drag a draggable element that is within it to the bottom of the
      container div

      do I have to write my own extension to the code or is there some ability/parameter I am
      missing?
    • dav.glass@yahoo.com
      sweintraut -- Currently there is no support in DragDrop for this. I have it on my internal list of enhancements, but if you wouldn t mind, please file a
      Message 2 of 8 , Oct 30, 2007
      • 0 Attachment
        sweintraut --

        Currently there is no support in DragDrop for this.

        I have it on my internal list of enhancements, but if you wouldn't mind, please file a feature request here so it can get on the list for a later release:
        http://developer.yahoo.com/yui/dragdrop/#filingbugs

        Thanks,
        Dav
         
        Dav Glass
        dav.glass@...
        blog.davglass.com
         
         
        + Windows: n. - The most successful computer virus, ever. +
        + A computer without a Microsoft operating system is like a dog
        without bricks tied to its head +
        + A Microsoft Certified Systems Engineer is to computing what a
        McDonalds Certified Food Specialist is to fine cuisine +


        ----- Original Message ----
        From: sweintraut <zacware@...>
        To: ydn-javascript@yahoogroups.com
        Sent: Sunday, October 28, 2007 1:35:15 AM
        Subject: [ydn-javascript] Drag and Drop Scrolling Inside a Container Div

        I am trying to convert a system I wrote using scriptaculous over to yui

        scriptaculous was too slow when doing large drag and drop lists as everytime you want to
        update the list you have to destroy all the elements and recreate the sortable drag and drop
        list. On a list of 50 items, this was taking 4 to 5 seconds

        but now the problem I am having with YUI is I am unable to figure out how to get my
        container div to scroll if I drag a draggable element that is within it to the bottom of the
        container div

        do I have to write my own extension to the code or is there some ability/parameter I am
        missing?







        Yahoo! Groups Links

        <*> To visit your group on the web, go to:
            http://groups.yahoo.com/group/ydn-javascript/

        <*> Your email settings:
            Individual Email | Traditional

        <*> To change settings online go to:
            http://groups.yahoo.com/group/ydn-javascript/join
            (Yahoo! ID required)

        <*> To change settings via email:
            mailto:ydn-javascript-digest@yahoogroups.com
            mailto:ydn-javascript-fullfeatured@yahoogroups.com

        <*> To unsubscribe from this group, send an email to:
            ydn-javascript-unsubscribe@yahoogroups.com

        <*> Your use of Yahoo! Groups is subject to:
            http://docs.yahoo.com/info/terms/


      • dav.glass@yahoo.com
        sweintraut -- I took a look at this issue :) Here is a simple prototype that I built: http://blog.davglass.com/files/yui/dd15/ Hope that gets you moving in the
        Message 3 of 8 , Oct 31, 2007
        • 0 Attachment
          sweintraut --

          I took a look at this issue :)

          Here is a simple prototype that I built:
          http://blog.davglass.com/files/yui/dd15/
           
          Hope that gets you moving in the right direction..
          Dav

          Dav Glass
          dav.glass@...
          blog.davglass.com
           
           
          + Windows: n. - The most successful computer virus, ever. +
          + A computer without a Microsoft operating system is like a dog
          without bricks tied to its head +
          + A Microsoft Certified Systems Engineer is to computing what a
          McDonalds Certified Food Specialist is to fine cuisine +


          ----- Original Message ----
          From: sweintraut <zacware@...>
          To: ydn-javascript@yahoogroups.com
          Sent: Sunday, October 28, 2007 1:35:15 AM
          Subject: [ydn-javascript] Drag and Drop Scrolling Inside a Container Div

          I am trying to convert a system I wrote using scriptaculous over to yui

          scriptaculous was too slow when doing large drag and drop lists as everytime you want to
          update the list you have to destroy all the elements and recreate the sortable drag and drop
          list. On a list of 50 items, this was taking 4 to 5 seconds

          but now the problem I am having with YUI is I am unable to figure out how to get my
          container div to scroll if I drag a draggable element that is within it to the bottom of the
          container div

          do I have to write my own extension to the code or is there some ability/parameter I am
          missing?







          Yahoo! Groups Links

          <*> To visit your group on the web, go to:
              http://groups.yahoo.com/group/ydn-javascript/

          <*> Your email settings:
              Individual Email | Traditional

          <*> To change settings online go to:
              http://groups.yahoo.com/group/ydn-javascript/join
              (Yahoo! ID required)

          <*> To change settings via email:
              mailto:ydn-javascript-digest@yahoogroups.com
              mailto:ydn-javascript-fullfeatured@yahoogroups.com

          <*> To unsubscribe from this group, send an email to:
              ydn-javascript-unsubscribe@yahoogroups.com

          <*> Your use of Yahoo! Groups is subject to:
              http://docs.yahoo.com/info/terms/


        • tonyorlando
          Cool. By the way, there are interesting problems if you try to have one dragdrop scrolling list above or below another (in every browser I could find). It took
          Message 4 of 8 , Oct 31, 2007
          • 0 Attachment
            Cool.

            By the way, there are interesting problems if you try to have one
            dragdrop scrolling list above or below another (in every browser I
            could find). It took me two days to get through all the issues. A lot
            of that was figuring out the dragdrop source.

            The problem is this: you can't see the dragdrop targets when they
            scroll out of the container, but they are there to jump into the way
            when you do the drop, at least if you start with the naive case of
            starting from the sortable list example.

            If you want to see the issue, put one list above the other, make sure
            they both have enough elements to cause scrolling, then try to drag
            and drop between the two lists.
          • tonyorlando
            Sorry for the back-to-back posts. I just read my post and realized I was vague. ... http://developer.yahoo.com/yui/examples/dragdrop/dd-reorder.html ...is the
            Message 5 of 8 , Oct 31, 2007
            • 0 Attachment
              Sorry for the back-to-back posts. I just read my post and realized I
              was vague.

              ---

              http://developer.yahoo.com/yui/examples/dragdrop/dd-reorder.html

              ...is the example I was referring to. If you stack the lists
              vertically (rather than horizontally), add a bunch of <li> elements,
              and make the lists scroll, you get badness as the <li>'s are targets
              even when they aren't visible.
            • dav.glass@yahoo.com
              tonyorlando -- I haven t tried this, but you need to listen to the scroll event on the container and the call: YAHOO.util.DragDropMgr.refreshCache(); DragDrop
              Message 6 of 8 , Oct 31, 2007
              • 0 Attachment
                tonyorlando --

                I haven't tried this, but you need to listen to the scroll event on the container and the call:
                YAHOO.util.DragDropMgr.refreshCache();

                DragDrop needs to refresh it's built in position cache of the li's when the parent is scrolled..

                Hope that helps :)
                Dav
                 
                Dav Glass
                dav.glass@...
                blog.davglass.com
                 
                 
                + Windows: n. - The most successful computer virus, ever. +
                + A computer without a Microsoft operating system is like a dog
                without bricks tied to its head +
                + A Microsoft Certified Systems Engineer is to computing what a
                McDonalds Certified Food Specialist is to fine cuisine +


                ----- Original Message ----
                From: tonyorlando <rhettanderson@...>
                To: ydn-javascript@yahoogroups.com
                Sent: Wednesday, October 31, 2007 2:57:07 PM
                Subject: [ydn-javascript] Re: Drag and Drop Scrolling Inside a Container Div

                Sorry for the back-to-back posts. I just read my post and realized I
                was vague.

                ---

                http://developer.yahoo.com/yui/examples/dragdrop/dd-reorder.html

                ...is the example I was referring to. If you stack the lists
                vertically (rather than horizontally), add a bunch of <li> elements,
                and make the lists scroll, you get badness as the <li>'s are targets
                even when they aren't visible.




                Yahoo! Groups Links

                <*> To visit your group on the web, go to:
                    http://groups.yahoo.com/group/ydn-javascript/

                <*> Your email settings:
                    Individual Email | Traditional

                <*> To change settings online go to:
                    http://groups.yahoo.com/group/ydn-javascript/join
                    (Yahoo! ID required)

                <*> To change settings via email:
                    mailto:ydn-javascript-digest@yahoogroups.com
                    mailto:ydn-javascript-fullfeatured@yahoogroups.com

                <*> To unsubscribe from this group, send an email to:
                    ydn-javascript-unsubscribe@yahoogroups.com

                <*> Your use of Yahoo! Groups is subject to:
                    http://docs.yahoo.com/info/terms/


              • tonyorlando
                ... when the parent is scrolled.. ... I solved it a bit differently. First, I had to make sure that the mouse pointer was in the that the belongs to.
                Message 7 of 8 , Oct 31, 2007
                • 0 Attachment
                  --- In ydn-javascript@yahoogroups.com, dav.glass@... wrote:
                  >
                  > tonyorlando --
                  >
                  > I haven't tried this, but you need to listen to the scroll event on
                  the container and the call:
                  > YAHOO.util.DragDropMgr.refreshCache();
                  >
                  > DragDrop needs to refresh it's built in position cache of the li's
                  when the parent is scrolled..
                  >
                  > Hope that helps :)
                  > Dav


                  I solved it a bit differently.

                  First, I had to make sure that the mouse pointer was in the <ul> that
                  the <li> belongs to.

                  Also, in the case I mentioned, you could get up to three targets when
                  you dropped. I looked at each possibility and handled it. It didn't
                  turn out to be too bad. Well, tracking down all the problems was a
                  pain, but in the end I didn't need too many lines of code to solve the
                  problems.

                  Your solution may be more efficient than mine. I'm not sure. I may try it.

                  Thanks for thinking about it.
                • sweintraut
                  Wow! That s Fabulous! Thank you so much!
                  Message 8 of 8 , Nov 16, 2007
                  • 0 Attachment
                    Wow! That's Fabulous! Thank you so much!

                    --- In ydn-javascript@yahoogroups.com, dav.glass@... wrote:
                    >
                    > sweintraut --
                    >
                    > I took a look at this issue :)
                    >
                    > Here is a simple prototype that I built:
                    > http://blog.davglass.com/files/yui/dd15/
                    >
                    > Hope that gets you moving in the right direction..
                    > Dav
                    >
                    >
                    > Dav Glass
                    > dav.glass@...
                    > blog.davglass.com
                    >
                  Your message has been successfully submitted and would be delivered to recipients shortly.