Project

Profile

Help

Forums » General »

How to implement swiping

Added by Pieter Masereeuw over 5 years ago

I am trying to implement responding to left and right swipes on Firefox and Chrome under Android.

My attempt stores the ixsl:event() object on an ixsl:ontouchstart event and tries to compare that with the coordinates (clientX/Y?) when the subsequent event ixsl:ontouchend occurs.

Comparing the x coordinates could be used to see if there is a left or a right swipe.

Actually, my problem is that I cannot even obtain the coordinates - I tried:

  • $myEvent?clientX

  • (($myEvent?touches)[1])?clientX

  • ixsl:get($myEvent, 'clientX')

  • ixsl:get($myEvent, 'touches[0].clientX).

I must confess that I may be too unfamiliar with Javascript, so a pointer in the right direction could really help me (and perhaps other users on this forum).

Pieter


Replies (5)

Please register to reply

RE: How to implement swiping - Added by Debbie Lockett over 5 years ago

Hi Pieter,

I've done some experimentation (and background reading at https://developer.mozilla.org/en-US/docs/Web/API/Touch_events), and after some false starts, I have now got handling touch events working.

The difficulty is getting the paths right to access the properties for the coordinates. You are almost there, except that the indexes (e.g. "0" for 1st touch contact point, "1" for 2nd) into the TouchList should also be treated as property names. So you should use something like one of the following:

  • ixsl:get($myEvent, 'touches.0.clientX')

  • $myEvent?touches?0?clientX

Where the JavaScript would be event.touches[0].clientX.

(Note that you'll need to use the changedTouches property rather than just touches for the touchend event. As well as Mozilla, I found the following useful to learn about touch events: http://www.javascriptkit.com/javatutors/touchevents.shtml)

Now have fun!

RE: How to implement swiping - Added by Pieter Masereeuw over 5 years ago

Hi Debbie - that looks very promising. It is evident that I need to develop some more JavaScript skills. I also had no idea how to pass a more complex expression like this to ixsl:get() - maybe that would deserve somewhat more attention in the documentation? But thanks a lot anyway!

RE: How to implement swiping - Added by Debbie Lockett over 5 years ago

Indeed. The ixsl:get page (http://www.saxonica.com/saxon-js/documentation/index.html#!ixsl-extension/functions/get) says: "The value of a nested property can be obtained by using dot separator characters within $property: for example, location.hash to get the hash property of the location property of the Window object." But we don't give more complicated examples. I'll add this one!

RE: How to implement swiping - Added by Pieter Masereeuw over 5 years ago

Hi - I got it working perfectly, thanks a gain. I would like to add to this conversation that it was necessary to cast information in Javascript objects to the required XSLT types (xs:integer, in the case of the coordinates). This may be because I am fanatically using strong typing, but shouldn't we all?

On 6/13/19 2:19 PM, Saxonica Developer Community wrote:

RE: How to implement swiping - Added by Debbie Lockett over 5 years ago

This discussion instigated a full review of the IXSL extensions section in the documentation. See https://saxonica.plan.io/issues/4241 for details.

The Saxon-JS 1.2.0 documentation changes have now been uploaded online. e.g See the updates at http://www.saxonica.com/saxon-js/documentation/index.html#!ixsl-extension/functions/get and the new section http://www.saxonica.com/saxon-js/documentation/index.html#!development/properties

    (1-5/5)

    Please register to reply