Draggable not functionable on mobile

[TracyRad]

Hello, the measure does not work on mobile. I'm thinking this is because only mouse events are recognized for the draggable -- would you be able to easily add touch events so that the measure could be used on mobile?

[bartkamphorst]

Thanks for the report @TracyRad . I think your diagnosis is correct, so we'd need to find a way to add touch events, or translate touch events to mouse events to make fsc-c work on mobile. I think https://github.com/furf/jquery-ui-touch-punch is supposed to do something like that, but I'm not sure how well maintained that library still is. I'll look into it.

[bartkamphorst]

Hi @TracyRad , turns out that there's a fork of this library by RWAP that is maintained. To enable it, add the following line to your document header, after the jquery-ui line:

<script src="https://cdn.jsdelivr.net/gh/RWAP/jquery-ui-touch-punch@970cab8/jquery.ui.touch-punch.js"></script>

This library will translate touch events into mouse events, so the measure should then work as expected on mobile. I've tested this locally and on Qualtrics with success. Would you mind trying this out and letting me know how it went?

NB For completeness, and for future reference, the headers on Qualtrics will then look like this:

<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.6.1/jquery.min.js"></script>
<script src="https://ajax.googleapis.com/ajax/libs/jqueryui/1.13.2/jquery-ui.min.js"></script>
<script src="https://cdn.jsdelivr.net/gh/RWAP/jquery-ui-touch-punch@970cab8/jquery.ui.touch-punch.js"></script
<script src="https://cdn.jsdelivr.net/gh/bartkamphorst/fsc-c@5e76fc9/fsc-c.js"></script>

[TracyRad]

That's great that you were able to find a maintained library! I was actually trying some of the other touchpunch libraries and none of them worked.
I have been able to make it work SOMEWHAT. It will drag with touch by adding the library to the header, however, in my initial test, it doesn't send any data.

[bartkamphorst]

That's strange! In principle, if the circles can be dragged and dropped, then the data should be passed along in the same way as before. Is the data being stored correctly when you use a desktop browser? Any error reports in your browser's javascript console?