From 31aa6f0849c224cc4a9ab9bec355e70e88c0d76f Mon Sep 17 00:00:00 2001 From: Taylor Courage Date: Wed, 15 Jan 2025 22:24:43 -0500 Subject: [PATCH] Initial commit --- README.md | 11 +++++ analyser.css | 84 ++++++++++++++++++++++++++++++++++++++ analyser.js | 111 +++++++++++++++++++++++++++++++++++++++++++++++++++ index.html | 51 +++++++++++++++++++++++ 4 files changed, 257 insertions(+) create mode 100644 README.md create mode 100644 analyser.css create mode 100644 analyser.js create mode 100644 index.html diff --git a/README.md b/README.md new file mode 100644 index 0000000..7d2534b --- /dev/null +++ b/README.md @@ -0,0 +1,11 @@ +# Setup Analyser + +## Introduction + +This web app is to be used to calculate and visualise the setup of wiredraw machinery + +## How it works + +The user enters the measured finished size of material, adding and removing sizes as necessary. The final results print in a table below the entered data. + +See it in operation [here](https://analyser.taylorcourage.net) \ No newline at end of file diff --git a/analyser.css b/analyser.css new file mode 100644 index 0000000..27d1c6e --- /dev/null +++ b/analyser.css @@ -0,0 +1,84 @@ + +.content { + display: flex; + flex-direction: column; + max-width: 650px; + min-height: 250px; + position: relative; + border: 1px solid black; + border-radius: 5px; + padding-left: 17px; + padding-right: 17px; + margin: auto; + font-family: 'Segoe UI', Tahoma, Geneva, Verdana, sans-serif; +} + +.body { + flex-grow: 1; + flex-shrink: 1; + margin: 0; + padding: 0; + color: black; +} + +#output { + table-layout: fixed; + width: 100%; +} + +#output td { + position: relative; + border: 1px solid; +} + +#outputHeader { + font-size: 75%; + text-align: center; +} + +#headerSpacer { + width: 18%; +} + +#startFinish { + width: 300px; + text-align: center; +} + +#roa { + width: 12%; + text-align: center; +} + +#elong { + width: 12%; + text-align: center; +} + +#delta { + width: 12%; +} + +.footer { + position: relative; + bottom: 15px; + width: 100%; + font-size: 75%; + margin: auto; + font-family: 'Segoe UI', Tahoma, Geneva, Verdana, sans-serif; +} + +.results { + font-size: 200%; + margin: auto; +} + +.results h1 { + font-family:'Courier New', Courier, monospace; +} + +#vanity { + font-family: serif; + font-style: oblique; + font-size: 0.8em; +} \ No newline at end of file diff --git a/analyser.js b/analyser.js new file mode 100644 index 0000000..c6f0d88 --- /dev/null +++ b/analyser.js @@ -0,0 +1,111 @@ +var numDies = 0; // master counter for our number of dies + +// This function gets the reduction of area with two provided sizes, and returns it +function getReduction(startSize, finalSize) { + var startArea = Math.PI * ((startSize / 2) * (startSize / 2)); + var finalArea = Math.PI * ((finalSize / 2) * (finalSize / 2)); + + return ((startArea - finalArea) / startArea) * 100; +} + +// This function gets the elongation +function getElongation(startSize, finalSize) { + return (Math.pow(startSize / finalSize, 2) - 1) * 100; +} + +function addReduction() { + numDies ++; + + // format our HTML + var html = ""; // start with an empty html + html += ""; + html += ""; + + // create the row + var table = document.getElementById("data"); + var row = table.insertRow(-1); + var cell1 = row.insertCell(0); + cell1.innerHTML = html; + +} + +function removeReduction() { // function to remove the last row + numDies --; + document.getElementById("data").deleteRow(-1); // delete the last row in the table +} + +function doMath() { + outputTable = document.getElementById("output"); // Select our output data table + outputTable.innerHTML = ""; + var row = []; + row[0] = outputTable.insertRow(0); + row[0].id = "outputHeader"; // set the header row + var r1c1 = row[0].insertCell(0); //blank + var r1c2 = row[0].insertCell(1); // "Start -> Finish" + var r1c3 = row[0].insertCell(2); // "ROA" + var r1c4 = row[0].insertCell(3); // "Elong" + var r1c5 = row[0].insertCell(4); // "Delta" + + // Create the header of the table + r1c1.innerHTML = ""; + r1c1.id = "headerSpacer"; + r1c2.innerHTML = "Start -> Finish"; + r1c2.id = "startFinish"; + r1c3.innerHTML = "ROA (%)"; + r1c3.id = "roa"; + r1c4.innerHTML = "Elong (%)"; + r1c4.id = "elong"; + r1c5.innerHTML = "Delta**"; + r1c5.id = "delta"; + + for (var i = 1; i < numDies + 1; i++) { + inSize = document.getElementById("die" + (i - 1)).value; // the input size + outSize = document.getElementById("die" + i).value; // output size + + if (i == 1 && document.getElementById("metric").checked == true) { + // If this is the first die in the setup, check if it's a metric/rod start and convert it + inSize = toInches(inSize); + } + + // Format our numbers to prevent maximum user stupidity + if (inSize < 10.0 && inSize > 0) { // If we have a 'proper' number i.e. ".130" + inSize = Number(inSize); + } else { // re-format the number if it's 'wrong' i.e. "130" + inSize = inSize / 1000; + } + if (outSize < 10.0 && outSize > 0) { // If we have a 'proper' number i.e. ".130" + outSize = Number(outSize); + } else { // re-format the number if it's 'wrong' i.e. "130" + outSize = outSize / 1000; + } + + console.log(inSize + " " + outSize); + + row[i] = outputTable.insertRow(i); + + var cell1 = row[i].insertCell(0); + var cell2 = row[i].insertCell(1); + cell2.id = "startFinish"; + var cell3 = row[i].insertCell(2); + cell3.id = "roa"; + var cell4 = row[i].insertCell(3); + cell4.id = "elong"; + + cell1.innerHTML = "Reduction " + i + ":"; + cell2.innerHTML = inSize + "\" (" + toMillimetres(inSize) + " mm) -> " + outSize + "\" (" + toMillimetres(outSize) + " mm)"; + cell3.innerHTML = Math.round(getReduction(inSize, outSize) * 100) / 100; + cell4.innerHTML = Math.round(getElongation(inSize, outSize) * 100) / 100; + + } +} + +function toMillimetres(size) { //convert to mm + size = Math.round((size * 100) * 25.4) / 100; + return size; + +} + +function toInches(size) { //convert to inches + size = Math.round((size * 1000) / 25.4) / 1000; + return size; +} \ No newline at end of file diff --git a/index.html b/index.html new file mode 100644 index 0000000..6eeed3b --- /dev/null +++ b/index.html @@ -0,0 +1,51 @@ + + + + + + + + + Wiredraw Setup Analyser + + + +
+
+

Taylor Courage's

+

Setup Analyser

+

Use this tool to visualize the setup of wiredraw machinery

+

─

+
+
+ + + + + + +

+ +
+

+ + + + + + +

─

+

+ +
+

**Coming soon!

+

 

+
+
+
+

 

+

© 2025 Taylor Courage

+
+ + + \ No newline at end of file