gistfile1.rb

// JS Stuffs here

$("#add-new").droppable({
            accept: ".draggable-stuffs",
            drop: handleDrop
          });

function handleAddNewDrop(event, ui) {
          // do stuffs with your event and ui params... or not.
        }


# some web steps to be called on your cukes...

When /^I drag the div "([^"]*)" to the add-new dropzone$/ do |div_id|
  javascript = <<-eos
var ui = { draggable: $("#{div_id}")}; // this is a mock ui object that is to be passed in the method
handleAddNewDrop($.Event("drop"), ui);
eos
  page.execute_script javascript
end

When /^I change the group\-box number (\d+) title to "([^"]*)"$/ do |order, new_title|
  javascript = <<-eos
var selectedGroupBox = $($(".group-box")[#{order}]);
selectedGroupBox.find(".edit").click();
selectedGroupBox.find("input").val("#{new_title}");
selectedGroupBox.find("input").blur();
eos
  page.execute_script javascript
end

These are just some examples how you can actually trigger events and call functions from your cukes.