Skip to content

Commit

Permalink
Initial commit
Browse files Browse the repository at this point in the history
  • Loading branch information
admin3 committed Oct 4, 2018
0 parents commit 0f4e8e4
Show file tree
Hide file tree
Showing 4 changed files with 113 additions and 0 deletions.
2 changes: 2 additions & 0 deletions .gitattributes
Original file line number Diff line number Diff line change
@@ -0,0 +1,2 @@
# Auto detect text files and perform LF normalization
* text=auto
39 changes: 39 additions & 0 deletions calc.html
Original file line number Diff line number Diff line change
@@ -0,0 +1,39 @@
<head>
<link rel='stylesheet' href="calcstyle.css"></link>
</head>
<body>
<div id='container'>
<div id='table'>
<input type='text' disabled="disabled">
</div>
<div id='row1'>
<div class='digit' id="1">1</div>
<div class='digit' id="2">2</div>
<div class='digit' id="3">3</div>
</div>
<div id='row2'>
<div class='digit' id="4">4</div>
<div class='digit' id="5">5</div>
<div class='digit' id="6">6</div>
</div>
<div id='row3'>
<div class='digit' id="7">7</div>
<div class='digit' id="8">8</div>
<div class='digit' id="9">9</div>
</div>
<div id='row4'>
<div class='digit' id="0">0</div>
<div class='digit' id="plus">+</div>
<div class='digit' id="minus">-</div>
</div>
<div id='row5'>
<div class='digit' id="divide">/</div>
<div class='digit' id="multiple">*</div>
<div class='digit' id="percent">%</div>
</div>
<div id='row6'>
<div class='digit' id="result">=</div>
</div>
</div>
<script src='calcscript.js'></script>
</body>
35 changes: 35 additions & 0 deletions calcscript.js
Original file line number Diff line number Diff line change
@@ -0,0 +1,35 @@
function clickInput() {
document.getElementsByTagName('input')[0].value += this.innerHTML;
}

function calculate() {
value = eval(document.getElementsByTagName('input')[0].value);
if (isNaN(value) || value == Infinity) {
value = 'Error!';
document.getElementsByTagName('input')[0].style.backgroundColor = '#F08080';
}
document.getElementsByTagName('input')[0].value = value;
}

function clear() {
document.getElementsByTagName('input')[0].value = '';
document.getElementsByTagName('input')[0].style.backgroundColor = '#B0E0E6';
}

//var buttons = document.getElementsByClassName('digit');

document.getElementById('1').addEventListener('click', clickInput);
document.getElementById('2').addEventListener('click', clickInput);
document.getElementById('3').addEventListener('click', clickInput);
document.getElementById('4').addEventListener('click', clickInput);
document.getElementById('5').addEventListener('click', clickInput);
document.getElementById('6').addEventListener('click', clickInput);
document.getElementById('7').addEventListener('click', clickInput);
document.getElementById('8').addEventListener('click', clickInput);
document.getElementById('9').addEventListener('click', clickInput);
document.getElementById('0').addEventListener('click', clickInput);
document.getElementById('plus').addEventListener('click', clickInput);
document.getElementById('minus').addEventListener('click', clickInput);
document.getElementById('divide').addEventListener('click', clickInput);
document.getElementById('multiple').addEventListener('click', clickInput);
document.getElementById('result').addEventListener('click', calculate);
37 changes: 37 additions & 0 deletions calcstyle.css
Original file line number Diff line number Diff line change
@@ -0,0 +1,37 @@
#container {
width: 310px;
position: fixed;
top: 50%;
left: 50%;
transform: translate(-50%, -50%);
}

.digit {
display: inline-block;
height: 100px;
width: 100px;
background-color: #FFFFE0;
font-size: 50;
font-family: "Segoe UI";
font-weight: 600;
text-align: center;
line-height: 100px;
margin-bottom: 5px;
cursor: pointer;
}

#result {
height: 100px;
width: 310px;
}

input {
width: 100%;
height: 40px;
background-color: #B0E0E6;
margin-bottom: 10px;
text-align: right;
font-size: 35;
font-family: "Segoe UI";
font-weight: 600;
}

0 comments on commit 0f4e8e4

Please sign in to comment.