Skip to content

Commit 4f10dda

Browse files
committed
first change
1 parent 00c4b55 commit 4f10dda

File tree

3 files changed

+194
-4
lines changed

3 files changed

+194
-4
lines changed

bjs/07_Number_and_string/index.html

Lines changed: 69 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -15,11 +15,79 @@
1515
<div class="form-group">
1616
<div class="card" id="calc">
1717
<div class="card-body">
18+
<div class="row no-gutters">
19+
<input class="form-control input-window" id="display">
20+
</div>
1821
<input class="form-control input-window" id="inputWindow" value="">
1922
<div class="row no-gutters">
20-
<div class="col">
23+
<div class="col buttonC">
2124
<button class="btn btn-outline-danger form-control" id="btn_clr">C</button>
2225
</div>
26+
</div>
27+
<div class="row no-gutters">
28+
<div class="col">
29+
<button class="btn btn-outline-primary form-control" id="btn_1">1</button>
30+
</div>
31+
<div class="col">
32+
<button class="btn btn-outline-primary form-control" id="btn_2">2</button>
33+
</div>
34+
<div class="col">
35+
<button class="btn btn-outline-primary form-control" id="btn_3">3</button>
36+
</div>
37+
<div class="col">
38+
<button class="btn btn-outline-primary form-control" id="btn_plus">+</button>
39+
</div>
40+
</div>
41+
<div class="row no-gutters">
42+
<div class="col">
43+
<button class="btn btn-outline-primary form-control" id="btn_4">4</button>
44+
</div>
45+
<div class="col">
46+
<button class="btn btn-outline-primary form-control" id="btn_5">5</button>
47+
</div>
48+
<div class="col">
49+
<button class="btn btn-outline-primary form-control" id="btn_6">6</button>
50+
</div>
51+
<div class="col">
52+
<button class="btn btn-outline-primary form-control" id="btn_minus">-</button>
53+
</div>
54+
</div>
55+
<div class="row no-gutters">
56+
<div class="col">
57+
<button class="btn btn-outline-primary form-control" id="btn_7">7</button>
58+
</div>
59+
<div class="col">
60+
<button class="btn btn-outline-primary form-control" id="btn_8">8</button>
61+
</div>
62+
<div class="col">
63+
<button class="btn btn-outline-primary form-control" id="btn_9">9</button>
64+
</div>
65+
<div class="col">
66+
<button class="btn btn-outline-primary form-control" id="btn_times">*</button>
67+
</div>
68+
</div>
69+
<div class="row no-gutters">
70+
<div class="col">
71+
<button class="btn btn-outline-primary form-control" id="btn_0">0</button>
72+
</div>
73+
<div class="col">
74+
<button class="btn btn-outline-primary form-control" id="btn_diveded">/</button>
75+
</div>
76+
<div class="col">
77+
<button class="btn btn-outline-primary form-control" id="btn_root">sqrt</button>
78+
</div>
79+
<div class="col">
80+
<button class="btn btn-outline-primary form-control" id="btn_calc">=</button>
81+
</div>
82+
</div>
83+
<div class="row no-gutters">
84+
<div class="col">
85+
<button class="btn btn-outline-primary form-control" id="btn_minusNumber">-N</button>
86+
</div>
87+
<div class="col">
88+
<button class="btn btn-outline-primary form-control" id="btn_realNumber">.</button>
89+
</div>
90+
</div>
2391
</div>
2492
</div>
2593
</div>

bjs/07_Number_and_string/script.js

Lines changed: 99 additions & 3 deletions
Original file line numberDiff line numberDiff line change
@@ -1,12 +1,108 @@
11
let lastOperand = 0;
22
let operation = null;
33

4+
const display = document.getElementById('display');
45
const inputWindow = document.getElementById('inputWindow');
56

