Reordering lists with drag n' drop

Josh Mellicker josh at dvcreators.net
Mon Jun 19 14:34:21 EDT 2006


Here is a script I wrote for drag and drop buttons. I wrote it a few  
months ago when I was just starting out, so there may be some bad  
coding conventions!

It creates a group of buttons from a data field, and colors them  
gradually from green to blue (!)

Then, the user can drag them wherever, and the stack will redraw neatly.

Let me know if you want more clarification:


ON calcTops
     --this assumes the data field is sorted, it assigns tops to each  
item
     put fld "allUserProjectsandPriorities" of cd "data" of stack  
"data" of stack "greenbongo" into allUserProjectsandPriorities
     REPEAT with x = 1 to the number of lines of  
allUserProjectsandPriorities
         put 110+x*30 into item 4 of line x of  
allUserProjectsandPriorities
     END REPEAT
     put allUserProjectsandPriorities into fld  
"allUserProjectsandPriorities" of cd "data" of stack "data" of stack  
"greenbongo"
END calcTops

ON drawPriorityBoxes
     -- simply redraws the boxes with the tops indicated in the data fld
     put fld "allUserProjectsandPriorities" of cd "data" of stack  
"data" of stack "greenbongo" into pp
     IF exists(grp "projects") THEN
         delete grp "projects"
     END IF
     create grp "projects"
     REPEAT with x = 1 to the number of lines of pp
         create btn in grp "projects"
         set the name of it to item 1 of line x of pp
         set the projectID of it to item 2 of line x of pp
         set the style of it to "opaque"
         put the round of (230-50/the number of lines in pp * x) into c
         set the backgroundColor of it to 100,c,2200-c*4
         set the hiliteColor of it to 100,c,220
         set the showIcon of it to false
         set the showName of it to true
         set the height of it to 24
         set the width of it to 200
         set the topLeft of it to 70,item 4 of line x of pp
         set the script of it to "ON mouseDown" & cr & "grab the  
target" & cr & "END mouseDown" & cr & cr & "ON mouseUp" & cr &  
"spaceNeat" & cr & "END mouseUp"

     END REPEAT
     put pp into fld "allUserProjectsandPriorities" of cd "data" of  
stack "data" of stack "greenbongo"
END drawPriorityBoxes


ON redrawPriorityBoxes
     -- simply repositions the boxes with the tops indicated in the  
data fld
     put fld "allUserProjectsandPriorities" of cd "data" of stack  
"data" of stack "greenbongo" into allUserProjectsandPriorities
     REPEAT for each line tLine in allUserProjectsandPriorities
         set the top of btn (item 1 of tLine) to item 4 of tLine
     END REPEAT
END redrawPriorityBoxes

ON spaceNeat
     set the left of the target to 70
     put fld "allUserProjectsandPriorities" of cd "data" of stack  
"data" of stack "greenbongo" into allUserProjectsandPriorities
     put lineOffset(the short name of the target,  
allUserProjectsandPriorities) into tLine
     put the top of the target into item 4 of line tLine of  
allUserProjectsandPriorities
     sort lines of allUserProjectsandPriorities by item 4 of each
     put allUserProjectsandPriorities into fld  
"allUserProjectsandPriorities" of cd "data" of stack "data" of stack  
"greenbongo"
     calcTops
     redrawPriorityBoxes
END spaceNeat


On Jun 15, 2006, at 9:55 PM, Jared Smith wrote:

> I'm wondering what the easiest way is to implement this feature. I
> have a normal list field with items that I'd like to be able to click
> and drag up or down.
>
> I'm contemplating using mouseDown to grab them and, upon mouseUp,
> measure which line it is closest to and move it. I'd also need to come
> up with some animation effect to show the user where it'll go before
> they release. I wish this functionality was included, but anyway if
> anyone can think of a real easy way to do it, please let me know.
> _______________________________________________
> use-revolution mailing list
> use-revolution at lists.runrev.com
> Please visit this url to subscribe, unsubscribe and manage your  
> subscription preferences:
> http://lists.runrev.com/mailman/listinfo/use-revolution




More information about the use-livecode mailing list