[thelist] JS drag-drop script

[Ken Snyder]

Rick den Haan wrote:
> ...
>
> The four columns are TDs. The inner blocks are DIVs. There are always 4 TDs,
> but the number of DIVs varies. There can even be empty columns.
>
> I need to be able to sort the DIVs through Drag & Drop. When I start
> dragging a particular DIV, it should create a clone that moves with the
> cursor, and both the original and the clone should become semi-transparent.
> When I move it near a droppable location (vertically in between two other
> DIVs, or at the top or bottom of any TD), an indicator should be positioned
> there (can be an opaque square for the time being) of the exact size of the
> DIV that is being dragged. Dropping the DIV should snap it into its new
> position, or back to its old position.
>
> These DIVs are all the same width, but the height is different. Also, I need
> to be able to exclude certain DIVs from being moved. For example, if I set
> the first DIV in the first TD to be non-movable, I shouldn't be able to drag
> it, nor should I be able to position another DIV above it.
>
> ...
>   
This can be done using the scriptaculous drag and drop with its built-in 
options.  (see 
http://wiki.script.aculo.us/scriptaculous/show/Sortable.create and 
http://wiki.script.aculo.us/scriptaculous/show/GhostlySortableDemo)

Sortable.create('td_id', {
  ghosting: true, // the "clone" that moves with the cursor
  only: 'draggable', // excludes divs without the css class "draggable"
  hoverclass: 'indicator' // allows you to specify what the "opaque 
square" indicator looks like (a css class name)
});

I didn't see you mention anything about dragging divs between tds, but 
that can be done by passing an array of the other td ids to the 
"containment" option. (Demo 
http://wiki.script.aculo.us/scriptaculous/show/SortableListsDemo)

Scriptaculous has a large and active community of folks who would love 
to help you tweak it to work exactly as you need.  Their mailing list is 
"Ruby on Rails: Spinoffs" 
(http://groups.google.com/group/rubyonrails-spinoffs)

--Ken Snyder