Javascript conversion, from Prototype to jQuery

Question

Hi,

I would like to update the following javascript code based on Prototype framework to jQuery framework:

Event.observe(window, 'load', function() {
  $$('.piece').each(function(item) {
    new Draggable(item, { revert: true } );
  });

  $$('.cell').each(function(item) {
    Droppables.add(item, {
      accept: 'piece',
      onDrop: function(piece, cell) {
        cell.descendants().each(function(item) { item.remove(); } );

        piece.remove();
        piece.setStyle({ 'top': null, 'left': null });
        new Draggable(piece, { revert: true });
        cell.appendChild(piece);
      }
    });
  });
});

The first part of the script is easy to convert:

$(function() {
  $('.piece').draggable(
    {
      evert: true
    }
  );

  $('.cell').droppable(
    {
      /* But here, it's more difficult. Right? ;)
      ... */
    }
  });
});

Have you got an idea? Any part of code is welcome. Thanks a lot.

Answer 1

Here's what I have:

jQuery(document).ready(function(){ 
    $('.piece').draggable({
        revert: true
        , scope: 'piece_and_cell'
    });

    $('.cell').droppable({
        drop: function(event, ui) {
            var cell = $(this);
            cell.empty();
            var piece = ui.draggable.detach()
            piece.css({top:null, left: null}).appendTo(cell);
            piece.draggable({
                revert: true
                , scope: 'piece_and_cell'
            })
        }
        , scope: 'piece_and_cell'
    });
});