chiark - git - mdw - dep-ui/blob - rolling.html

   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   <script type="text/javascript" src="dep.js"></script>
   7   <script type="text/javascript" src="dep-ui.js"></script>
   8   <link rel=stylesheet type="text/css" href="dep-ui.css">
   9   <link rel=stylesheet type="text/css" href="rolling.css">
  10 <head>
  11 <body>
  12
  13 <h1>Rolling wire-strip calculator</h1>
  14
  15 <script type="text/javascript"><!--
  16 --></script>
  17
  18 <table class=widgets>
  19   <tr><td colspan=2><h3>Required size</h3>
  20   <tr>
  21     <td class=label><label for=width>Width: </label>
  22     <td><input id=width>
  23     <script type="text/javascript"><!--
  24         var width = new DEP.Dep();
  25         DEP_UI.input_field('width', width, DEP_UI.convert_to_numeric);
  26     --></script>
  27   <tr>
  28     <td class=label><label for=thick>Thickness: </label>
  29     <td><input id=thick>
  30     <script type="text/javascript"><!--
  31         var thick = new DEP.Dep();
  32         DEP_UI.input_field('thick', thick, DEP_UI.convert_to_numeric);
  33     --></script>
  34   <tr>
  35     <td class=label><label for=length>Length: </label>
  36     <td><input id=length>
  37     <script type="text/javascript"><!--
  38         var length = new DEP.Dep();
  39         DEP_UI.input_field('length', length, DEP_UI.convert_to_numeric);
  40     --></script>
  41
  42   <tr><td colspan=2><h3>You should start with</h3>
  43   <tr>
  44     <td class=label><label for=sq-size>Square side: </label>
  45     <td><input id=sq-size readonly>
  46     <script type="text/javascript"><!--
  47         var sq_size = new DEP.Dep(function () {
  48           return Math.pow(Math.pow(width.value(), 2) * thick.value(), 1/3);
  49         });
  50         DEP_UI.output_field('sq-size', sq_size, DEP_UI.convert_from_numeric);
  51     --></script>
  52   <tr>
  53     <td class=label><label for=rnd-diam>Round diameter: </label>
  54     <td><input id=rnd-diam readonly>
  55     <script type="text/javascript"><!--
  56         var rnd_diam = new DEP.Dep(function () {
  57           return 2*sq_size.value()/Math.sqrt(Math.PI);
  58         });
  59         DEP_UI.output_field('rnd-diam', rnd_diam,
  60                             DEP_UI.convert_from_numeric);
  61     --></script>
  62   <tr>
  63     <td class=label><label for=start-length>Length: </label>
  64     <td><input id=start-length readonly>
  65     <script type="text/javascript"><!--
  66         var volume = new DEP.Dep(function () {
  67           return width.value() * thick.value() * length.value();
  68         });
  69         volume.name = 'volume';
  70         var start_length = new DEP.Dep(function () {
  71           return volume.value()/(Math.pow(sq_size.value(), 2));
  72         });
  73         DEP_UI.output_field('start-length', start_length,
  74                             DEP_UI.convert_from_numeric);
  75     --></script>
  76
  77   <tr><td colspan=2><h3>Initial stock</h3>
  78   <tr><td colspan=2>
  79     <input type=radio name=stock-type value=round id=stock-round checked>
  80     <label for=stock-round>Round section</label>
  81     <script type="text/javascript"><!--
  82         var stock_type = new DEP.Dep();
  83         DEP_UI.input_radio('stock-round', stock_type);
  84     --></script>
  85   <tr><td colspan=2>
  86     <input type=radio name=stock-type value=square id=stock-square>
  87     <label for=stock-square>Square section</label>
  88     <script type="text/javascript"><!--
  89         DEP_UI.input_radio('stock-square', stock_type);
  90     --></script>
  91   <tr>
  92     <td class=label><label for=stock-size>Stock size: </label>
  93     <td><input id=stock-size>
  94     <script type="text/javascript"><!--
  95         var stock_size = new DEP.Dep();
  96         DEP_UI.input_field('stock-size', stock_size,
  97                            DEP_UI.convert_to_numeric);
  98     --></script>
  99   <tr>
 100     <td class=label><label for=stock-length>Stock length: </label>
 101     <td><input id=stock-length readonly>
 102     <script type="text/javascript"><!--
 103         var stock_length = new DEP.Dep(function () {
 104           var cross;
 105           switch (stock_type.value()) {
 106             case 'round':
 107               cross = 1/4 * Math.PI * Math.pow(stock_size.value(), 2);
 108               break;
 109             case 'square':
 110               cross = Math.pow(stock_size.value(), 2);
 111               break;
 112             default:
 113               dep_bad();
 114           }
 115           return volume.value()/cross;
 116         });
 117         DEP_UI.output_field('stock-length', stock_length,
 118                             DEP_UI.convert_from_numeric);
 119     --></script>
 120 </table>
 121
 122 <script type="text/javascript"><!--
 123         function toggle_help() {
 124           var e = DEP_UI.elt('help');
 125           var b = DEP_UI.elt('toggle-help');
 126           if (e.className.match(/\bconceal\b/)) {
 127             b.textContent = 'Hide help';
 128             DEP_UI.rm_elt_class(e, 'conceal');
 129           } else {
 130             b.textContent = 'Show help';
 131             DEP_UI.add_elt_class(e, 'conceal');
 132           }
 133         }
 134         document.write(
 135           '<button id=toggle-help onclick="toggle_help()">' +
 136           'Show help</button>');
 137 --></script>
 138 <div id=help>
 139 <script type="text/javascript"><!--
 140         DEP_UI.add_elt_class(DEP_UI.elt('help'), 'conceal');
 141 --></script>
 142 <h2>What this program does</h2>
 143
 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
 149 program.  You seem to have Javascript turned off, so it won't work very
 150 well.
 151 </div>
 152
 153 <h3>Background</h3>
 154
 155 <p>When you pass round or square wire through flat rolls it gets flatter
 156 and longer, but it also gets wider.  You can exploit this to make thin
 157 wire strip of almost any dimensions, but it&rsquo;s rather difficult to
 158 predict the result.  That&rsquo;s what this calculator does.
 159
 160 <p>You specify the width and thickness of the strip you want, and the
 161 program calculates what size round or square wire you should start with.
 162 Additionally, if you specify the length of strip you need, it will
 163 calculate the length of the input wire.
 164
 165 <p>The chances are that you don&rsquo;t actually have the required
 166 thickness of round or square wire to start with, but you do have some
 167 that&rsquo;s thicker.  Just enter the size of the round or square
 168 initial stock that you do have and the program will calculate how much
 169 of it you need to create the required starting size that you can then
 170 roll down to the required thickness of strip.
 171
 172 <p>For best results, roll the strip in as few passes as you can handle.
 173
 174 <h3>Use</h3>
 175
 176 <p>Boxes with light red or white backgrounds are entry boxes for you to
 177 type in your requirements; boxes with dark red or grey backgrounds are
 178 where the calculator puts its answers.  White and grey mean that the box
 179 is showing useful information: an input box contains a valid number, for
 180 example, and an output box has calculated a correct answer.  Red, on the
 181 other hand, means that there&rsquo;s something wrong: either the
 182 calculator can&rsquo;t understand what you&rsquo;ve typed in an input
 183 box, or it&rsquo;s hit trouble &ndash; usually this means that some
 184 necessary input is missing.
 185
 186 <p>You specify the width and thickness of the strip you want, and the
 187 program calculates what size round or square wire you should start with.
 188 Additionally, if you specify the length of strip you need, it will
 189 calculate the length of the input wire.
 190
 191 <p>You can use whatever units you like, as long as they are consistent,
 192 but you cannot use wire gauges.  If you use millimetres, the results
 193 will be in millimetres; if you use inches, the results will be in
 194 inches.  Whatever you use, the results are displayed to only 3 decimal
 195 places.
 196
 197 <h3>Code</h3>
 198
 199 <p>The code which makes this page work
 200 is <a href="http://www.gnu.org/philosophy/free-sw.html">free
 201 software</a>.  You
 202 can <a href="http://git.distorted.org.uk/~mdw/dep-ui/">browse or download
 203 it</a>, modify it, and/or redistribute it under the terms of the
 204 <a href="http://www.gnu.org/licenses/old-licenses/gpl-2.0.html">GNU
 205 General Public License, version 2</a> or, at your option, any later
 206 version.
 207
 208 <p>If you make interesting changes, I&rsquo;d be very grateful to know
 209 about them.  Please <a href="mailto:mdw@distorted.org.uk">mail me
 210 patches</a>.
 211
 212 </div>
 213 </body>
 214 </html>