var Exercise = Class.create({
  initialize: function(drop_zones, module, total, server_scriptname) {
    this.total = total;
    this.row = 0;
    this.dropped = 0;
    this.moves = 0;
    this.items = $('items').select('div.drag');
    this.drop_zones = drop_zones;
    this.module = module;
    this.server_scriptname = server_scriptname;

    // Setup draggables
    for (var i = 0; i < this.items.length; i++) {
      div = this.items[i];
      new Draggable(div.id, { revert: true });
    }

    // Adding droppables
    Droppables.drops = [];
    for(var i = 0; i < this.drop_zones.length; i++) {
      Droppables.add(this.drop_zones[i], { accept: 'drag',
                                           onDrop: this.drop.bind(this) });
    }

    $('row_0').show();
  },
  emptyrow: function() {
    return $('row_' + this.row).empty();
  },
  nextrow: function() {
    $('row_' + this.row).hide();
    this.row += 1;
    new Effect.Grow('row_' + this.row);
  },
  drop: function(draggable, droppable, event) {
    this.moves++;
    if (draggable.id.match(droppable.id)) {
      this.dropped++;
      var divs = $(droppable).select('div.item');
      for (var i = 0; i < divs.length; i++) {
        div = divs[i];
        if (!div.innerHTML) break;
      }
      div.innerHTML = $(draggable).innerHTML;
      div.addClassName('done');
      draggable.remove();
      //save results only if all the items have been dragged to the droppables
      if (this.dropped == this.total) { this.done(); }
      else if (this.emptyrow()) { this.nextrow(); }
    }
    else {
      new Effect.Pulsate(draggable.id, {duration: 1.5});
    }
  },
  done: function() {
    $('items').hide();
    new Ajax.Updater('comment', this.server_scriptname + '/' + this.module + '/sortResult?moves=' + this.moves, {
      onComplete: function() {
        new Effect.Grow('result');
        new Effect.Grow('actions2');
      }
    });
  }
});

Event.observe(window, 'load', function() { var exercise = new Exercise(drop_zones, module, total, server_scriptname); });