Drag and Drop

Overview

Dran and Drop is available for any DOM node using the DragTarget and DropTarget APIs.

Drag and Drop

Any Elem can be converted into a drag target using DragTarget:

Box
{
  it.text = "Drag me"
  DragTarget.bind(it)
  {
    // get the data payload when a drag event starts
    it.onDrag { "Hi :)" }
  }
}

Likewise any Elem can be converted into a drop target using DropTarget:

Box
{
  it.text = "Drop on me"
  DropTarget.bind(it)
  {
    it.onDrop |data| { echo("# drop: $data") }
  }
}

You may specify if the given drag data is able to be dropped on a DropTarget using canDrop:

DropTarget.bind(elem)
{
  it.canDrop |data| { data == "foo" }
  it.onDrop  |data| { echo("# drop: $data") }
}