Touch support for selection plugin

[GoogleCodeExporter]

Add touch support to the selection plugin (specifically for iPad support).

Patch attached allows you to select an area on a plot on an iPad using your 
finger in a similar manner to the way selection is currently done with the 
mouse.  This has been tested on Mobile Safari on iPad 3.2 and iPhone 4.0.  This 
works great for single finger touch and drag, however I'm not sure how to 
handle multiple touches appropriately.

Original issue reported on code.google.com by james.b...@gmail.com on 11 Oct 2010 at 12:21

[GoogleCodeExporter]

Attaching patch I forgot to attach with issue sorry.

Original comment by james.b...@gmail.com on 11 Oct 2010 at 12:23

Attachments:

• ipadSupport.patch

[GoogleCodeExporter]

[deleted comment]

[GoogleCodeExporter]

Updated patch as the 'return false' on the onMouseDown event handler was 
preventing mouseover events from firing when touching a point on a plot on a 
touch screen device.  This broke the hover feature on touch screen devices.

The return false was originally introduced to prevent the onMouseDown event 
handler being called twice per event (iPad/iPhone fires 'touchstart' then 
'mousedown' events on every touch).  Instead we disable the mousedown event if 
we catch a touchstart event; inspired by PPK's post on touch events 
(http://www.quirksmode.org/blog/archives/2010/02/do_we_need_touc.html).

Original comment by james.b...@gmail.com on 21 Oct 2010 at 8:16

Attachments:

• ipadSupport.patch

[GoogleCodeExporter]

Okaydokey. It's nice you're working on this!

I just looked through your patch. Seems okay, but I get the feeling it might 
have to be extended at some point so I think it would be less confusing if the 
mouse paths and touch paths could be better separated with some refactoring.

Original comment by olau%iol...@gtempaccount.com on 14 Dec 2010 at 10:47

• Added labels: Type-Enhancement
• Removed labels: Type-Defect

[GoogleCodeExporter]

Question:
The Selection is working great now. Thanks. But what about the zoom feature?
When I have it enabled, it zooms in and right away out again.
But only on an IOS device. Works fine on desktop browsers.
I found out that in mobile safari, after the touchstart, move and end events 
are done, another onclick event is fired. Which is why the graph zooms out 
again.

Is there any way to supress this subsequent onclick when using a touch device?
All I tried broke the normal onclick, too. Which of course you need to 
highlight data points in the graph.

Original comment by mostly.i...@gmail.com on 10 Mar 2011 at 6:47

[GoogleCodeExporter]

Excellent suggestion, to include touch events in the system; saved me a lot of 
time;

However, I found that the default action of a touch-enabled browser is 
zooming/panning etc. Which leads to undesired results and may be annoying. So I 
would like to suggest the following:

        function onMouseMove(e) {
            if (selection.active) {
                updateSelection(e);

                plot.getPlaceholder().trigger("plotselecting", [ getSelection() ]);
                // prevent the default action
                e.preventDefault();
            }
        }

Original comment by joostvan...@gmail.com on 22 Oct 2011 at 11:31

[GoogleCodeExporter]

I submitted a patch (pull request) in git since I didn't find this code (or any 
working) in code base.

Original comment by markos on 25 Nov 2011 at 3:57

[GoogleCodeExporter]

I happened to need this patch for some android work, so I applied the current 
patch (which didn't apply cleanly and needed some work by hand) against flot 
0.7. However, I altered the prevention of the default in onMouseMove so it only 
prevents the default action if there it was the result of a touch event. This 
is just a drive by patching, so hopefully it is sufficient. Thanks.

Original comment by pkpsil...@gmail.com on 1 Feb 2012 at 8:41

Attachments:

• touch-support.patch

[GoogleCodeExporter]

Original comment by dnsch...@gmail.com on 8 May 2012 at 12:32

• Changed state: Accepted

[GoogleCodeExporter]

none of the patches allow me to select anything with galaxy s2, anyone had any 
luck?

Original comment by ru...@rubensayshi.com on 23 Aug 2012 at 4:06

[GoogleCodeExporter]

What happened to this patch?
Is is supposed to be ever include din the official code base?

This would likely solve my problem as explained in
https://groups.google.com/forum/?fromgroups=#!topic/flot-graphs/YFBNajA01is

Thanks,
  Igor

Original comment by igor.sfi...@gmail.com on 11 Oct 2012 at 5:06

[GoogleCodeExporter]

Many thanks for writing this patch. It's a shame it hasn't been folded into the 
official code yet :(

I couldn't get it working with recent versions of jquery.flot.selection, and 
the reason was the updateSelection() function testing pos.pageX, which is 
always null for a touch event. Changing:

        function updateSelection(pos) {
            if (pos.pageX == null)
                return;

to:

        function updateSelection(pos) {
            var coordHolder = selection.touch ? pos.originalEvent.changedTouches[0] : pos;
            if (coordHolder.pageX == null)
                return;

got it working for me on iPad OS 4.3.3, Galaxy Tablet v3.2 and Galaxy SII phone 
v4.1.2.

Cheers

Original comment by nickcons...@googlemail.com on 1 Jun 2013 at 2:20

[GoogleCodeExporter]

FYI, to prevent anyone else from posting: this is issue 505 on the github site 
now (https://github.com/flot/flot/issues/505).  Flot stopped using google code 
to track issues for about a year.

I'm pulling the old patch (as shown here, with Nick's fix) and if it tests out 
on the 0.9 tree I plan on re-submitting the patch as a pull request...

Original comment by n...@askneil.com on 3 Dec 2013 at 3:03