Skip to content

Commit 3014340

Browse files
5314253142
committed
asdf
1 parent c931f4c commit 3014340

10 files changed

+86
-112
lines changed

‎calculator.html

-6
Original file line numberDiff line numberDiff line change
@@ -21,12 +21,6 @@ <h1>HTML Math Website</h1>
2121
</div>
2222

2323
<br>
24-
<div id="otherresources">
25-
<a href="index.html">Calculator</a>
26-
<a href="unitconverter.html">Unit Converter</a>
27-
<a href="mathtester.html">Math Tester</a>
28-
<a href="mathjax.html">Math Formatter</a>
29-
</div>
3024
<script async src="main.js"></script>
3125
</body>
3226
</html>

‎index.html

+3-4
Original file line numberDiff line numberDiff line change
@@ -11,10 +11,9 @@
1111
<h1>JS Math Website</h1>
1212
<div id="resourcecontainer">
1313
<button class="resource" onclick="window.location.href='/calculator.html'">Calculator</button>
14-
<button class="resource">Unit Converter</button>
15-
<button class="resource">Math Tester</button>
16-
<button class="resource">Math Formatter</button>
14+
<button class="resource" onclick="window.location.href='/unitconverter.html'">Unit Converter</button>
15+
<button class="resource" onclick="window.location.href='/mathtester.html'">Math Tester</button>
16+
<button class="resource" onclick="window.location.href='/mathformatter.html'">Math Formatter</button>
1717
</div>
18-
<script src="resources.js"></script>
1918
</body>
2019
</html>

‎main.css

+4
Original file line numberDiff line numberDiff line change
@@ -3,6 +3,10 @@
33
font-weight: 600;
44
}
55

6+
html {
7+
scroll-behavior: smooth;
8+
}
9+
610
body {
711
margin: 0;
812
padding: 0;

‎mathformatter.css

+16
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,16 @@
1+
#mathoutput {
2+
border: 1px solid black;
3+
padding: 10px;
4+
margin: 10px;
5+
}
6+
7+
#mathinput {
8+
text-align: center;
9+
font-size: 20px;
10+
background-color: lightgray;
11+
width: 50%;
12+
height: 20vh;
13+
border: 2px solid rgb(61, 61, 61);
14+
padding: 10px;
15+
margin: 10px;
16+
}

‎mathformatter.html

+25
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,25 @@
1+
<!DOCTYPE html>
2+
<html lang="en">
3+
<head>
4+
<meta charset="UTF-8">
5+
<meta name="viewport" content="width=device-width, initial-scale=1.0">
6+
<title>MathJax</title>
7+
<link rel="stylesheet" href="main.css">
8+
<link rel="stylesheet" href="mathformatter.css">
9+
<script type="text/javascript" id="MathJax-script" async src="https://cdn.jsdelivr.net/npm/mathjax@3/es5/tex-mml-chtml.js">
10+
</script>
11+
</head>
12+
<body>
13+
<p id="mathoutput">Enter your math expressions below to display here. For example:<br>$$a^2+b^2=c^2$$</p>
14+
<select title="Autoformat" id="autoformat">
15+
<option value="True">True</option>
16+
<option value="False">False</option>
17+
</select>
18+
<p>Enter MaxJax Input</p>
19+
<textarea id="mathinput" placeholder="Enter a math expression here"></textarea>
20+
21+
<p>Helpful <a href="https://math.meta.stackexchange.com/questions/5020/mathjax-basic-tutorial-and-quick-reference" rel="noopener" target="_blank" >Guide</a></p>
22+
23+
<script src="mathformatter.js"></script>
24+
</body>
25+
</html>

‎mathformatter.js

+31
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,31 @@
1+
let autoformat = true;
2+
document.getElementById("autoformat").addEventListener("change", function() {
3+
if (document.getElementById("autoformat").value == "True") {
4+
autoformat = true;
5+
} else {
6+
autoformat = false;
7+
}
8+
});
9+
10+
document.getElementById("mathinput").addEventListener("input", function() {
11+
var math = document.getElementById("mathinput").value;
12+
const default_output = "Enter your math expressions below to display here. For example:\n$$a^2+b^2=c^2$$";
13+
14+
// Check if beginning of math expression and end of math expression contain $$, if not, add them
15+
if (math !== "" && math !== "\\" && math !== null && autoformat) {
16+
if (math.substring(0, 2) !== "$$") {
17+
math = "$$" + math;
18+
}
19+
if (math.substring(math.length - 2) !== "$$") {
20+
math = math + "$$";
21+
}
22+
}
23+
24+
// Show default output
25+
if (math == "" || math === null) {
26+
math = default_output;
27+
}
28+
29+
document.getElementById("mathoutput").innerHTML = math;
30+
MathJax.typeset();
31+
});

‎mathjax.html

-85
This file was deleted.

‎mathtester.html

-7
Original file line numberDiff line numberDiff line change
@@ -34,13 +34,6 @@
3434
</div>
3535
<button id="start">Start</button>
3636
</div>
37-
<br>
38-
<div id="otherresources">
39-
<a href="index.html">Calculator</a>
40-
<a href="unitconverter.html">Unit Converter</a>
41-
<a href="mathtester.html">Math Tester</a>
42-
<a href="mathjax.html">Math Formatter</a>
43-
</div>
4437
<script src="mathtester.js"></script>
4538
</body>
4639
</html>

‎resources.css

+6-2
Original file line numberDiff line numberDiff line change
@@ -13,18 +13,22 @@
1313
border-radius: 30px;
1414
border: none;
1515
cursor: pointer;
16-
1716
color: white;
1817
font-size: 60px;
1918
text-align: center;
2019
line-height: 1.5;
2120
display: inline-block;
2221
vertical-align: middle;
23-
2422
transition: all 0.5s ease;
23+
24+
box-shadow: 5px 5px 10px rgba(0, 0, 0, 0.5);
2525
}
2626

2727
.resource:hover {
2828
transition: opacity 0.2s ease;
29+
transition: transform 0.2s ease;
30+
2931
opacity: 0.9;
32+
transform: scale(1.02);
33+
box-shadow: 7px 7px 10px rgba(0, 0, 0, 0.5);
3034
}

‎unitconverter.html

+1-8
Original file line numberDiff line numberDiff line change
@@ -24,7 +24,7 @@ <h1>Unit Converter</h1>
2424
<label for="from">From:</label>
2525
<select name="from" id="from"></select>
2626
<br>
27-
<input id="fromValue" type="number" min=0></input>
27+
<input id="fromValue" type="number" min=0 placeholder="1"></input>
2828
</div>
2929
<div class="to">
3030
<label for="to">To:</label>
@@ -37,13 +37,6 @@ <h1>Unit Converter</h1>
3737

3838
<button id="convert">Convert</button>
3939
<p>*Conversion rounded to nearest 100 thousandth*</p>
40-
41-
<div id="otherresources">
42-
<a href="index.html">Calculator</a>
43-
<a href="unitconverter.html">Unit Converter</a>
44-
<a href="mathtester.html">Math Tester</a>
45-
<a href="mathjax.html">Math Formatter</a>
46-
</div>
4740
<script src="unitconverter.js"></script>
4841
</body>
4942
</html>

0 commit comments

Comments
 (0)