~mdw / dep-ui / blame_incremental
? search:
summary | shortlog | log | commit | commitdiff | tree
blob | blame (non-incremental) | history | HEAD
rolling.html: Eliminate pointless `h2' and promote subheadings.
[dep-ui] / rolling.html
... / ...
CommitLineData
1<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN"
2 "http://www.w3c.org/TR/html4/strict.dtd">
3<html>
4<head>
5 <title>Rolling wire-strip calculator</title>
6 <meta name=viewport content="width=device-width initial-scale=1.0">
7 <link rel=stylesheet type="text/css" href="dep-ui.css">
8 <link rel=stylesheet type="text/css" href="rolling.css">
9 <script type="text/javascript" src="dep.js"></script>
10 <script type="text/javascript" src="dep-ui.js"></script>
11<head>
12<body>
13
14<h1>Rolling wire-strip calculator</h1>
15
16<div id=trace style="white-space: pre"></div>
17<script type="text/javascript"><!--
18--></script>
19
20<table class=widgets>
21 <tr><td colspan=2><h3>Required size</h3>
22 <tr>
23 <td class=label><label for=width>Width: </label>
24 <td><input id=width>
25 <script type="text/javascript"><!--
26 var width = new DEP.Dep();
27 DEP_UI.input_field('width', width, DEP_UI.convert_to_numeric);
28 --></script>
29 <tr>
30 <td class=label><label for=thick>Thickness: </label>
31 <td><input id=thick>
32 <script type="text/javascript"><!--
33 var thick = new DEP.Dep();
34 DEP_UI.input_field('thick', thick, DEP_UI.convert_to_numeric);
35 --></script>
36 <tr>
37 <td class=label><label for=length>Length: </label>
38 <td><input id=length>
39 <script type="text/javascript"><!--
40 var length = new DEP.Dep();
41 DEP_UI.input_field('length', length, DEP_UI.convert_to_numeric);
42 --></script>
43
44 <tr><td colspan=2><h3>You should start with</h3>
45 <tr>
46 <td class=label><label for=sq-size>Square side: </label>
47 <td><input id=sq-size readonly>
48 <script type="text/javascript"><!--
49 var sq_size = new DEP.Dep(function () {
50 return Math.pow(Math.pow(width.value(), 2) * thick.value(), 1/3);
51 });
52 DEP_UI.output_field('sq-size', sq_size, DEP_UI.convert_from_numeric);
53 --></script>
54 <tr>
55 <td class=label><label for=rnd-diam>Round diameter: </label>
56 <td><input id=rnd-diam readonly>
57 <script type="text/javascript"><!--
58 var rnd_diam = new DEP.Dep(function () {
59 return 2*sq_size.value()/Math.sqrt(Math.PI);
60 });
61 DEP_UI.output_field('rnd-diam', rnd_diam,
62 DEP_UI.convert_from_numeric);
63 --></script>
64 <tr>
65 <td class=label><label for=start-length>Length: </label>
66 <td><input id=start-length readonly>
67 <script type="text/javascript"><!--
68 var volume = new DEP.Dep(function () {
69 return width.value() * thick.value() * length.value();
70 });
71 volume.name = 'volume';
72 var start_length = new DEP.Dep(function () {
73 return volume.value()/(Math.pow(sq_size.value(), 2));
74 });
75 DEP_UI.output_field('start-length', start_length,
76 DEP_UI.convert_from_numeric);
77 --></script>
78
79 <tr><td colspan=2><h3>Initial stock</h3>
80 <tr><td colspan=2>
81 <input type=radio name=stock-type value=round id=stock-round checked>
82 <label for=stock-round>Round section</label>
83 <script type="text/javascript"><!--
84 var stock_type = new DEP.Dep();
85 DEP_UI.input_radio('stock-round', stock_type);
86 --></script>
87 <tr><td colspan=2>
88 <input type=radio name=stock-type value=square id=stock-square>
89 <label for=stock-square>Square section</label>
90 <script type="text/javascript"><!--
91 DEP_UI.input_radio('stock-square', stock_type);
92 --></script>
93 <tr>
94 <td class=label><label for=stock-size>Stock size: </label>
95 <td><input id=stock-size>
96 <script type="text/javascript"><!--
97 var stock_size = new DEP.Dep();
98 DEP_UI.input_field('stock-size', stock_size,
99 DEP_UI.convert_to_numeric);
100 --></script>
101 <tr>
102 <td class=label><label for=stock-length>Stock length: </label>
103 <td><input id=stock-length readonly>
104 <script type="text/javascript"><!--
105 var stock_length = new DEP.Dep(function () {
106 var cross;
107 switch (stock_type.value()) {
108 case 'round':
109 cross = 1/4 * Math.PI * Math.pow(stock_size.value(), 2);
110 break;
111 case 'square':
112 cross = Math.pow(stock_size.value(), 2);
113 break;
114 default:
115 dep_bad();
116 }
117 return volume.value()/cross;
118 });
119 DEP_UI.output_field('stock-length', stock_length,
120 DEP_UI.convert_from_numeric);
121 --></script>
122</table>
123
124<script type="text/javascript"><!--
125 function toggle_help() {
126 var e = DEP_UI.elt('help');
127 var b = DEP_UI.elt('toggle-help');
128 if (e.className.match(/\bconceal\b/)) {
129 b.textContent = 'Hide help';
130 DEP_UI.rm_elt_class(e, 'conceal');
131 } else {
132 b.textContent = 'Show help';
133 DEP_UI.add_elt_class(e, 'conceal');
134 }
135 }
136 document.write(
137 '<button id=toggle-help onclick="toggle_help()">' +
138 'Show help</button>');
139--></script>
140<div id=help>
141<script type="text/javascript"><!--
142 DEP_UI.add_elt_class(DEP_UI.elt('help'), 'conceal');
143--></script>
144<div id=js-note>
145<script type="text/javascript"><!--
146 DEP_UI.add_elt_class(DEP_UI.elt('js-note'), 'conceal');
147--></script>
148<p>This page is only really interesting because it contains a Javascript
149program. You seem to have Javascript turned off, so it won&rsquo;t work very
150well. It only requires first-party scripts;
151see <a href="#privacy">Privacy</a> for more details.
152</div>
153
154<h2>Background</h2>
155
156<p>When you pass round or square wire through flat rolls it gets flatter
157and longer, but it also gets wider. You can exploit this to make thin
158wire strip of almost any dimensions, but it&rsquo;s rather difficult to
159predict the result. That&rsquo;s what this calculator does.
160
161<p>You specify the width and thickness of the strip you want, and the
162program calculates what size round or square wire you should start with.
163Additionally, if you specify the length of strip you need, it will
164calculate the length of the input wire.
165
166<p>The chances are that you don&rsquo;t actually have the required
167thickness of round or square wire to start with, but you do have some
168that&rsquo;s thicker. Just enter the size of the round or square
169initial stock that you do have and the program will calculate how much
170of it you need to create the required starting size that you can then
171roll down to the required thickness of strip.
172
173<p>For best results, roll the strip in as few passes as you can handle.
174The results aren&rsquo;t accurate for broad, thin strips.
175Width-to-thickness ratios of up to 6:1 are known to be good; ratios of
17612:1 or more don't work: strips don&rsquo;t get as wide as predicted by
177our model. We need to collect more data and construct a better model to
178handle this case properly.
179
180<p>You can see the <a href="rolling-eqn.html">detailed equations</a>
181used for this calculation if you&rsquo;re interested.
182
183<h2>Use</h2>
184
185<p>Boxes with light red or white backgrounds are entry boxes for you to
186type in your requirements; boxes with dark red or grey backgrounds are
187where the calculator puts its answers. White and grey mean that the box
188is showing useful information: an input box contains a valid number, for
189example, and an output box has calculated a correct answer. Red, on the
190other hand, means that there&rsquo;s something wrong: either the
191calculator can&rsquo;t understand what you&rsquo;ve typed in an input
192box, or it&rsquo;s hit trouble &ndash; usually this means that some
193necessary input is missing.
194
195<p>You specify the width and thickness of the strip you want, and the
196program calculates what size round or square wire you should start with.
197Additionally, if you specify the length of strip you need, it will
198calculate the length of the input wire.
199
200<p>You can use whatever units you like, as long as they are consistent,
201but you cannot use wire gauges. If you use millimetres, the results
202will be in millimetres; if you use inches, the results will be in
203inches. Whatever you use, the results are displayed to only 3 decimal
204places.
205
206<h2>Code and credits</h2>
207
208<p>The code which makes this page work
209is <a href="https://www.gnu.org/philosophy/free-sw.html">free
210software</a>. You
211can <a href="https://git.distorted.org.uk/~mdw/dep-ui/">browse or download
212it</a>, modify it, and/or redistribute it under the terms of the
213<a href="https://www.gnu.org/licenses/old-licenses/gpl-2.0.html">GNU
214General Public License, version 2</a> or, at your option, any later
215version.
216
217<p>If you make interesting changes, I&rsquo;d be very grateful to know
218about them. Please <a href="mailto:mdw@distorted.org.uk">mail me
219patches</a>.
220
221<p>The Javascript machinery on this page was written by Mark Wooding;
222the text was written by Mark Wooding and Gary Wooding. The data used
223to derive the computation was provided by Gary Wooding.
224
225<h2 id="privacy">Privacy</h2>
226
227<p>There are no cookies or other trackers here. This page does not use
228externally hosted scripts, fonts, images, or anything else. The server
229has logged your IP address, which helps me fix things if they go wrong;
230mostly things work fine and the logs are discarded after a couple of
231weeks.
232
233<p>Most web browsers can save a version of this page which can be used
234offline.
235
236</div>
237</body>
238</html>
Dependency-based calculations and user interfaces in JavaScript.