Calculator/script.js at main · tazsq/Calculator · GitHub

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
106
107
108
109
110
111
112
113
114
115
"use strict";
const display = document.querySelector(".display");
const numbers = document.querySelectorAll(".number");
const ac = document.querySelector(".AC");
const ops = document.querySelectorAll(".op");
const ans = document.querySelector(".answer");
const mod = document.querySelector(".mod");
const del = document.querySelector(".DEL");
display.textContent = "";
let display__number = "0";
let eqn = "0";
const opIsActive = function () {
  let opsArray = Array.from(ops);
  if (opsArray.some((op) => op.classList.contains("btn-active"))) return true;
  else return false;
};
const deactivateOP = function () {
  ops.forEach((op) => {
    op.classList.remove("btn-active");
  });
  ans.classList.remove("btn-active");
};
const displayNumbers = function () {
  numbers.forEach((number) => {
    number.addEventListener("click", (e) => {
      deactivateOP();
      const val = e.target.textContent;

      if (val === "." && display__number.includes(".")) return;
      if (display__number === "0" && val === "0") return;

      if (display__number === "0" && val !== ".") {
        display__number = val;
      } else {
        display__number += val;
      }

      eqn += val;
      display.textContent = display__number;
    });
  });
};

displayNumbers();

ops.forEach((op) => {
  op.addEventListener("click", (e) => {
    display__number = "";
    if (eqn === "") {
      activateOP(op);
      return;
    }
    if (opIsActive()) {
      eqn = eqn.slice(0, -1);
    }
    activateOP(op);
    eqn += e.target.dataset.operator;
    console.log(eqn);
  });
});

const clear = function () {
  display.textContent = "";
  display__number = "0";
  eqn = "0";
  deactivateOP();
};
ac.addEventListener("click", () => {
  clear();
});
const activateOP = function (op) {
  deactivateOP();
  op.classList.add("btn-active");
};

ans.addEventListener("click", () => {
  deactivateOP();
  activateOP(ans);

  if (["/", "*", "+", "-"].includes(eqn.charAt(eqn.length - 1))) {
    eqn = eqn.slice(0, -1);
  }
  if (eqn.charAt(0) === "0" && eqn.charAt(1) !== ".") {
    eqn = eqn.slice(1, eqn.length);
  }
  console.log(eqn);
  try {
    const result = eval(eqn);
    display__number = result.toString();
    display.textContent = display__number;
    eqn = display__number;
  } catch (error) {
    display.textContent = "ERROR";
    display__number = "0";
    eqn = "";
  }
});
mod.addEventListener("click", function (e) {
  display__number = (display__number / 100).toString();
  eqn = display__number;
  display.textContent = display__number;
});
del.addEventListener("click", function () {
  ans.classList.remove("btn-active");
  if (opIsActive()) {
    deactivateOP();
    eqn = eqn.slice(0, -2);
    console.log(eqn);
  } else {
    eqn = eqn.slice(0, -1);
  }
  display__number = display__number.slice(0, -1);
  console.log(display__number);
  display.textContent = display__number;
});