Displaying actionsheet on a long press, aka hold event (problem)

ionic-v1
1

Codepen : http://codepen.io/peey/pen/ndkGm
Instructions: : click on the show actionsheet button and hold that click, after sheet appears, end the click

You’ll see that the actionsheet disappears, I think its because the un-clicking fires some event which ionic interprets as a click on the backdrop, and thus hides the actionsheet

What I want instead is for the actionsheet to not disappear

Any suggestions will be much appreciated

2

Update:

I have since established that this is due to a mouseup and a click event on the backdrop which is launched immediately after mouseup.

I found a hack, but it’s really ugly imo. If you append a child div to .action-sheet-backdrop then you can intercept all the events, and then after you have intercepted your very first click or mouseup, you can then remove the overlay thus restoring the balance to ionic universe.

3

With beta 7, our gestures have been exposed as directives.

So you can achieve this by

  <button class="button" on-hold="showActionsheet()">
    Show Actionsheet
  </button>
4

@mhartington thanks and sorry for not keeping myself up-to-date with ionic.

Your codepen demo works as expected in google chrome, however when running on firefox ionic throws an error which is viewable on console, I think that this problem is related to the new gesture directives, is this a known issue?

5

Well our browser support doesn’t include firefox, so we’re not making any promises that it will work there. Support for firefox/firefox os is on the roadmap though

6

Woah! although this won’t affect many mobile apps, this is still pretty shocking since many developers and many testing and development environments make use of firefox. I have opened up this github issue, so that this problem is resolved either when ionic officially starts supporting firefox, or when someone decides to solve this.