Merge pull request #2 from TerribleCoding/dev_1.1

TerribleCoding · web-flow · commit 85bb0ce22e2d · 2021-04-18T22:06:39.000+02:00
v1.1
diff --git a/README.md b/README.md
@@ -4,6 +4,10 @@ A powerful web tool for calculating phisical and mechanical properties of standa
 
 Can be used by designers and engineers as a quick estimation tool, as well as by students as a geometry tool, or simply to find material data from the database.
 
+## License
+
+The project is published intentionally with no license at the moment.
+
 ## Usage
 
 Choose the shape you want to calculate features by clicking the corresponding image or name.
@@ -13,7 +17,7 @@ Wether results will be available while inserting data, they will show in the bot
 e.g.: If you're looking for the area of a rectangle as the base **and** the height will be filled in you'll have the result otherwise the field will be null.
 
 You can use the arrows on the right side of any input field to raise or decrease it by 1 unit, for your convenience.
-For a quicker input process, is suggested to use the _Tab_ key to junp on the next input field.
+For a quicker input process, is suggested to use the _Tab_ key to jump on the next input field.
 
 Results updates trigger whenever **one** of these events occur:
 
@@ -22,6 +26,7 @@ Results updates trigger whenever **one** of these events occur:
 - Changing field with _Tab_ key
 - Changing material selecting it from the provided list
 - Clicking anywhere on the page, after editing of a number, deselecting the input field
+- Clicking on dimension swap button
 
 All texts and numbers on the pages are able to be copied and pasted anywhere you need.
 
@@ -42,7 +47,6 @@ Note: _The order of this list might not match the order these features will be a
 - More materials in the database
 - Materials divided in groups, in order to filter the available ones
 - Result finder (let the program change an input to return a specific result)
-- Data swapper for rectangles and ellipses (you may want to swap width and height rapidly, a button will be added)
 - Limiting inputs to positive values
 - Limiting inputs to generate valid geometry (e.g. a tube D=10, t=6 is not valid)
 - Canvas to see the shape change dynamically while typing and changing data
@@ -55,10 +59,19 @@ Note: _The order of this list might not match the order these features will be a
 
 _Release date: March 27, 2021_
 
-_Work Hours: unknown, project directory created on Jan 14, 2021_
+_Work Time: unknown, project directory created on Jan 14, 2021_
 
 First release composed by an index page and 13 standard shapes to choose. Tables on every profile page for inserting shape data and material data or choose from presetted materials.
 
+#### v1.1
+
+_Release date: April 18, 2021_
+
+_Work Time: 1h_
+
+- Fixed issue #1 - Favicon not working.
+- Added a dimension swapper button for rectangles and ellipses. Click it to swap width and height rapidly.
+
 ## Team & Credits
 
 #### Team
