commit 89dfd0f3120e65e658b596519efbe7a6b80464ce
parent 1225292ac1b190a12a52aac5313d7b5888241c2f
Author: therealFIGBERT <figbertwelner@gmail.com>
Date: Sun, 22 Sep 2019 10:50:59 -0700
Rudimentary size calculator, homescreen graphical overhaul, mild miscellaneous graphical changes
Diffstat:
5 files changed, 153 insertions(+), 21 deletions(-)
diff --git a/index.html b/index.html
@@ -15,10 +15,23 @@
<h1 class="pagetitle">FIGBERT Math</h1>
<h2 class="pagetitle pagetitle__sub">Homework is for Pussies</h2>
</header>
- <div class="linklist">
- <a href="matrix/" class="linklist__item">Subsequent Equation Solver</a>
- <a href="consecutiveNum/" class="linklist__item">Consecutive Number Solver</a>
- </div>
+ <table>
+ <tr>
+ <th class="table__color">Algebra</th>
+ <th class="table__color">Geometry</th>
+ <th class="table__color">Physics</th>
+ </tr>
+ <tr>
+ <td><a href="matrix" class="table__color">Simultaneous Equation Solver</a></td>
+ <td></td>
+ <td><a href="sizecalc/" class="table__color">Size Calculator</a></td>
+ </tr>
+ <tr>
+ <td><a href="consecutiveNum/" class="table__color">Consecutive Number Solver</a></td>
+ <td></td>
+ <td></td>
+ </tr>
+ </table>
<footer>
<a href="about/" class="footer__text">About</a>
<span class="footer__text">•</span>
diff --git a/main.css b/main.css
@@ -23,19 +23,20 @@ header {
font-size: calc(20px + 0.25vw);
}
-.linklist {
- display: flex;
- flex-direction: column;
- align-items: center;
- padding-top: 20px;
+table {
+ font-size: calc(15px + 0.2vw);
+ border: 1px solid #ACA0B2;
+ width: 100%;
+ border-collapse: collapse;
+ margin-top: 50px;
}
-.linklist__item {
+td {
+ border: 1px solid #ACA0B2;
+}
+
+.table__color {
color: #ACA0B2;
- font-size: calc(15px + 0.20vw);
- flex-grow: 1;
- padding-top: 10px;
- padding-bottom: 10px;
}
.numinput {
@@ -45,17 +46,17 @@ header {
width: 3%;
}
+.numinput--large {
+ width: 5%;
+}
+
main {
margin-top: 10px;
color: #ACA0B2;
border-color: #ACA0B2;
}
-#equations {
- display: none;
-}
-
-#out {
+.hidden {
display: none;
}
diff --git a/matrix/index.html b/matrix/index.html
@@ -20,7 +20,7 @@
<label for="four"><input id="four" type="radio" name="eqSet" value="4">Four equations, four variables</label><br>
<input type="button" value="Set" onclick="setUpMatrix(eqSet.value)">
</fieldset>
- <fieldset id="equations">
+ <fieldset id="equations" class="hidden">
<legend>Set the equation values</legend>
<div>
<label for="wOne" class="w"><input id="wOne" type="number" name="setOne" class="numinput w a" step="0.01">w</label>
@@ -53,7 +53,7 @@
<input type="button" value="Solve" onclick="solveMatrix(eqSet.value)">
</fieldset>
</form>
- <div id="out">
+ <div id="out" class="hidden">
<h3 id="titleOne">First Line:</h3>
<p id="outOne"></p>
<h3 id="titleTwo">Second Line:</h3>
diff --git a/sizecalc/index.html b/sizecalc/index.html
@@ -0,0 +1,52 @@
+<!DOCTYPE html>
+
+<html>
+ <head>
+ <title>FIGBERT Math – Size Calculator</title>
+ <meta charset="utf-8">
+ <link rel=stylesheet href="../main.css" type="text/css">
+ <script type="text/javascript" src="sizecalc.js" async></script>
+ </head>
+ <body>
+ <header>
+ <h1 class="pagetitle">Size Calculator</h1>
+ <h2 class="pagetitle pagetitle__sub">by FIGBERT</h2>
+ </header>
+ <main>
+ <form>
+ <fieldset>
+ <legend>Select mode</legend>
+ <label for="angSize"><input id="angSize" type="radio" name="modeSelect" value="a">Angular Size (𝛼)</label><br>
+ <label for="realSize"><input id="realSize" type="radio" name="modeSelect" value="D">Real Size (D)</label><br>
+ <label for="distance"><input id="distance" type="radio" name="modeSelect" value="d">Distance (d)</label><br>
+ <input type="button" value="Select" onclick="setUp(modeSelect.value)">
+ </fieldset>
+ <fieldset class="hidden" id="sizeIn">
+ <legend>Input values</legend>
+ <div class="ins D d">
+ <label for="angVal">𝛼 = </label>
+ <input id="angVal" type="number" name="inVal" step="0.1" class="numinput numinput--large"><br>
+ </div>
+ <div class="ins a d">
+ <label for="sizeVal">D = </label>
+ <input id="sizeVal" type="number" name="inVal" step="0.1" class="numinput numinput--large"><br>
+ </div>
+ <div class="ins a D">
+ <label for="distVal">d = </label>
+ <input id="distVal" type="number" name="inVal" step="0.1" class="numinput numinput--large"><br>
+ </div>
+ <input type="button" value="Solve" onclick="actionManager(angVal.value, sizeVal.value, distVal.value)">
+ </fieldset>
+ </form>
+ </main>
+ <footer>
+ <a href="../" class="footer__text">Home</a>
+ <span class="footer__text">•</span>
+ <a href="../about/" class="footer__text">About</a>
+ <span class="footer__text">•</span>
+ <a href="../requests/" class="footer__text">Request New Program</a>
+ <span class="footer__text">•</span>
+ <a href="../submit/" class="footer__text">Submit Code</a>
+ </footer>
+ </body>
+</html>
+\ No newline at end of file
diff --git a/sizecalc/sizecalc.js b/sizecalc/sizecalc.js
@@ -0,0 +1,64 @@
+var type;
+
+function show(elements) {
+ "use strict";
+ for (var a = 0; a < elements.length; a++) {
+ elements[a].style.display = "inline";
+ }
+}
+
+function hide(elements) {
+ "use strict";
+ for (var a = 0; a < elements.length; a++) {
+ elements[a].style.display = "none";
+ }
+}
+
+function reset(elements) {
+ "use strict";
+ for (var a = 0; a < elements.length; a++) {
+ elements[a].value = "null";
+ }
+}
+
+function setUp(selection) {
+ "use strict";
+ type = selection;
+ console.log(type);
+ document.getElementById("sizeIn").style.display = "block";
+ hide(document.getElementsByClassName("ins"));
+ reset(document.getElementsByClassName("numinput"));
+ if (type === "a") {
+ show(document.getElementsByClassName("a"));
+ } else if (type === "D") {
+ show(document.getElementsByClassName("D"));
+ } else {
+ show(document.getElementsByClassName("d"));
+ }
+}
+
+function angularSize(size, distance) {
+ "use strict";
+ return (180 * size) / (3.14 * distance);
+}
+
+function realSize(angle, distance) {
+ "use strict";
+ return (angle * 3.14 * distance) / 180;
+}
+
+function calcDistance(size, angle) {
+ "use strict";
+ return (180 * size) / (3.14 * angle);
+}
+
+function actionManager(angle, size, distance) {
+ "use strict";
+ if (type === "a") {
+ console.log(angularSize(size, distance));
+ } else if (type === "D") {
+ console.log(realSize(angle, distance));
+ } else {
+ console.log(calcDistance(size, angle));
+ }
+}
+\ No newline at end of file