6-
77
document.getElementById('btn_clr').addEventListener('click', function () {
88
lastOperand = 0;
99
operation = null;
10-
inputWindow.value = '';
11-
})
10+
inputWindow.value = 0;
11+
});
12+
13+
function number(n){return document.getElementById('btn_'+n).addEventListener('click', function () {
14+
inputWindow.value +=n;
15+
inputWindow.value = parseInt(inputWindow.value, 10)})
16+
};
17+
18+
number (0);
19+
number (1);
20+
number (2);
21+
number (3);
22+
number (4);
23+
number (5);
24+
number (6);
25+
number (7);
26+
number (8);
27+
number (9);
28+
29+
document.getElementById('btn_plus').addEventListener('click', function () {
30+
lastOperand = parseFloat(inputWindow.value);
31+
operation = "plus";
32+
inputWindow.value = 0;
33+
});
34+
document.getElementById('btn_minus').addEventListener('click', function () {
35+
lastOperand = parseFloat(inputWindow.value);
36+
operation = "minus";
37+
inputWindow.value = 0;
38+
});
39+
document.getElementById('btn_times').addEventListener('click', function () {
40+
lastOperand = parseFloat(inputWindow.value);
41+
operation = "times";
42+
inputWindow.value = 0;
43+
});
44+
document.getElementById('btn_diveded').addEventListener('click', function () {
45+
lastOperand = parseFloat(inputWindow.value);
46+
operation = "diveded";
47+
inputWindow.value = 0;
48+
});
49+
document.getElementById('btn_root').addEventListener('click', function () {
50+
lastOperand = parseFloat(inputWindow.value);
51+
operation = "root";
52+
inputWindow.value = "sqrt("+ lastOperand+")";
53+
});
54+
document.getElementById('btn_realNumber').addEventListener('click', function () {
55+
lastOperand = parseFloat(inputWindow.value);
56+
operation = "realNumber";
57+
inputWindow.value = lastOperand/10;
58+
});
59+
document.getElementById('btn_minusNumber').addEventListener('click', function () {
60+
lastOperand = parseFloat(inputWindow.value);
61+
operation = "minusNumber";
62+
inputWindow.value = -lastOperand;
63+
});
64+
65+
document.getElementById('btn_calc').addEventListener('click', function () {
66+
if (operation === "plus"){
67+
const result1= lastOperand + "+" + parseFloat(inputWindow.value);
68+
const result= lastOperand + parseFloat(inputWindow.value);
69+
operation - null;
70+
lastOperand = 0;
71+
inputWindow.value = result;
72+
display.value = result1+ "=" + result;
73+
}
74+
if (operation === "minus"){
75+
const result1= lastOperand + "-" + parseFloat(inputWindow.value);
76+
const result= lastOperand - parseFloat(inputWindow.value);
77+
operation - null;
78+
lastOperand = 0;
79+
inputWindow.value = result;
80+
display.value = result1+ "=" + result;
81+
}
82+
if (operation === "times"){
83+
const result1= lastOperand + "*" + parseFloat(inputWindow.value);
84+
const result= lastOperand * parseFloat(inputWindow.value);
85+
operation - null;
86+
lastOperand = 0;
87+
inputWindow.value = result;
88+
display.value = result1+ "=" + result; }
89+
if (operation === "diveded"){
90+
const result1= lastOperand + "/" + parseFloat(inputWindow.value);
91+
const result= lastOperand / parseFloat(inputWindow.value);
92+
operation - null;
93+
lastOperand = 0;
94+
inputWindow.value = result;
95+
display.value = result1+ "=" + result;
96+
}
97+
if (operation === "root"){
98+
const result1="sqrt("+ lastOperand+")";
99+
const result= Math.sqrt(lastOperand);
100+
operation - null;
101+
lastOperand = 0;
102+
inputWindow.value = result;
103+
display.value = result1+ "=" + result;
104+
}
105+
});
106+
107+
12108

bjs/07_Number_and_string/style.css

Lines changed: 26 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -7,3 +7,29 @@
77
text-align: end;
88
font-size: x-large;
99
}
10+
11+
.row > input {
12+
background-color: DarkGray;
13+
color: azure;
14+
}
15+
16+
.card-body {
17+
background-color: BurlyWood;
18+
}
19+
20+
.col> button {
21+
background-color: Skyblue;
22+
color: black;
23+
}
24+
25+
.col {
26+
margin: 5px;
27+
}
28+
29+
.buttonC > button {
30+
background-color: Chocolate;
31+
}
32+
33+
input {
34+
margin: 5px 0;
35+
}

0 commit comments

Comments
 (0)