diff --git a/lmmath-regular.otf b/lmmath-regular.otf new file mode 100644 index 0000000..fe13b1f Binary files /dev/null and b/lmmath-regular.otf differ diff --git a/tetrahedron.css b/tetrahedron.css index 1e3502b..ec12bbe 100644 --- a/tetrahedron.css +++ b/tetrahedron.css @@ -5,4 +5,43 @@ } table, th, td { border:1px solid black; +} + +@font-face { + font-family: 'lmmath'; + src: url('lmmath-regular.otf') format('opentype'); +} + +.len_label { + font-family: 'lmmath', sans-serif; + font-style: italic; + font-size: 24.96px; +} + +.len_label1 { + font-family: 'lmmath', sans-serif; + font-size: 15px; +} + +.ang_label { + font-size: 24.96px; +} + +.ang_label1 { + font-family: 'lmmath', sans-serif; + font-style: italic; + font-size: 24.96px; +} + +.ang_label2 { + font-family: 'lmmath', sans-serif; + font-size: 15px; +} + +table{ + display: inline-block; +} + +.wrapper{ + text-align: center; } \ No newline at end of file diff --git a/tetrahedron.html b/tetrahedron.html index ffecb67..9bfc84f 100644 --- a/tetrahedron.html +++ b/tetrahedron.html @@ -1,26 +1,20 @@ - - Tetrahedron Calculator + + + + + - - - - -
- + +
+ +
+ @@ -32,6 +26,7 @@ + @@ -109,38 +104,48 @@
Tetrahedron Type
Orange: A, Blue: B, Purple: C, Green: D
+ + + + + - r1 - r2 - r3 - r4 - r5 - r6 - r7 - r8 - r9 - θ1 - θ2 - θ3 - θ4 - θ5 - θ6 - θ7 - θ8 - θ9 - θ10 - θ11 - θ12 + + + r1 + r2 + r3 + r4 + r5 + r6 + r7 + r8 + r9 + θ1 + θ2 + θ3 + θ4 + θ5 + θ6 + θ7 + θ8 + θ9 + θ10 + θ11 + θ12
+ + + diff --git a/tetrahedron.js b/tetrahedron.js index 6b4c67a..f7035eb 100644 --- a/tetrahedron.js +++ b/tetrahedron.js @@ -166,6 +166,7 @@ function setFlags(){ if(dihedral5.value != ""){flags |= 0b000000000000000000000000010} if(dihedral6.value != ""){flags |= 0b000000000000000000000000001} } +var fail = false; function lock1(){ label1.disabled = true; @@ -174,6 +175,27 @@ function lock1(){ angle1.disabled = true; angle2.disabled = true; angle3.disabled = true; + let check_len = true + if(label1.value <=0 || label1.value == ""){check_len = false;} + if(label2.value <=0 || label2.value == ""){check_len = false;} + if(label3.value <=0 || label3.value == ""){check_len = false;} + if(!check_len){ + alert("Lengths can't be negative") + erase(); + fail = true + location.reload(); + } + + let check_angle = true + if(angle1.value <=0 || angle1.value >=180 || angle1.value == ""){check_angle= false;} + if(angle2.value <=0 || angle2.value >=180 || angle2.value == ""){check_angle= false;} + if(angle3.value <=0 || angle3.value >=180 || angle3.value == ""){check_angle= false;} + if(!check_angle){ + alert("Angles not in range") + erase(); + fail = true + location.reload(); + } } function lock2(){ @@ -183,6 +205,27 @@ function lock2(){ angle4.disabled = true; angle5.disabled = true; angle6.disabled = true; + let check_len = true + if(label3.value <=0 || label3.value == ""){check_len = false;} + if(label4.value <=0 || label4.value == ""){check_len = false;} + if(label5.value <=0 || label5.value == ""){check_len = false;} + if(!check_len){ + alert("Lengths can't be negative") + erase(); + fail = true + location.reload(); + } + + let check_angle = true + if(angle4.value <=0 || angle4.value >=180 || angle4.value == ""){check_angle= false;} + if(angle5.value <=0 || angle5.value >=180 || angle5.value == ""){check_angle= false;} + if(angle6.value <=0 || angle6.value >=180 || angle6.value == ""){check_angle= false;} + if(!check_angle){ + alert("Angles not in range") + erase(); + fail = true + location.reload(); + } } function lock3(){ @@ -192,6 +235,27 @@ function lock3(){ angle7.disabled = true; angle8.disabled = true; angle9.disabled = true; + let check_len = true + if(label2.value <=0 || label2.value == ""){check_len = false;} + if(label6.value <=0 || label6.value == ""){check_len = false;} + if(label7.value <=0 || label7.value == ""){check_len = false;} + if(!check_len){ + alert("Lengths can't be negative") + erase(); + fail = true + location.reload(); + } + + let check_angle = true + if(angle7.value <=0 || angle7.value >=180 || angle7.value == ""){check_angle= false;} + if(angle8.value <=0 || angle8.value >=180 || angle8.value == ""){check_angle= false;} + if(angle9.value <=0 || angle9.value >=180 || angle9.value == ""){check_angle= false;} + if(!check_angle){ + alert("Angles not in range") + erase(); + fail = true + location.reload(); + } } function lock4(){ @@ -201,13 +265,35 @@ function lock4(){ angle10.disabled = true; angle11.disabled = true; angle12.disabled = true; + let check_len = true + if(label1.value <=0 || label1.value == ""){check_len = false;} + if(label8.value <=0 || label8.value == ""){check_len = false;} + if(label9.value <=0 || label9.value == ""){check_len = false;} + if(!check_len){ + alert("Lengths can't be negative") + erase(); + fail = true + location.reload(); + } + + let check_angle = true + if(angle10.value <=0 || angle10.value >=180 || angle10.value == ""){check_angle= false;} + if(angle11.value <=0 || angle11.value >=180 || angle11.value == ""){check_angle= false;} + if(angle12.value <=0 || angle12.value >=180 || angle12.value == ""){check_angle= false;} + if(!check_angle){ + alert("Angles not in range") + erase(); + fail = true + location.reload(); + } } + function validate(){ let changed = true; let count = 0; setFlags(); - while(changed && count<100){ + while(changed && count<27 && !fail){ count += 1; update(); //unlock(); @@ -942,7 +1028,7 @@ function validate(){ if(angle11.value == ""){done = false;} if(angle12.value == ""){done = false;} if(done){ - if(count == 100){ + if(count == 27){ alert("Some lengths, angles or dihedrals isNaN") location.reload(); }else{ @@ -951,42 +1037,6 @@ function validate(){ }else{ unrender(); } - - let check_len = true - if(label1.value <=0 && label1.value != ""){check_len = false;} - if(label2.value <=0 && label2.value != ""){check_len = false;} - if(label3.value <=0 && label3.value != ""){check_len = false;} - if(label4.value <=0 && label4.value != ""){check_len = false;} - if(label5.value <=0 && label5.value != ""){check_len = false;} - if(label6.value <=0 && label6.value != ""){check_len = false;} - if(label7.value <=0 && label7.value != ""){check_len = false;} - if(label8.value <=0 && label8.value != ""){check_len = false;} - if(label9.value <=0 && label9.value != ""){check_len = false;} - if(!check_len){ - alert("Lengths can't be negative") - erase(); - location.reload(); - } - - let check_angle = true - if((angle1.value <=0 || angle1.value >=180) && angle1.value != ""){check_angle= false;} - if((angle2.value <=0 || angle2.value >=180) && angle2.value != ""){check_angle= false;} - if((angle3.value <=0 || angle3.value >=180) && angle3.value != ""){check_angle= false;} - if((angle4.value <=0 || angle4.value >=180) && angle4.value != ""){check_angle= false;} - if((angle5.value <=0 || angle5.value >=180) && angle5.value != ""){check_angle= false;} - if((angle6.value <=0 || angle6.value >=180) && angle6.value != ""){check_angle= false;} - if((angle7.value <=0 || angle7.value >=180) && angle7.value != ""){check_angle= false;} - if((angle8.value <=0 || angle8.value >=180) && angle8.value != ""){check_angle= false;} - if((angle9.value <=0 || angle9.value >=180) && angle9.value != ""){check_angle= false;} - if((angle10.value <=0 || angle10.value >=180) && angle10.value != ""){check_angle= false;} - if((angle11.value <=0 || angle11.value >=180) && angle11.value != ""){check_angle= false;} - if((angle12.value <=0 || angle12.value >=180) && angle12.value != ""){check_angle= false;} - if(!check_angle){ - alert("Angles not in range") - erase(); - location.reload(); - } - } function inverse_dihedral(a, b, c){ @@ -1173,15 +1223,22 @@ handlers2[11][7] = () => {angle1.value = "60";angle2.value = "60";angle3.value = //Tests to see if all fields have been filled. If so then it will render the image else it will unrender. function refresh(){ - if(label1.value != ""){pq1.textContent = label1.value;}else{pq1.textContent = "r1";} - if(label2.value != ""){pq2.textContent = label2.value;}else{pq2.textContent = "r2";} - if(label3.value != ""){pq3.textContent = label3.value;}else{pq3.textContent = "r3";} - if(label4.value != ""){pq4.textContent = label4.value;}else{pq4.textContent = "r4";} - if(label5.value != ""){pq5.textContent = label5.value;}else{pq5.textContent = "r5";} - if(label6.value != ""){pq6.textContent = label6.value;}else{pq6.textContent = "r6";} - if(label7.value != ""){pq7.textContent = label7.value;}else{pq7.textContent = "r7";} - if(label8.value != ""){pq8.textContent = label8.value;}else{pq8.textContent = "r8";} - if(label9.value != ""){pq9.textContent = label9.value;}else{pq9.textContent = "r9";} + let lock = false + if(label1.value != ""){pq1.innerHTML = label1.value; lock = true;}else{pq1.innerHTML = 'r1';} + if(label2.value != ""){pq2.innerHTML = label2.value; lock = true;}else{pq2.innerHTML = 'r2';} + if(label3.value != ""){pq3.innerHTML = label3.value; lock = true;}else{pq3.innerHTML = 'r3';} + if(label4.value != ""){pq4.innerHTML = label4.value; lock = true;}else{pq4.innerHTML = 'r4';} + if(label5.value != ""){pq5.innerHTML = label5.value; lock = true;}else{pq5.innerHTML = 'r5';} + if(label6.value != ""){pq6.innerHTML = label6.value; lock = true;}else{pq6.innerHTML = 'r6';} + if(label7.value != ""){pq7.innerHTML = label7.value; lock = true;}else{pq7.innerHTML = 'r7';} + if(label8.value != ""){pq8.innerHTML = label8.value; lock = true;}else{pq8.innerHTML = 'r8';} + if(label9.value != ""){pq9.innerHTML = label9.value; lock = true;}else{pq9.innerHTML = 'r9';} + if (lock){ + radios.forEach(x => x.disabled = true); + }else{ + radios.forEach(x => x.disabled = false); + } + } //Resets the objects to the original states @@ -1485,4 +1542,12 @@ function erase(){ dihedral4.disabled = false; dihedral5.disabled = false; dihedral6.disabled = false; -} \ No newline at end of file +} + +window.MathJax = { + tex: { + // inlineMath: [['$', '$'], ['\\(', '\\)']], + packages: {'[+]': ['mhchem']} + }, + loader: {load: ['[tex]/mhchem']}, +}; \ No newline at end of file