// get the values from the page, starts our controller function
    const getValues = () => {
      // get values from the page
      let startValue = document.getElementById('startValue').value;
      let endValue = document.getElementById('endValue').value;
      let numbers = generateNumbers(startValue, endValue);
    
      // We need to validate our input
      //parse into Integers
      startValue = parseInt(startValue);
      endValue = parseInt(endValue);
    
      // this script checks for integers, run before and after the parseInt:
      // alert('The Combined Value is ' + (startValue + endValue));
    
      if (Number.isInteger(startValue) && Number.isInteger(endValue)) {
        //we call generateNumbers
      } else {
        alert('You must enter integers');
      }
    
      // these scripts alert the user that they are exceeding the scope of the project
      // and give hints to the min/max integer ranges of the loop
      if (startValue === -99 && endValue === 199) {
        alert(
          "Congratulations! You have discovered this loop's limits of time and space. I hope you have enjoyed exploring these conditional statements. Have a great day! :)"
        );
        displayNumbers(numbers);
      }
      if (startValue < -99 || endValue > 199) {
        alert('Value limits exceeded. Please try again.');
        return false;
      }
      if (
        (startValue < 1 || endValue > 100) &&
        startValue !== -99 &&
        endValue !== 199
      ) {
        alert(
          'A wider range of values still exist. Can you find the both edges of the number range?'
        );
      }
      if (
        (startValue < 1 || endValue > 100) &&
        (startValue === -99 || endValue === 199) &&
        !(startValue === -99 && endValue === 199)
      ) {
        alert(
          'Well done! You have found one of the range limits. One down, one to go!'
        );
      }
    
      // we call displayNumbers
      displayNumbers(numbers);
    };
    
    const generateNumbers = (sValue, eValue) => {
      let numbers = [];
    
      for (let index = sValue; index <= eValue; index++) {
        numbers.push(index);
      }
    
      return numbers;
    };
    
    const displayNumbers = (numbers) => {
      let templateRows = '';
    
      for (let index = 0; index < numbers.length; index++) {
        let className = 'even';
        let number = numbers[index];
    
        if (number % 2 === 0) {
          className = 'even';
        } else {
          className = 'odd';
        }
    
        templateRows += `${number}`;
      }
      // the following console.log script is used for debugging
      // console.log(numbers);
      document.getElementById('results').innerHTML = templateRows;
    };
        

                
            

100 STEPS is structured into three Javascript functions.

Hello World!

The "getValues" function takes in the inputted values from the page. The "parseInt" function parses the values into integers. The values are checked and an alert populates if integers are not used. Progressive Boolean conditional statements create alerts if users input integers outside the scope of the app.

The "generateNumbers" function generates an array. A for-loop is used to generated integers at the user-inputted starting value (startValue) to the ending value (endValue). Numbers are returned.

Finally, the "displayNumbers" function creates a string of the results. Another for-loop is used to determine odds or evens using the modulo operator (%). Bold weight and a custom color is assigned to the even integers using a CSS element. The "results" variable then feeds the integers into the table on the page.