mouseDragged needs to be implemented

[charlesjolley]

We need to implement the behavior for mouseDown/mouseUp and mouseDragged in order to allow for views to properly track mouse events on a mouse click. Here is an example use case:

Let's say I have a view that I want to drag around the screen on click but the view snaps to a grid system meaning that the won't immediately move with the mouse until the mouse reaches the next grid boundary. On mouseDown, the view receiving the mouseDown needs to receive mouse move events and then a mouse up when the button is received even if the mouse is outside of the view boundary.

The way this is implemented in 1.6 (and every other desktop framework) is that the view responding true to the mouseDown() event will receive mouseDragged() event whenever the mouse moves regardless of mouse location. Likewise when the mouse button is released, that view will receive a mouseUp() event regardless of mouse location.

We need to re-implement this behavior is SC 2.0

[charlesjolley]

I created an example app that demonstrates this problem:

http://polaroid-977a90f6.strobeapp.com/

Click on the 'section' and try to drag. It should move left to right only. Note how it stops dragging as soon as your mouse goes outside of the red box. This is because mouseMove stops going to the targeted view.

Code is here:

https://github.com/strobecorp/paper20/tree/dragging-bug

[wagenet]

Given that Ember sticks pretty closely to DOM events (or at least jQuery ones), I'm not sure if this quite fits. If we were going to full implement this, we'd have to add more complexity to the event dispatcher, including registering a view as the current mouse handler. @wycats, @tomdale do you think this something we want to attempt?

[tomdale]

I think we can implement this as a jQuery special event (http://benalman.com/news/2010/03/jquery-special-events/), no?

[wagenet]

@tomdale Maybe, but we'd still have to register the view globally as having mouse control so we know who to send the mouseDragged event to along with the mouseUp if the mouse goes up outside of the view. We'd probably also not want to trigger any other mouse events on other views while in this state.

[krisselden]

There are multiple jquery plugins for drag events, using $.event.special that @tomdale mentioned, and you can specify those events in customEvents when you create your Application, so that your views will receive them.

[wagenet]

@kselden is this something we'd want to integrate into Ember?

[krisselden]

Ember already does dispatch jQuery special events to Ember views if you specify them in your App's customEvents property and plugins like http://threedubmedia.com/ add these events. What more should Ember do? Prepackage one of these plugins or rewrite its own special events for drag?

Ember having examples of integrating plugins such as these is more useful, as you need different levels of complexity for the drag event depending on what you are doing, like having enter and leave for drop targets. Beter to leave that to the plugins.

[wagenet]

Since we're not making any forward progress on this ticket and there is a way to do this with a plugin as @kselden pointed out, I'm going to close this.