Quokka Scratch to count time left before next prayer/shalat/sholat time, to make class for later on... using api.aladhan

islamicPrayerTimeCountdown.js

import _ from 'lodash'
function diff(start, end) {
  start = start.split(':');
  end = end.split(':');
  let startDate = new Date(0, 0, 0, start[0], start[1], 0);
  let endDate = new Date(0, 0, 0, end[0], end[1], 0);
  let diff = endDate.getTime() - startDate.getTime();
  let hours = Math.floor(diff / 1000 / 60 / 60);
  diff -= hours * 1000 * 60 * 60;
  let minutes = Math.floor(diff / 1000 / 60);

  // If using time pickers with 24 hours format, add the below line get exact hours
  if (hours < 0) hours = hours + 24;

  return (hours <= 9 ? '0' : '') + hours + ':' + (minutes <= 9 ? '0' : '') + minutes;
}

let obj = Object.assign( { "Fajr": "03:24", "Sunrise": "05:44", "Dhuhr": "11:47", "Asr": "14:58", "Sunset": "17:49", "Maghrib": "17:49", "Isha": "19:19", "Imsak": "04:23", "Midnight": "23:47" } )
let d = new Date();
let time = diff(`${d.getHours()}:${d.getMinutes()}`, obj['Fajr']);

function closestPrayerTime(obj) {
  let dt = new Date()
  let which;
  let diffArray = []

  _.each(obj, (v, k) => {
    let tim = diff(`${dt.getHours()}:${dt.getMinutes()}`, v);
    console.log(`${v}`)
    console.log(`${tim}`)
    if(tim < '09:00') {
      diffArray.push({name: k, timeLeft: tim})
    }
  })
  diffArray = _.orderBy(diffArray, ['timeLeft'], ['asc'])

  console.log(diffArray);
  which = diffArray[0]
  console.log(which);

  return diffArray
}



let clos = closestPrayerTime(obj);
console.log(clos)

islamicPrayerTimeCountdownStore.js

function diff(start, end) {
  start = start.split(':');
  end = end.split(':');
  let startDate = new Date(0, 0, 0, start[0], start[1], 0);
  let endDate = new Date(0, 0, 0, end[0], end[1], 0);
  let diff = endDate.getTime() - startDate.getTime();
  let hours = Math.floor(diff / 1000 / 60 / 60);
  diff -= hours * 1000 * 60 * 60;
  let minutes = Math.floor(diff / 1000 / 60);

  // If using time pickers with 24 hours format, add the below line get exact hours
  if (hours < 0) hours = hours + 24;

  return (hours <= 9 ? '0' : '') + hours + ':' + (minutes <= 9 ? '0' : '') + minutes;
}

export function PrayerTimeReminder(fn, time) {
  var timer = false;
  this.start = function () {
    if (!this.isRunning())
      timer = setInterval(fn, time);
  };
  this.stop = function () {
    clearInterval(timer);
    timer = false;
  };
  this.isRunning = function () {
    return timer !== false;
  };
}

export function closestPrayerTime(prayerTimeArray = []) {
  let dt = new Date()
  let timeOffset = '09:00'
  let whichTheClosest;
  let diffArray = []
  delete prayerTimeArray['Imsak']
  delete prayerTimeArray['Sunrise']
  each(prayerTimeArray, (v, k) => {
    let timeDiff = diff(`${dt.getHours()}:${dt.getMinutes()}`, v);
    if (timeDiff < timeOffset) {
      diffArray.push({ name: k, timeLeft: timeDiff });
    }
  });

  // Order which one is the closst
  diffArray = orderBy(diffArray, ['timeLeft'], ['asc']);

  // TODO: Make a set interval about 10 minutes before and give notification
  // Taking the closest time and dispatch
  whichTheClosest = diffArray[0]
  store.dispatch('setStateByKey', { key: 'timeLeftBeforePray', value: whichTheClosest });
  return whichTheClosest;
}
export function setPrayerTime(store) {
  var long, lat;
  if (navigator.geolocation) {
    // TODO: This supposed to conditionally check for different day, lazy
    if(store.state.prayerTime.length > 1) {
    } else {
      navigator.geolocation.getCurrentPosition(position => {
        long = position.coords.longitude;
        lat = position.coords.latitude;
        var xhr = new XMLHttpRequest();
        xhr.onload = function() {
          store.dispatch('setStateByKey', { key: 'prayerTime', value: JSON.parse(xhr.response).data.timings });
        };
        xhr.open('GET', `https://api.aladhan.com/v1/timings/${Date().now}?latitude=${lat}&longitude=${long}&method=4`);
        xhr.send();
      });
    }
  }
};