# view
<div style="margin-bottom:20px;height:120px;">
<% for product in @products %>
  <%= image_tag "/images/products/product#{product.id}",
        :id => "product_#{product.id}",
        :alt => product.title, 
        :class => "products"  %>
  <%= draggable_element "product_#{product.id}", :revert => true %>
<% end %>
</div>

<h2>Your cart:</h2>

<div id="cart" class="cart" style="clear:left; height:132px;margin-top:10px;">
  <div id="wastebin">
    Drop items here to remove them from the cart.
  </div>
  <div id="items">
    <%= render :partial => "cart" %>
  </div>
  <div style="clear:both;"></div>
</div>

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

<%= drop_receiving_element "cart", 
      :update => "items", :url => { :action => "add" },
      :accept => "products", :hoverclass => "cart-active",
      :loading => "Element.show('indicator')",
      :complete => "Element.hide('indicator')" %>
      
<%= drop_receiving_element "wastebin", 
      :update => "items", :url => { :action => "remove" },
      :accept => "cart-items", :hoverclass => "wastebin-active",
      :before => "Element.hide(element)",
      :loading => "Element.show('indicator')",
      :complete => "Element.hide('indicator')" %>
    
# controller
class ShopController < ApplicationController
  
  def index
    session[:cart] ||= {}
    @products = Product.find(:all)
  end
  
  def add
    product_id = params[:id].split("_")[1]
    
    session[:cart][product_id] = 
      session[:cart].include?(product_id) ?  
      session[:cart][product_id]+1 : 1
  
    render :partial => 'cart'
  end
  
  def remove
    product_id = params[:id].split("_")[1]
    
    if session[:cart][product_id] > 1 
      session[:cart][product_id] = session[:cart][product_id]-1
    else
      session[:cart].delete(product_id)
    end
    
    render :partial => 'cart'
  end
  
end


# _cart.rhtml partial
<% session[:cart].each do |product,quantity| %>
<div>
  <% quantity.times do |i| %>
    <%= image_tag "/images/products/product#{product}", 
          :class => "cart-items", 
          :id => "item_#{product}_#{i}", 
          :style => "position:relative;" %>
    <%= draggable_element "item_#{product}_#{i}", :revert => true %>
  <% end %>
  <span class="title">
    <%= Product.find(product).title + " (#{quantity})" %>
  </span>
</div>
<% end %>
<%= "Here's your shopping cart." if session[:cart].empty? %>

#----------------------------
# Table structure for items_ite
#----------------------------
CREATE TABLE `items_ite` (
  `id_ite` int(11) NOT NULL auto_increment,
  `id_pro` int(11) default NULL,
  `session_ite` varchar(50) default NULL,
  `date_ite` timestamp NULL default NULL on update CURRENT_TIMESTAMP,
  PRIMARY KEY  (`id_ite`)
) ENGINE=MyISAM DEFAULT CHARSET=latin1;
#----------------------------
# Records for table items_ite
#----------------------------


insert  into items_ite values 
(112, 3, 'eeba099ff25719e60d7224077ca61184', null), 
(113, 2, 'eeba099ff25719e60d7224077ca61184', null), 
(114, 1, 'eeba099ff25719e60d7224077ca61184', null), 
(115, 1, 'eeba099ff25719e60d7224077ca61184', null), 
(116, 2, 'eeba099ff25719e60d7224077ca61184', null), 
(117, 2, 'eeba099ff25719e60d7224077ca61184', null), 
(118, 3, 'eeba099ff25719e60d7224077ca61184', null), 
(119, 3, 'eeba099ff25719e60d7224077ca61184', null), 
(120, 3, 'eeba099ff25719e60d7224077ca61184', null);

#----------------------------
# Table structure for products_pro
#----------------------------
CREATE TABLE `products_pro` (
  `id_pro` int(11) NOT NULL auto_increment,
  `name_pro` varchar(100) default NULL,
  `image_pro` varchar(100) default NULL,
  PRIMARY KEY  (`id_pro`)
) ENGINE=MyISAM DEFAULT CHARSET=latin1;
#----------------------------
# Records for table products_pro
#----------------------------


insert  into products_pro values 
(1, 'low impact', '/images/icons/low_impact.gif'), 
(2, 'herbs', '/images/icons/herbs.gif'), 
(3, 'yoga', '/images/icons/yoga.jpg');