Advertisement
Guest User

Untitled

a guest
Dec 8th, 2017
1,454
0
Never
Not a member of Pastebin yet? Sign Up, it unlocks many cool features!
text 3.28 KB | None | 0 0
  1. <html>
  2. <head> </head>
  3. <style>
  4. body, div, header, h1, p, table, tr, td {
  5. margin: 0px;
  6. padding: 0px;
  7. }
  8.  
  9. header {
  10. letter-spacing: 6px;
  11. font-size: 14px;
  12. }
  13.  
  14. table {
  15. width: 100%;
  16. }
  17.  
  18. button {
  19. width: 100%;
  20. height: 50px;
  21. font-size: 18px;
  22. }
  23.  
  24. .container {
  25. margin-top: 10px;
  26. margin-left: 10px;
  27. padding: 10px;
  28. font-family: 'Times-new-roman', sans-serif;
  29. text-align: center;
  30. max-width: 400px;
  31. background-color: silver;
  32. border: 1px solid black;
  33. border-radius: 5px;
  34. }
  35.  
  36. .screen {
  37. margin-top: 10px;
  38. margin-bottom: 10px;
  39. padding: 10px;
  40. background-color: #bccd95;
  41. color: white;
  42. text-align: right;
  43. font-family: 'Prompt', sans-serif;
  44. }
  45. </style>
  46.  
  47. <body>
  48. <div class="container">
  49. <header></header>
  50. <div class="screen">
  51. <h1 id="mainScreen">0</h1>
  52. </div>
  53. <table>
  54. <tr>
  55. <td><button value="7" id="7" onclick="InputSymbol(7)">7</button></td>
  56. <td><button value="8" id="8" onclick="InputSymbol(8)">8</button></td>
  57. <td><button value="9" id="9" onclick="InputSymbol(9)">9</button></td>
  58. <td><button onclick="DeleteLastSymbol()">c</button></td>
  59. </tr>
  60. <tr>
  61. <td><button value="4" id="4" onclick="InputSymbol(4)">4</button></td>
  62. <td><button value="5" id="5" onclick="InputSymbol(5)">5</button></td>
  63. <td><button value="6" id="6" onclick="InputSymbol(6)">6</button></td>
  64. <td><button value="/" id="104" onclick="InputSymbol(104)">/</button></td>
  65. </tr>
  66. <tr>
  67. <td><button value="1" id="1" onclick="InputSymbol(1)">1</button></td>
  68. <td><button value="2" id="2" onclick="InputSymbol(2)">2</button></td>
  69. <td><button value="3" id="3" onclick="InputSymbol(3)">3</button></td>
  70. <td><button value="*" id="103" onclick="InputSymbol(103)">*</button></td>
  71. </tr>
  72. <tr>
  73. <td colspan="2"><button value="0" id="0" onclick="InputSymbol(0)">0</button></td>
  74. <td><button value="-" id="102" onclick="InputSymbol(102)">-</button></td>
  75. <td><button value="+" id="101" onclick="InputSymbol(101)">+</button></td>
  76. </tr>
  77. <tr>
  78. <td colspan="2"><button onclick="ClearScreen()">clear</button></td>
  79. <td colspan="2"><button onclick="CalculateTotal()">=</button></td>
  80. </tr>
  81. </table>
  82. </div>
  83. </body>
  84. <script>
  85. var number = "",
  86. total = 0,
  87. regexp = /[0-9]/,
  88. mainScreen = document.getElementById("mainScreen");
  89.  
  90. // * irasyti simboli
  91. function InputSymbol(num) {
  92. var cur = document.getElementById(num).value;
  93. var prev = number.slice(-1);
  94.  
  95. if (!regexp.test(prev) && !regexp.test(cur)) {
  96. console.log("Dvieju skaiciavimu atlikti negalima ;)");
  97. return;
  98. }
  99. number = number.concat(cur);
  100. mainScreen.innerHTML = number;
  101. }
  102.  
  103. // * skaiciuoti visus
  104. function CalculateTotal() {
  105.  
  106. total = (Math.round(eval(number) * 100) / 100);
  107. mainScreen.innerHTML = total;
  108. }
  109.  
  110. // * istrinti paskutini simboli
  111. function DeleteLastSymbol() {
  112. if (number) {
  113. number = number.slice(0, -1);
  114. mainScreen.innerHTML = number;
  115. }
  116. if (number.length === 0) {
  117. mainScreen.innerHTML = "0";
  118. }
  119. }
  120.  
  121.  
  122. // * isvalyti
  123. function ClearScreen() {
  124. number = "";
  125. mainScreen.innerHTML = 0;
  126. }
  127. </script>
  128.  
  129. </html>
Advertisement
Add Comment
Please, Sign In to add comment
Advertisement