[FIX] pos_restaurant: stop ghost clicks on iOS

On iOS (at least version 8.3 and up), both Chrome (at least 47 and up)
and Safari emit ghost clicks [1] that added the product normally
rendered under the table widget to the order. So when selecting a table
without any orders you would end up with the table selected, and the
product under the table in the order after just tapping the table.

The issue is that on the table selection screen we listen to touchend
events. On the product selection screen we listen to click
events. Mobile browsers will usually emit both, first the touchend
event, then a small delay, and then the click event. The small delay is
platform dependent. Also, depending on a bunch of circumstances,
browsers adjust this delay time (see [1] for more info).

On Android this never caused issues because there the click is fired
pretty fast after the touchend and more importantly, the click event
still has the table widget as it's target. We don't listen to click on
the table widget so it gets correctly ignored.

On iOS there is a longer delay, and the click event is emitted with
whatever target is currently under the coordinates of the click.

In order to stop this from happening we'll just bind to click when not
editing. When we are editing the floor layout we'll do what we did
before.

We also bind to dragend because on touch devices it is sometimes not
easy to click, especially on small elements. You have to touch and
release the screen without moving your finger. Because the table
selection screen hides overflow there are no downsides to doing this,
and it makes selecting a table much easier and less likely to fail due
to accidental dragging.

Calling preventDefault on the touchend event is another option but did
not work on Android running Firefox 43.

[1] http://ariatemplates.com/blog/2014/05/ghost-clicks-in-mobile-browsers/

0 files changed, 0 insertions, 0 deletions