-
Notifications
You must be signed in to change notification settings - Fork 13
Commit
This commit does not belong to any branch on this repository, and may belong to a fork outside of the repository.
Merge pull request #54 from beyluta/development
Development
- Loading branch information
Showing
21 changed files
with
532 additions
and
53 deletions.
There are no files selected for viewing
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| Original file line number | Diff line number | Diff line change |
|---|---|---|
| @@ -0,0 +1,212 @@ | ||
| <!-- Sample HTML Template made for the Open-Source software WinWidgets --> | ||
| <style> | ||
| @import url("https://fonts.googleapis.com/css2?family=Jaldi&display=swap"); | ||
|
|
||
| body, | ||
| html { | ||
| background: rgb(19, 19, 19); | ||
| display: flex; | ||
| justify-content: center; | ||
| align-items: center; | ||
| font-family: Jaldi, sans-serif, monospace; | ||
| overflow: hidden; | ||
| user-select: none; | ||
| -moz-user-select: none; | ||
| } | ||
|
|
||
| .calculator-body { | ||
| display: flex; | ||
| flex-direction: column; | ||
| gap: 8px; | ||
| width: 360px; | ||
| z-index: 1; | ||
| font-weight: semibold; | ||
| } | ||
|
|
||
| .buttons { | ||
| display: flex; | ||
| flex-direction: row; | ||
| gap: 8px; | ||
| } | ||
|
|
||
| .button { | ||
| display: flex; | ||
| justify-content: center; | ||
| align-items: center; | ||
| background: black; | ||
| opacity: 0.8; | ||
| color: white; | ||
| padding: 10px 0; | ||
| width: 0.5rem; | ||
| border-radius: 10px; | ||
| flex: 1 1 10px; | ||
| transition: background-color 0.1s ease-in-out, border 0.1s ease-in-out; | ||
| cursor: pointer; | ||
| border: 1px solid black; | ||
| } | ||
|
|
||
| .button:hover { | ||
| background-color: rgb(19, 19, 19); | ||
| border: 1px solid rgb(209, 67, 15); | ||
| } | ||
|
|
||
| .display { | ||
| background: black; | ||
| opacity: 0.8; | ||
| color: white; | ||
| width: 100%; | ||
| padding: 20px; | ||
| border-radius: 10px; | ||
| min-height: 20px; | ||
| display: flex; | ||
| align-items: center; | ||
| } | ||
|
|
||
| .equals { | ||
| background: rgb(209, 67, 15); | ||
| } | ||
| </style> | ||
|
|
||
| <script> | ||
| var isMouseOverDOM = false; | ||
|
|
||
| var keyPressTime = new Date(); | ||
|
|
||
| var toExec = " "; | ||
|
|
||
| var expressionRegistry = { | ||
| "tan(":"Math.tan(", | ||
| "sin(":"Math.sin(", | ||
| "cos(":"Math.cos(", | ||
| "deg":"*Math.PI/180", | ||
| "ln(":"Math.log(", | ||
| "lg(":"Math.log10(", | ||
| "^":"**", | ||
| "°":"*Math.PI*180", | ||
| "rad":"*180/Math.PI", | ||
| "e":"Math.E", | ||
| "π":"Math.PI", | ||
| "abs(":"Math.abs(", | ||
| "^3":"**3", | ||
| "^-1":"**-1", | ||
| "√(":"Math.sqrt(", | ||
| "%":"/100" | ||
| }; | ||
|
|
||
| document.addEventListener('mouseover', () => isMouseOverDOM = true); | ||
|
|
||
| document.addEventListener('mouseout', () => isMouseOverDOM = false); | ||
|
|
||
| function onClear() { | ||
| document.getElementById("calculation").innerText = ""; | ||
| toExec = ""; | ||
| document.getElementById("toExec").innerText = toExec; | ||
| } | ||
|
|
||
| function onEqualsClicked() { | ||
| const calc = document.getElementById("calculation"); | ||
| calc.innerText = eval(toExec); | ||
| toExec = calc.innerText; | ||
| } | ||
|
|
||
| function onButtonClicked(e) { | ||
| document.getElementById("calculation").innerText += e; | ||
| toExec += e; | ||
| //document.getElementById("toExec").innerText = toExec; | ||
| } | ||
|
|
||
| function onSpecialClicked(e){ | ||
| document.getElementById("calculation").innerText += e; | ||
| toExec += expressionRegistry[e]; | ||
| //document.getElementById("toExec").innerText = toExec; | ||
| } | ||
|
|
||
| function onNativeKeyEvents(key) { | ||
| /* | ||
| ** 1- Checking if the input type is a keyboard event | ||
| ** 2- Checking if the time between the last key press and the current one is greater than 150ms | ||
| ** 3- Checking if the mouse is over the DOM | ||
| */ | ||
| if (key.eventType == "keyboardEvent" && (new Date() - keyPressTime) > 150 && isMouseOverDOM) { | ||
| //Getting the key code | ||
| var code = parseInt(key.keycode); | ||
| // Just input validation | ||
| if ((code >= 40 && code <= 43)||(code >= 47 && code <= 57)) { | ||
| const char = String.fromCharCode(parseInt(key.keycode)); | ||
| keyPressTime = new Date(); | ||
| onButtonClicked(char); | ||
| } | ||
| } | ||
| } | ||
|
|
||
|
|
||
|
|
||
| </script> | ||
|
|
||
| <!DOCTYPE html> | ||
| <html> | ||
| <head> | ||
| <meta name="applicationTitle" content="Calculator" /> | ||
| <meta name="windowSize" content="450 500" />x | ||
| <meta name="windowBorderRadius" content="10" /> | ||
| <meta name="previewSize" content="450 400" /> | ||
| <meta name="windowOpacity" content="240" /> | ||
| </head> | ||
| <body> | ||
| <div class="calculator-body"> | ||
| <div class="display" id="calculation"></div> | ||
| <div class="buttons"> | ||
| <div class="button" onclick="onSpecialClicked('abs(')">abs</div> | ||
| <div class="button" onclick="onSpecialClicked('^3')">^3</div> | ||
| <div class="button" onclick="onSpecialClicked('^-1')">^-1</div> | ||
| <div class="button" onclick="onSpecialClicked('√(')">√</div> | ||
| <div class="button" onclick="onSpecialClicked('^2')">x^2</div> | ||
| <div class="button" onclick="onSpecialClicked('^')">^x</sup></div> | ||
| </div> | ||
| <div class="buttons"> | ||
| <div class="button" onclick="onSpecialClicked('lg(')">lg</div> | ||
| <div class="button" onclick="onSpecialClicked('ln(')">ln</div> | ||
| <div class="button" onclick="onSpecialClicked('sin(')">sin</div> | ||
| <div class="button" onclick="onSpecialClicked('cos(')">cos</div> | ||
| <div class="button" onclick="onSpecialClicked('tan(')">tan</div> | ||
| <div class="button" onclick="onSpecialClicked('°')">°</div> | ||
| </div> | ||
| <div class="buttons"> | ||
| <div class="button" onclick="onSpecialClicked('asin(')">asin</div> | ||
| <div class="button" onclick="onSpecialClicked('acos(')">acos</div> | ||
| <div class="button" onclick="onSpecialClicked('atan(')">atan</div> | ||
| <div class="button" onclick="onButtonClicked('(')">(</div> | ||
| <div class="button" onclick="onButtonClicked(')')">)</div> | ||
| <div class="button" onclick="onSpecialClicked('rad')">rad</div> | ||
| </div> | ||
| <div class="buttons"> | ||
| <div class="button" onclick="onButtonClicked('7')">7</div> | ||
| <div class="button" onclick="onButtonClicked('8')">8</div> | ||
| <div class="button" onclick="onButtonClicked('9')">9</div> | ||
| <div class="button" onclick="onSpecialClicked('%')">%</div> | ||
| <div class="button" onclick="onClear()">C</div> | ||
| </div> | ||
| <div class="buttons"> | ||
| <div class="button" onclick="onButtonClicked('4')">4</div> | ||
| <div class="button" onclick="onButtonClicked('5')">5</div> | ||
| <div class="button" onclick="onButtonClicked('6')">6</div> | ||
| <div class="button" onclick="onButtonClicked('*')">*</div> | ||
| <div class="button" onclick="onButtonClicked('/')">/</div> | ||
| </div> | ||
| <div class="buttons"> | ||
| <div class="button" onclick="onButtonClicked('1')">1</div> | ||
| <div class="button" onclick="onButtonClicked('2')">2</div> | ||
| <div class="button" onclick="onButtonClicked('3')">3</div> | ||
| <div class="button" onclick="onButtonClicked('+')">+</div> | ||
| <div class="button" onclick="onButtonClicked('-')">-</div> | ||
| </div> | ||
| <div class="buttons"> | ||
| <div class="button" onclick="onButtonClicked('0')">0</div> | ||
| <div class="button" onclick="onButtonClicked('.')">.</div> | ||
| <div class="button" onclick="onButtonClicked('π')">π</div> | ||
| <div class="button" onclick="onButtonClicked('e')">e</div> | ||
| <div class="button equals" onclick="onEqualsClicked()">=</div> | ||
| </div> | ||
| </div> | ||
| </body> | ||
| </html> |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| Original file line number | Diff line number | Diff line change |
|---|---|---|
|
|
@@ -8,3 +8,4 @@ | |
| Beyluta | <[email protected]> - <https://pedroribeiro.site> - <https://github.com/beyluta> | ||
| mateuszstalmach | <https://github.com/mateuszstalmach> | ||
| EPICTROLLTOAST | <https://github.com/EPICTROLLTOAST> | ||
| Yopai | <https://github.com/Yopai> | ||
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Oops, something went wrong.