iPoints Web

by pphheerroonn

HTML

<div id="totalPointsWindow">0</div>
<div id="page1">
  <form id="calc">
    <button type="button" form="calc" value="A1" onclick="addGrade('A1')">A1</button>
    <button type="button" form="calc" value="A2" onclick="addGrade('A2')">A2</button>
    <br>
    <button type="button" form="calc" value="B1">B1</button>
    <button type="button" form="calc" value="B2">B2</button>
    <button type="button" form="calc" value="B3">B3</button>
    <br>
    <button type="button" form="calc" value="C1">C1</button>
    <button type="button" form="calc" value="C2">C2</button>
    <button type="button" form="calc" value="C3">C3</button>
    <br>
    <button type="button" form="calc" value="D1">D1</button>
    <button type="button" form="calc" value="D2">D2</button>
    <button type="button" form="calc" value="D3">D3</button>
    <br>
    <button type="button" form="calc" value="Reset" onclick="resetValues()">---Reset---</button>
  </form>
</div>

JavaScript

var A1 = parseInt("100");
var A2 = parseInt("85");
var B1 = parseInt("70");
var B2 = parseInt("55");
var B3 = parseInt("40");
var C1 = parseInt("30");
var C2 = parseInt("30");

var currentPoints = 0;
var grades = [];
var gradeNumber = 0;

document.getElementById("totalPointsWindow").innerHTML = "00";

function addGrade(value) {
  //document.getElementById("totalPointsWindow").innerHTML = value;
  grades[gradeNumber] = value;
  value++;
  calcPoints(grades);
  updateDisplay(currentPoints);
  localStorage.setItem("grades", JSON.stringify(grades));
}

function calcPoints(pointsArray) {
  for (i = 0; i < pointsArray.length; i++) {
    currentPoints += pointsArray[i];
    console.log(currentPoints)
  }
}

function updateDisplay(newValue) {
  document.getElementById("totalPointsWindow").innerHTML = newValue;
}
function resetValues() {
  grades = []; //Not actually resetting display.
  updateDisplay("000");
}


var storedGrades = JSON.parse(localStorage.getItem("grades"));