Sortable + Draggable : doesn't follow the mouse horizontally

[Alain Ravet <arav2132 (at) biz.tiscali.be>]

Robin

    > Yes, use the constraints options of Sortable.create

When I do that (see below) the list is no longer sortable : when I drop 
an element, it goes back to its original location, and the  associated 
actin is not triggered.

(Complete view code is at the bottom of this message. I placed 2 markers 
: *** DRAGABLE and *** SORTABLE)
(Note: What I try to achieve: combine the cart demo and the sort demo.
In other works, make a list, in Rails, that's
  1/- sortable : to ... sort the elements
  2/- dragable: to drag elements to a bin area (like in the cart demo)
  3/- dragged element follows the mouse, vertically and horizontally

  - 1/ and 2/ , work fine, but not 3/ (you can only drag them 
vertically to the bin area).
)


I followed the advice and added
    :constraint => nil

=> code is now:
    <%= sortable_element('sortable_list', :update => 'lists', :url => 
{:action => :update_positions},	
          :constraint => nil) %>

==> sort is broken:
clearing the constraint in the sortable
    - fixes the vertical constraint problem in the dragging,
BUT
    -  breaks the sort on the list: when I drop an element to its  new 
location, it doesn't stay in this new location (goes back to its old 
location).




  :constraint => :none
      ok:1/+2/,
      not ok: 3/ (constraint still vertical)
      not ok: no more ghosting when sorting.

  :constraint => nil
      ok: 2/+3/: drag ok (no constraint, ghosting, action is triggered
      not ok : 1/ is broken (cannot sort, because element goes back to 
original location when it is dropped.)






Code:


<h1>Mes listes</h1>

<table width="60%" style="margin:0 auto;border: 1px solid black">
	<tr>
		<td>
			<div id="lists">
				<ul id="sortable_list">
					<% for list in  (at) lists
					all_items_done = (list.nof_open_items == list.list_items.size)
					klass = all_items_done ? "closed_list" : "open_list"
					-%>
					<li id="item_<%= list.id %>"class="one_list <%= klass %>">

						<%= list.title %>
						<!-- 	< %= link_to h(list.title), :action => 'show', :id => list 
%>  -->
						(<%= list.position %>)
						<small class="xsmall gray"><%= list.nof_open_items -%>/<%= 
list.list_items.size -%></small>
					</li>
*** DRAGABLE HERE ***
					<script type="text/javascript" language="javascript">
						new Draggable("item_<%= list.id %>",{revert:true});
					</script>

					<% end %>
				</ul>

			</div>

		</td>
		<td>
			<%= link_to 'Créer', {:action => 'new' }, :class => 'action_on_lists'%>
			<span class="action_on_lists_details"> une nouvelle liste</span>

		</td></tr></table>
		<div id="wastebin">
			<%= image_tag 'poubelle.gif' %>
		</div>
		<hr>

*** SORTABLE HERE (only the 1st one works/sorts) ***
<!-- 		< %= sortable_element 'sortable_list', :url => {:action => 
:update_positions}  -%> -->
		<%= sortable_element 'sortable_list', :url => {:action => 
:update_positions}, :constraint => 'none'  -%>


		<%= drop_receiving_element "wastebin",
		:update => "items",
		:url => { :action => "remove_list" },
		:accept => "one_list",
		:hoverclass => "wastebin-active",
		:before => "Element.hide(element)",
		:loading => "Element.show('spinner')",
		:complete => "Element.hide('spinner')" %>


		<div style="height:40px;padding-top:10px;">
			<p id="indicator" style="display:none;margin-top:0px;">
				<%= image_tag "spinner.gif" %> Updating cart...
			</p>
		</div>

_______________________________________________
Rails-spinoffs mailing list
Rails-spinoffs (at) lists.rubyonrails.org
http://lists.rubyonrails.org/mailman/listinfo/rails-spinoffs