onDragMove don't give access to the dragged element

[alaa-eddine]

Hi,

Thank you for your great job on MetroUI, it's really helping a lot in getting beautiful interface done fast.

I'm using window component a lot, and I noticed that onDragMove event callback only have a "pos" argument, and the only way to access the dragged element is to use "this"inside the function.
the problem is that sometimes, we need to use fat arrow functions where this is bound to the parent context.

for now, I'm getting around it by overriding the event at runtime, but it's a dirty hack :)

is it possible to add a second argument to the actually dragged element ?
it also makes sense since other events like onMinClick, onCanClose already provide it.

Many thanks

[alaa-eddine]

This is the hack I'm using btw

const settings = {
//contains my window settings
}

settings.onDragStop = (pos, el) => {
  // normally, el argument is not provided, and this is not accessible inside fat arrow function
  // see below for override to get it working
}

const window = Metro.window.create(settings).data('window');

//. . .

//overriding draggable events in order to pass the context as last argument
const draggable = window.win.data('draggable');
['onDragStart', 'onDragStop', 'onDragMove'].forEach(evt => {
	const orig = draggable.options[evt];
	draggable.options[evt] = function (...args) {
		args.push(this);
		return orig.apply(this, args)
	}
});

[olton]

Added in 4.3.8. You can use second argument for events, named context

<div data-role="window" class="p-2" data-on-drag-start="dragStart">
    This is a simple window
</div>

function dragStart(pos, context) {
    console.log(pos, context);
}