@@ -71,7 +84,3 @@ First release composed by an index page and 13 standard shapes to choose. Tables
 
 #### Media
 - Favicon made by [Vitaliy Gorbachev](https://www.flaticon.com/authors/vitaly-gorbachev) from [www.flaticon.com](www.flaticon.com)
-
-## License
-
-The project is published intentionally with no license at the moment.
diff --git a/assets/ico/favicon.ico b/assets/ico/favicon.ico
diff --git a/index.html b/index.html
@@ -5,8 +5,7 @@
     <title>AnySection</title>
     <script src="https://cdn.jsdelivr.net/npm/p5@1.3.0/lib/p5.js"></script>
     <link rel="stylesheet" type="text/css" href="style.css">
-    <link rel="icon" type="image/x-icon"
-        href="https://www.flaticon.com/svg/vstatic/svg/2427/2427527.svg?token=exp=1616006400~hmac=8eed44d6afa3d17fc07217318344a544">
+    <link rel="icon" type="image/x-icon" href="assets/ico/favicon.ico">
 </head>
 
 <body>
diff --git a/pages/c-profile.html b/pages/c-profile.html
@@ -7,7 +7,7 @@
     <script src="common.js"></script>
     <script src="c-profile.js"></script>
     <link rel="stylesheet" type="text/css" href="../style.css">
-    <link rel="icon" type="image/x-icon" href="https://www.flaticon.com/svg/vstatic/svg/2427/2427527.svg?token=exp=1616006400~hmac=8eed44d6afa3d17fc07217318344a544">
+    <link rel="icon" type="image/x-icon" href="../assets/ico/favicon.ico">
 </head>
 
 <body>
diff --git a/pages/cylinder.html b/pages/cylinder.html
@@ -7,7 +7,7 @@
     <script src="common.js"></script>
     <script src="cylinder.js"></script>
     <link rel="stylesheet" type="text/css" href="../style.css">
-    <link rel="icon" type="image/x-icon" href="https://www.flaticon.com/svg/vstatic/svg/2427/2427527.svg?token=exp=1616006400~hmac=8eed44d6afa3d17fc07217318344a544">
+    <link rel="icon" type="image/x-icon" href="../assets/ico/favicon.ico">
 </head>
 
 <body>
diff --git a/pages/elliptic-bar.html b/pages/elliptic-bar.html
@@ -7,7 +7,7 @@
     <script src="common.js"></script>
     <script src="elliptic-bar.js"></script>
     <link rel="stylesheet" type="text/css" href="../style.css">
-    <link rel="icon" type="image/x-icon" href="https://www.flaticon.com/svg/vstatic/svg/2427/2427527.svg?token=exp=1616006400~hmac=8eed44d6afa3d17fc07217318344a544">
+    <link rel="icon" type="image/x-icon" href="../assets/ico/favicon.ico">
 </head>
 
 <body>
@@ -69,6 +69,8 @@ <h3 class="back">Back to index</h3>
                     <td class="unit">N/mm<sup>2</sup></td>
                 </tr>
             </table>
+            
+            <button class="switch" onclick="switchDim()">Switch dimensions</button>
         </div>
 
         <div class="results">
diff --git a/pages/elliptic-bar.js b/pages/elliptic-bar.js
@@ -24,4 +24,12 @@ function Resistance() {
     return PI * A * pow(B, 2) / 32;
 }
 
-function ResistanceB() { }
+function ResistanceB() { }
+
+function switchDim() {
+    let A = floatElseZero(dim.A.elt.value);
+    let B = floatElseZero(dim.B.elt.value);
+    dim.A.elt.value = B;
+    dim.B.elt.value = A;
+    updateResults();
+}
diff --git a/pages/h-profile.html b/pages/h-profile.html
@@ -7,7 +7,7 @@
     <script src="common.js"></script>
     <script src="h-profile.js"></script>
     <link rel="stylesheet" type="text/css" href="../style.css">
-    <link rel="icon" type="image/x-icon" href="https://www.flaticon.com/svg/vstatic/svg/2427/2427527.svg?token=exp=1616006400~hmac=8eed44d6afa3d17fc07217318344a544">
+    <link rel="icon" type="image/x-icon" href="../assets/ico/favicon.ico">
 </head>
 
 <body>
diff --git a/pages/hexagonal-prism.html b/pages/hexagonal-prism.html
@@ -7,7 +7,7 @@
     <script src="common.js"></script>
     <script src="hexagonal-prism.js"></script>
     <link rel="stylesheet" type="text/css" href="../style.css">
-    <link rel="icon" type="image/x-icon" href="https://www.flaticon.com/svg/vstatic/svg/2427/2427527.svg?token=exp=1616006400~hmac=8eed44d6afa3d17fc07217318344a544">
+    <link rel="icon" type="image/x-icon" href="../assets/ico/favicon.ico">
 </head>
 
 <body>
diff --git a/pages/hollow-cylinder.html b/pages/hollow-cylinder.html
@@ -7,7 +7,7 @@
     <script src="common.js"></script>
     <script src="hollow-cylinder.js"></script>
     <link rel="stylesheet" type="text/css" href="../style.css">
-    <link rel="icon" type="image/x-icon" href="https://www.flaticon.com/svg/vstatic/svg/2427/2427527.svg?token=exp=1616006400~hmac=8eed44d6afa3d17fc07217318344a544">
+    <link rel="icon" type="image/x-icon" href="../assets/ico/favicon.ico">
 </head>
 
 <body>
diff --git a/pages/hollow-elliptic-bar.html b/pages/hollow-elliptic-bar.html
@@ -7,7 +7,7 @@
     <script src="common.js"></script>
     <script src="hollow-elliptic-bar.js"></script>
     <link rel="stylesheet" type="text/css" href="../style.css">
-    <link rel="icon" type="image/x-icon" href="https://www.flaticon.com/svg/vstatic/svg/2427/2427527.svg?token=exp=1616006400~hmac=8eed44d6afa3d17fc07217318344a544">
+    <link rel="icon" type="image/x-icon" href="../assets/ico/favicon.ico">
 </head>
 
 <body>
@@ -75,6 +75,8 @@ <h3 class="back">Back to index</h3>
                     <td class="unit">N/mm<sup>2</sup></td>
                 </tr>
             </table>
+            
+            <button class="switch" onclick="switchDim()">Switch dimensions</button>
         </div>
 
         <div class="results">
diff --git a/pages/hollow-elliptic-bar.js b/pages/hollow-elliptic-bar.js
@@ -29,4 +29,12 @@ function Resistance() {
     return 2 * I / B;
 }
 
-function ResistanceB() { }
+function ResistanceB() { }
+
+function switchDim() {
+    let A = floatElseZero(dim.A.elt.value);
+    let B = floatElseZero(dim.B.elt.value);
+    dim.A.elt.value = B;
+    dim.B.elt.value = A;
+    updateResults();
+}
diff --git a/pages/hollow-rectangle-bar.html b/pages/hollow-rectangle-bar.html
@@ -7,7 +7,7 @@
     <script src="common.js"></script>
     <script src="hollow-rectangle-bar.js"></script>
     <link rel="stylesheet" type="text/css" href="../style.css">
-    <link rel="icon" type="image/x-icon" href="https://www.flaticon.com/svg/vstatic/svg/2427/2427527.svg?token=exp=1616006400~hmac=8eed44d6afa3d17fc07217318344a544">
+    <link rel="icon" type="image/x-icon" href="../assets/ico/favicon.ico">
 </head>
 
 <body>
@@ -81,6 +81,8 @@ <h3 class="back">Back to index</h3>
                     <td class="unit">N/mm<sup>2</sup></td>
                 </tr>
             </table>
+
+            <button class="switch" onclick="switchDim()">Switch dimensions</button>
         </div>
 
         <div class="results">
diff --git a/pages/hollow-rectangle-bar.js b/pages/hollow-rectangle-bar.js
@@ -44,4 +44,12 @@ function Resistance() {
     return (outer - inner) / (6 * h);
 }
 
-function ResistanceB() { }
+function ResistanceB() { }
+
+function switchDim() {
+    let b = floatElseZero(dim.B.elt.value);
+    let h = floatElseZero(dim.H.elt.value);
+    dim.B.elt.value = h;
+    dim.H.elt.value = b;
+    updateResults();
+}
diff --git a/pages/octagonal-prism.html b/pages/octagonal-prism.html
@@ -7,7 +7,7 @@
     <script src="common.js"></script>
     <script src="octagonal-prism.js"></script>
     <link rel="stylesheet" type="text/css" href="../style.css">
-    <link rel="icon" type="image/x-icon" href="https://www.flaticon.com/svg/vstatic/svg/2427/2427527.svg?token=exp=1616006400~hmac=8eed44d6afa3d17fc07217318344a544">
+    <link rel="icon" type="image/x-icon" href="../assets/ico/favicon.ico">
 </head>
 
 <body>
diff --git a/pages/rectangle-bar.html b/pages/rectangle-bar.html
@@ -7,7 +7,7 @@
     <script src="common.js"></script>
     <script src="rectangle-bar.js"></script>
     <link rel="stylesheet" type="text/css" href="../style.css">
-    <link rel="icon" type="image/x-icon" href="https://www.flaticon.com/svg/vstatic/svg/2427/2427527.svg?token=exp=1616006400~hmac=8eed44d6afa3d17fc07217318344a544">
+    <link rel="icon" type="image/x-icon" href="../assets/ico/favicon.ico">
 </head>
 
 <body>
@@ -75,6 +75,8 @@ <h3 class="back">Back to index</h3>
                     <td class="unit">N/mm<sup>2</sup></td>
                 </tr>
             </table>
+
+            <button class="switch" onclick="switchDim()">Switch dimensions</button>
         </div>
 
         <div class="results">
diff --git a/pages/rectangle-bar.js b/pages/rectangle-bar.js
@@ -30,4 +30,12 @@ function Resistance() {
     return I / h * 2;
 }
 
-function ResistanceB() { }
+function ResistanceB() { }
+
+function switchDim() {
+    let b = floatElseZero(dim.B.elt.value);
+    let h = floatElseZero(dim.H.elt.value);
+    dim.B.elt.value = h;
+    dim.H.elt.value = b;
+    updateResults();
+}
diff --git a/pages/t-profile.html b/pages/t-profile.html
@@ -7,7 +7,7 @@
     <script src="common.js"></script>
     <script src="t-profile.js"></script>
     <link rel="stylesheet" type="text/css" href="../style.css">
-    <link rel="icon" type="image/x-icon" href="https://www.flaticon.com/svg/vstatic/svg/2427/2427527.svg?token=exp=1616006400~hmac=8eed44d6afa3d17fc07217318344a544">
+    <link rel="icon" type="image/x-icon" href="../assets/ico/favicon.ico">
 </head>
 
 <body>
diff --git a/pages/trapezius-prism.html b/pages/trapezius-prism.html
@@ -7,7 +7,7 @@
     <script src="common.js"></script>
     <script src="trapezius-prism.js"></script>
     <link rel="stylesheet" type="text/css" href="../style.css">
-    <link rel="icon" type="image/x-icon" href="https://www.flaticon.com/svg/vstatic/svg/2427/2427527.svg?token=exp=1616006400~hmac=8eed44d6afa3d17fc07217318344a544">
+    <link rel="icon" type="image/x-icon" href="../assets/ico/favicon.ico">
 </head>
 
 <body>
diff --git a/pages/triangular-prism.html b/pages/triangular-prism.html
@@ -7,7 +7,7 @@
     <script src="common.js"></script>
     <script src="triangular-prism.js"></script>
     <link rel="stylesheet" type="text/css" href="../style.css">
-    <link rel="icon" type="image/x-icon" href="https://www.flaticon.com/svg/vstatic/svg/2427/2427527.svg?token=exp=1616006400~hmac=8eed44d6afa3d17fc07217318344a544">
+    <link rel="icon" type="image/x-icon" href="../assets/ico/favicon.ico">
 </head>
 
 <body>
diff --git a/style.css b/style.css
@@ -139,6 +139,24 @@ img.back {
     height: 240px;
 }
 
+.switch {
+    background-color: var(--color-4);
+    color: var(--color-1);
+    border: solid 2px var(--color-1);
+    padding: 4px;
+    margin-top: 8px;
+    margin-left: 36px;
+    margin-right: 400px;
+    border-radius: 2px;
+    cursor: pointer;
+    transition: 0.3s;
+}
+
+.switch:hover {
+    background-color: var(--color-1);
+    color: var(--color-4);
+}
+
 .drawing {
     width: 80%;
     min-width: 300px;
