Fluent Form Time difference

fluent-form-time-difference.js

// 1. Add input text elemet to show the difference
// 2. add 'time-1' & 'time-2' class to the to time input field
// 3. paste the following code in fluent form custom JS
// time format HH:MM

var show_input_selector = '.hour';
var time1 = jQuery('.time-1');
var time2 = jQuery('.time-2');

const convertTime12to24 = (time12h) => {
  
  const [time, modifier] = time12h.split(' ');
  let [hours, minutes] = time.split(':');

  if (hours === '12') {
    hours = '00';
  }

  if (modifier === 'PM') {
    hours = parseInt(hours, 10) + 12;
  }

  return `${hours}:${minutes}`;
}


function diff_hours(dt2, dt1) 
 {
 
  let [dt2_hours, dt2_minutes] = dt2.split(':');
  let [dt1_hours, dt1_minutes] = dt1.split(':');
  let hh = dt2_hours -dt1_hours;
  
  if (dt2_minutes < dt1_minutes){
      hh--
  }
  let mm = dt2_minutes - dt1_minutes;
  if(mm < 0){
      mm += 60;
  }
  if(mm <10 ){
      mm = '0'+mm;
  }
  return( Math.abs(hh) +':'+ mm);
  
 }
 
 jQuery('.ff-el-datepicker').on('change',function(){
       
    if(time1.val()!=='' && time2.val()!=='')   {    
        let diff=  diff_hours (convertTime12to24(time2.val()), convertTime12to24(time1.val()));
        jQuery(show_input_selector).val(diff);
    }    
 })