<script type="text/javascript" src="ipnum.js"></script>
<script type="text/javascript">
  //<![CDATA[

  // infinite precision functions

  function catchEvent(eventObj, event, eventHandler) {
      if (eventObj.addEventListener) {
          eventObj.addEventListener(event, eventHandler, false);
      } else if (eventObj.attachEvent) {
          event = 'on' + event;
          eventObj.attachEvent(event, eventHandler);
      }
  }

  catchEvent(window, 'load', setupEvents);

  function setupEvents(evnt) {
      catchEvent(document.getElementById('ipAddNum1'), 'change', addFieldChange);
      catchEvent(document.getElementById('ipAddNum2'), 'change', addFieldChange);
      catchEvent(document.getElementById('ipSubNum1'), 'change', subFieldChange);
      catchEvent(document.getElementById('ipSubNum2'), 'change', subFieldChange);
      catchEvent(document.getElementById('ipMulNum1'), 'change', mulFieldChange);
      catchEvent(document.getElementById('ipMulNum2'), 'change', mulFieldChange);
      catchEvent(document.getElementById('ipFactNum'), 'change', factFieldChange);
  }

  function addFieldChange(evnt) {
      //var evnt = evnt ? evnt : window.event;
      //var target = evnt.target ? evnt.target : evnt.srcElement;
      var num1 = new IpNum();
      num1.setString(document.getElementById('ipAddNum1').value);
      var num2 = new IpNum();
      num2.setString(document.getElementById('ipAddNum2').value);
      var result = num1.add(num2);
      document.getElementById('ipAddResult').firstChild.data = result.getString();
  }

  function subFieldChange(evnt) {
      //var evnt = evnt ? evnt : window.event;
      //var target = evnt.target ? evnt.target : evnt.srcElement;
      var num1 = new IpNum();
      num1.setString(document.getElementById('ipSubNum1').value);
      var num2 = new IpNum();
      num2.setString(document.getElementById('ipSubNum2').value);
      var result = num1.sub(num2);
      document.getElementById('ipSubResult').firstChild.data = result.getString();
  }

  function mulFieldChange(evnt) {
      //var evnt = evnt ? evnt : window.event;
      //var target = evnt.target ? evnt.target : evnt.srcElement;
      var num1 = new IpNum();
      num1.setString(document.getElementById('ipMulNum1').value);
      var num2 = new IpNum();
      num2.setString(document.getElementById('ipMulNum2').value);
      var result = num1.mul(num2);
      document.getElementById('ipMulResult').firstChild.data = result.getString();
  }

  function factFieldChange(evnt) {
      //var evnt = evnt ? evnt : window.event;
      //var target = evnt.target ? evnt.target : evnt.srcElement;
      var num = new IpNum();
      num.setString(document.getElementById('ipFactNum').value);
      var result = num.fact();
      document.getElementById('ipFactResult').firstChild.data = result.getString();
  }

  //]]>
</script>

<form>
  <table>
    <tr>
      <td><input type="text" id="ipAddNum1" value="0" /></td>
      <td>+</td>
      <td><input type="text" id="ipAddNum2" value="0" /></td>
      <td>=</td>
      <td><span id="ipAddResult">0</span></td>
    </tr>
    <tr>
      <td><input type="text" id="ipSubNum1" value="0" /></td>
      <td>-</td>
      <td><input type="text" id="ipSubNum2" value="0" /></td>
      <td>=</td>
      <td><span id="ipSubResult">0</span></td>
    </tr>
    <tr>
      <td><input type="text" id="ipMulNum1" value="0" /></td>
      <td>*</td>
      <td><input type="text" id="ipMulNum2" value="0" /></td>
      <td>=</td>
      <td><span id="ipMulResult">0</span></td>
    </tr>
    <tr>
      <td><input type="text" id="ipFactNum" value="0" /></td>
      <td>!</td>
      <td></td>
      <td>=</td>
      <td><span id="ipFactResult">0</span></td>
    </tr>
  </table>
</form>