My job quote calculator is returning "X is not a function"

Question

This is a corporate massage job quote calculator.

From the user, we collect:

Start time
End time
Number of clients needing a massage

We then use those variables in conjunction with our business rules of time needed per person and hourly rate for a therapist to determine how many therapists are needed and how much it will cost the client to staff those therapists.

When ran, my console displays an error message "timeStr.split is not a function". I thought there was an issue with the .map() method but I've tried resolving to no avail. I am new to JS and could really use some help, please. Here is the code

HTML

<body>
    <label for="starttime">Start Time</label><br>
    <input id="starttime" type="time" name="starttime" placeholder="Start time"><br>
    <label for="endtime">End Time</label><br>
    <input id="endtime" type="time" name="endtime" placeholder="End time"><br>
    <label for="clients"># of people needing massage</label><br>
    <input id="clients" type="number" name="clients" id=""><br>
    <input  type="button" value="Submit" id="inputbtn" onclick="calc()">
</body>

JS

/*User Inputs*/
        const start = document.getElementById("starttime").value;
        const end = document.getElementById("endtime").value;
        const people = document.getElementById("clients").value;
        let timeStart = new Date("01/02/2020" + start);
        let timeEnd = new Date("01/02/2020"+end);

        /*constants*/
        const rate = 80;
        const allot = "00:20:00";


        /*Time converter*/

        function convTime(timeStr){
            arr = timeStr.split(":");
            arr = arr.map(Number=> Number);

            let theHours = arr[0];
            let theMinutes = arr[1]/60;
            let timeDec = theHours+theMinutes;

            return timeDec;

        }


        /*formulas*/
        const ogTime = timeEnd - timeStart;
        const givenTime = convTime(ogTime);
        const convAllot = convTime(allot)
        const realTime = people*convAllot;
        const therapists = realTime/givenTime;
        const price = therapists*rate*givenTime;


        console.log(price);

`ogTime` is a `number`, not a `string` – Hao Wu Feb 05 '20 at 01:43 — Hao Wu, Feb 05 '20 at 01:43

Abdelrahman Gobarah · Answer 1 · 2020-02-05T05:15:37.793

Moved declare variables of users inputs into Calc() Method to get the value after user insert it, not only on Document Load
use MomentJs Library to calc diff dates and get Hours, minutes, ...
set inputs default values for DEMO only

/*constants*/
var dateStr = "01/02/2020";
const rate = 80;
const allot = moment(new Date(dateStr)).add("+20m"); // 20 minutes

/*Time converter*/
function convTime(t) {
  t = moment(t);
  let theHours = t.format('h');
  let theMinutes = t.format('mm');
  let timeDec = Number(theHours) + Number(theMinutes);

  return timeDec;
}

function calc() {
  /*User Inputs*/
  const start = document.getElementById("starttime").value;
  const end = document.getElementById("endtime").value;
  const people = document.getElementById("clients").value;
  var timeStart = new Date(dateStr + " " + start);
  var timeEnd = new Date(dateStr + " " + end);

  /*formulas*/
  const ogTime = moment(timeEnd).diff(timeStart);
  const givenTime = convTime(ogTime);
  const convAllot = convTime(allot);
  const realTime = people * convAllot;
  const therapists = realTime / givenTime;
  const price = therapists * rate * givenTime;

  console.log(price);
}

calc(); // call it on load -- remove this if you want onclick only

<label for="starttime">Start Time</label><br>
<input id="starttime" type="time" name="starttime" placeholder="Start time" value="07:00"><br>
<label for="endtime">End Time</label><br>
<input id="endtime" type="time" name="endtime" placeholder="End time" value="08:00"><br>
<label for="clients"># of people needing massage</label><br>
<input id="clients" type="number" name="clients" value="1"><br>
<input type="button" value="Submit" id="inputbtn" onclick="calc()">

<script src="https://cdnjs.cloudflare.com/ajax/libs/moment.js/2.24.0/moment.min.js"></script>

My job quote calculator is returning "X is not a function"

1 Answers1