Problem2 - Even Fibonacci Numbers.html

<html>
<head>
<title>Project Euler, Problem 2: Even Fibonacci Numbers</title>
<style>
  #explanation {
    visibility: hidden;
  }

  #problem {
    text-align: center;
    border: 2px solid black;
    border-radius: 5px;
    width: 85px;
    cursor: default;
  }
</style>
</head>
<body>

  <p>
    Each new term in the Fibonacci sequence is generated by adding the previous two terms. </br>
    By starting with 1 and 2, the first 10 terms will be:
    1, 2, 3, 5, 8, 13, 21, 34, 55, 89, ...
    </br></br>
    By considering the terms in the Fibonacci sequence whose values do not exceed four million, find the sum of the even-valued terms.
  </p>

  <div id="problem" onclick="projectEulerProblem2()">
    Even Sums
  </div>

  <div id="explanation">
  </br>
    <div id="totalTime"></div>
    <p>
      To solve this, I used a while loop that incremented Fibonacci numbers that stopped after my Fibonacci number reached 4,000,000.
      </br></br>
      If the number mod 2 was equal to 0 (even number) I added the value of that number to a "sum" variable.</br>
    </p>
  </div>

</body>
<script>

var sum = 0;
var counter = 0;
var fib1 = 0;
var fib2 = 1;
var fibonacci = 0;
function projectEulerProblem2() {
  var startTime = new Date();
  while (fibonacci < 4000000) {
    counter++;
    fibonacci = fib1 + fib2;
    fib2 = fib1;
    fib1 = fibonacci;
    if ((fibonacci % 2) === 0) {
      sum += fibonacci;
      console.log(counter + " " + fibonacci);
    }
  }
  var endTime = new Date();
  var totalTime = endTime - startTime;
  document.getElementById("problem").innerHTML = sum
  document.getElementById("totalTime").innerHTML = totalTime + " ms";
  document.getElementById("problem").style.cursor = "auto";
  document.getElementById("explanation").style.visibility = "visible";
}
</script>
</html>