<?xml version="1.0" encoding="iso-8859-1"?>

<!DOCTYPE div
  PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<div xmlns="http://www.w3.org/1999/xhtml" xmlns:h="http://www.w3.org/1999/xhtml" id="xslt-result">
   <div id="ui">
      <map id="nakio" name="nakio">
         <area id="screen" shape="rect" coords="58,104, 235,315" alt=""/>
         <area id="btnM" shape="circle" coords="145,374, 16" alt="" href="javascript:Go();" onmouseover="ShowCmd('Go');" onmouseout="ShowCmd('');"/>
         <area id="btnL1" shape="poly" coords=" 10,274,  12,271,  15,272,  26,297,  32,316,  34,330,  31,333,  12,325,  10,274" alt="" href="javascript:Demo();" onmouseover="ShowCmd('Demo');" onmouseout="ShowCmd('');"/>
         <area id="btnL2" shape="poly" coords=" 36,345,  42,392,  41,395,  19,384,  13,339,  16,336,  33,342,  36,345" alt="" href="javascript:Credits();" onmouseover="ShowCmd('Credits');" onmouseout="ShowCmd('');"/>
         <area id="btnL3" shape="poly" coords=" 21,398,  23,396,  44,406,  49,431,  47,434,  31,426,  25,418,  22,409,  21,398" alt="" href="javascript:Data();" onmouseover="ShowCmd('Data');" onmouseout="ShowCmd('');"/>
         <area id="btnR1" shape="poly" coords="282,276, 280,327, 259,335, 256,332, 262,307, 271,285, 277,274, 280,273, 282,276" alt="" href="javascript:Reset();" onmouseover="ShowCmd('Reset');" onmouseout="ShowCmd('');"/>
         <area id="btnR2" shape="poly" coords="254,347, 256,344, 274,338, 278,340, 277,353, 274,363, 268,371, 261,375, 254,377, 251,374, 254,347" alt="" href="javascript:Clear();" onmouseover="ShowCmd('Clear');" onmouseout="ShowCmd('');"/>
         <area id="btnLt" shape="poly" coords=" 44,346,  92,364,  99,369, 104,377, 107,387, 108,395,  77,388,  47,379,  44,346" href="info.html" alt="" onmouseover="ShowCmd('How this was made');" onmouseout="ShowCmd('');"/>
         <area id="btnRt" shape="poly" coords="244,381, 215,390, 184,396, 186,380, 189,374, 197,367, 203,364, 248,347, 244,381" alt="" href="javascript:HowTo();" onmouseover="ShowCmd('How to use this');" onmouseout="ShowCmd('');"/>
         <area id="btn1" shape="poly" coords="111,424,  80,418,  51,408,  47,379,  77,388, 106,395, 106,394, 111,424" alt="" href="javascript:Dial('1');" onmouseover="ShowCmd('1');" onmouseout="ShowCmd('');"/>
         <area id="btn2" shape="poly" coords="133,398, 158,398, 183,396, 178,426, 156,428, 133,428, 111,425, 107,395, 133,398" alt="" href="javascript:Dial('2');" onmouseover="ShowCmd('2');" onmouseout="ShowCmd('');"/>
         <area id="btn3" shape="poly" coords="239,411, 209,420, 179,426, 183,396, 215,390, 244,381, 239,411" alt="" href="javascript:Dial('3');" onmouseover="ShowCmd('3');" onmouseout="ShowCmd('');"/>
         <area id="btn4" shape="poly" coords="115,455,  84,448,  56,439,  51,409,  80,419, 112,425, 115,455" alt="" href="javascript:Dial('4');" onmouseover="ShowCmd('4');" onmouseout="ShowCmd('');"/>
         <area id="btn5" shape="poly" coords="154,457, 135,457, 115,455, 111,425, 134,428, 156,428, 179,426, 175,456, 154,457" alt="" href="javascript:Dial('5');" onmouseover="ShowCmd('5');" onmouseout="ShowCmd('');"/>
         <area id="btn6" shape="poly" coords="233,441, 204,449, 174,456, 178,425, 210,420, 240,411, 233,441" alt="" href="javascript:Dial('6');" onmouseover="ShowCmd('6');" onmouseout="ShowCmd('');"/>
         <area id="btn7" shape="poly" coords="117,484,  89,478,  63,469,  56,439,  84,448, 115,456, 117,484" alt="" href="javascript:Dial('7');" onmouseover="ShowCmd('7');" onmouseout="ShowCmd('');"/>
         <area id="btn8" shape="poly" coords="152,487, 134,487, 116,484, 114,455, 135,457, 154,457, 174,456, 171,485, 152,487" alt="" href="javascript:Dial('8');" onmouseover="ShowCmd('8');" onmouseout="ShowCmd('');"/>
         <area id="btn9" shape="poly" coords="226,470, 200,479, 172,485, 175,456, 205,450, 233,441, 226,470" alt="" href="javascript:Dial('9');" onmouseover="ShowCmd('9');" onmouseout="ShowCmd('');"/>
         <area id="btnLb" shape="poly" coords="118,514,  94,508,  80,503,  73,496,  69,490,  63,469,  90,478, 117,484, 118,514" alt="" href="javascript:Dial('*');" onmouseover="ShowCmd('*');" onmouseout="ShowCmd('');"/>
         <area id="btn0" shape="poly" coords="152,516, 135,516, 117,514, 116,484, 135,487, 152,487, 171,485, 169,515, 152,516" alt="" href="javascript:Dial('0');" onmouseover="ShowCmd('0');" onmouseout="ShowCmd('');"/>
         <area id="btnRb" shape="poly" coords="221,489, 217,496, 210,502, 199,507, 187,511, 170,515, 172,485, 201,479, 226,470, 221,489" alt="" href="javascript:Dial('#');" onmouseover="ShowCmd('#');" onmouseout="ShowCmd('');"/>
      </map>
      <img usemap="#nakio" src="img/nakio.png" width="292" height="550" alt=""/>
      <form id="input" action="" onsubmit="return false;">
         <div id="brand">
            <a href="http://users.telenet.be/cking/webstuff/digiTransformer/info.html" title="about the digiTransformer">digiTransformer</a>
            <span> v2 © </span>
            <a href="mailto:anton@cking.be?subject=[webstuff:digiTransformer] " title="anton@cking.be">cking</a>
         </div>
         <p>
            <input type="text" id="input-dial" onchange="Go();"/>
         </p>
         <p>
            <input type="checkbox" id="input-doMax" onclick="Clicked('input-doMax');"/>
            <span> max digits </span>
            <select id="input-maxDigits" onchange="Go();" style="visibility:hidden;">
               <option value="0">0  </option>
               <option value="1">1</option>
               <option value="2">2</option>
               <option value="3">3</option>
               <option value="4">4</option>
               <option value="5">5</option>
            </select>
         </p>
         <p>
            <input type="checkbox" id="input-doMin" onclick="Clicked('input-doMin');"/>
            <span> min chars </span>
            <select id="input-minChars" onchange="Go();" style="visibility:hidden;">
               <option value="2">2  </option>
               <option value="3">3</option>
            </select>
         </p>
         <p>
            <select id="input-dictionary" ondblclick="Go();" size="3" multiple="multiple">
               <option value="english-basic">english-basic</option>
               <option value="english-common">english-common</option>
               <option value="names-boys">names-boys</option>
               <option value="names-girls">names-girls</option>
            </select>
            <input id="cmd" type="text" readonly="readonly"/>
         </p>
      </form>
   </div>
   <div id="result">
      <div id="dump"/>
      <p class="empty-dial" id="no-input">« enter phone number or phrase</p>
   </div>
   <div id="license">
      <a href="http://creativecommons.org/licenses/by-sa/2.0/">
         <img src="img/somerights.gif" width="88px" height="31px" alt="creativecommons" title="Creative Commons Attribution/ShareAlike License"/>
      </a>
      <span class="note"> built with XHTML, CSS, XSLT &amp; JavaScript</span>
   </div>
</div>
