Integrate MultiDrag plugin from sortablejs

[kinesias]

Starting with version 1.9.0, SortableJS allows the user to select and drag multiple items at once with the MultiDrag option.
https://github.com/SortableJS/Sortable/wiki/Dragging-Multiple-Items-in-Sortable

Is there a way to use this awesome feature with vuedraggable?

[chengmanxiang]

Starting with version 1.9.0, SortableJS allows the user to select and drag multiple items at once with the MultiDrag option.
https://github.com/SortableJS/Sortable/wiki/Dragging-Multiple-Items-in-Sortable

Is there a way to use this awesome feature with vuedraggable?

@ David-Desmaisons How soon will this feature be added?

[waynevanson]

@David-Desmaisons With this feature, I had an an idea. I want to replicate this in the react edition too.

Since SortableJS come with the package as a dependency, we could expose Sortable as an export from vuedraggable? That way the user can mount the plugin using the version of sortable from the dependency.

Sortable Plugins Docs shows how easy it is to export. @owen-m1 will MultiDrag be included when sortablejs is added via package manager such as NPM or Yarn?

<script>
import draggable, { Sortable, MultiDrag } from 'vuedraggable';

Sortable.mount(new MultiDrag())

// ... vue component here
</script>

[owen-m1]

@waynevanson Yes, the plugins are already included in the released 1.10.0-rc versions.

[waynevanson]

@owen-m1 The plugins aren't available in the @types/sortablejs, but it does work when mounted. Using modules and Typescript, it looks like you're not importing anything but with enough // @ts-ignore's, it works.

I might make a pull to that repo.

[owen-m1]

@waynevanson That would be helpful. I have been converting the code to Typescript (not pushed yet) and I will see if it is a viable option. So far it's looking pretty good.

[rwam]

The implementation of the multidrag feature into this module is not as easy as thought. I've tried to add support using version 1.10.0-rc3 from sortablejs which includes the multidrag plugin. But you have to refactor a whole bunch of methods on vuedraggable.js like almost all onDrag…-callbacks to consider items and clones, the underlying vm, list updates and so on.

[owen-m1]

@rwam I didn't think it would be very simple. Perhaps VueDraggable would need a plugin system similiar to Sortable's.

[chengmanxiang]

@ David-Desmaisons How soon will this feature be added?

[EugenMaevskiy]

@owen-m1 , Could you please suggest when multidrag feature will be integrated in VueDraggable?

[owen-m1]

@EugenMaevskiy I do not maintain VueDraggable nor do I know anything about it's internals. It is up to @David-Desmaisons or another contributor to add. I think @beljand is trying to implement it.

If nobody wants to add it though I might be able to try, but it might take me a while.

[David-Desmaisons]

@EugenMaevskiy @chengmanxiang I am vue.draggable maintainer. I will add multi-drag at some point in the future, but I can not tell you how soon:
1-because I am not sure exactly when I will start
2-because I am not sure about how impacting this will be (but surely it will have a significant impact on the project)

In the meanwhile if someone wants to try to implement this (which I do not recommend due to its high complexity), please enter in contact with me (maybe opening a draft PR) so I can give some guidance.

Once I will start I will follow-up my progress using this issue.

[owen-m1]

Great. I can also answer any questions pertaining to how the MultiDrag plugin works and it's exact behavior if they arise.

[noeleo25]

I would really like to have this feature for Vue draggable too!