In my questionnaire, I need to calculate the total hours participants are awake, to the nearest .5 hours. I have implemented this in a way that works on desktop browsers, but is failing on mobile. I have tried on 2 Android phones, and it also fails when using the Qualtrics mobile preview on my desktop. The waking hours value must be calculated and saved to embedded data on submission of the page with these questions, because it is needed immediately in the page that follows.
I am using two Flatpickr 24 hour time pickers to collect data on wake and sleep times, and a regular text entry field for the number of hours of nap. Here is my JS code for the Flatpickr questions:
Qualtrics.SurveyEngine.addOnload(function()
{
jQuery("#"+this.questionId+" .InputText").flatpickr({
enableTime: true, 
noCalendar: true,
dateFormat: "H:i",
defaultDate: "7:00",
minuteIncrement: 15,
disableMobile: true
});
});
And here is my JS code for calculating the total waking hours (I have also successfully calculated it in a different way, but that also doesn't seem to work on mobile):
Qualtrics.SurveyEngine.addOnPageSubmit(function()
{
function roundHalf(num) { return (Math.round(num*2)/2).toFixed(1); }

var wake = jQuery('#QID82').eq(0).find('inputttype="text"]').val();
var sleep = jQuery('#QID83').eq(0).find('inputttype="text"]').val();
var nap = jQuery('#QID84').eq(0).find('inputttype="text"]').val();

var wake_array = wake.split(":"); //split the time string into pieces
var wake_hrs = wake_arrayy0]; //the hours are the 1st element
var wake_mins = wake_arrayy1]; //the minutes are the 2nd element
var wake_mins = 1/(60/wake_mins); //turn minutes into decimals (15 = .25, 30 = .5, 45 = .75)
var wake_time  = parseFloat(wake_hrs)+parseFloat(wake_mins); //add the hrs and decimal-minutes

var sleep_array = sleep.split(":");
var sleep_hrs = sleep_arraya0];
var sleep_mins = sleep_arraya1];
var sleep_mins = 1/(60/sleep_mins);
var sleep_time  = parseFloat(sleep_hrs)+parseFloat(sleep_mins);

var hrsawake = parseFloat(sleep_time)-parseFloat(wake_time)-parseFloat(nap); //time awake is sleep minus wake minus nap
var hrsawake = roundHalf(hrsawake); //use custom rounding function to get value to nearest .5
var hrsawake = Math.round(hrsawake*100)/100; //use regular rounding to remove .0 at the end of any integer values

Qualtrics.SurveyEngine.setEmbeddedData("hrs_awake", hrsawake); //This isn't saving correctly on mobile

});
Does anyone have any insight into how to make this work reliably across platforms? If Flatpickr can't do the job, can anyone recommend something else that makes inputting times easy/pretty and calculating the duration straightforward?
Thank you very much!