marcojakob / dart-dnd

Drag and Drop for Dart web apps with mouse and touch support.

Home Page:https://code.makery.ch/library/dart-drag-and-drop/

Geek Repo:Geek Repo

Github PK Tool:Github PK Tool

Pls. add a way to set something like an "invalid-zone" css class

MikeMitterer opened this issue · comments

First of all - Thanks for your package!
It would be cool if you could add a way to add an indicator for an invalid (not allowed) Drop-Zone.

I tried it with my own Acceptor and it's possible to do something like this:

    @override
    bool accepts(final html.Element draggableElement,final int draggableId,final html.Element dropzoneElement) {

        final bool isValid = _isDragZoneValid();
        if(!isValid) {
            dropzoneElement.classes.add("dnd-invalid");
        } else {
            dropzoneElement.classes.remove("dnd-invalid");
        }
        return isValid;
    }

The problem with this approach is that dnd-invalid is set but never unset because an invalid drop-zone never gets onDragLeave... - so no way to remove the dnd-invalid class.

That's a valid point. I will have a look at that.

The fix adds a css class (dnd-invalid by default) to dropzones when a not-accepted draggable is dragged over.

See it in action: http://marcojakob.github.io/dart-dnd/custom-acceptor/