esp-link/html/wifi/wifiSta.html

  <div id="main">
    <div class="header">
      <h1>WiFi Station Configuration</h1>
    </div>

    <div class="content">
      <div class="pure-g">
        <div class="pure-u-1 pure-u-md-1-2"><div class="card">
          <h1>WiFi State</h1>
          <div id="wifi-spinner" class="spinner spinner-small"></div>
          <table id="wifi-table" class="pure-table pure-table-horizontal" hidden><tbody>
          <tr><td>WiFi mode</td><td id="wifi-mode"></td></tr>
          <tr><td>WiFi channel</td><td id="wifi-chan"></td></tr>
          <tr><td>Configured network</td><td id="wifi-ssid"></td></tr>
          <tr><td>WiFi status</td><td id="wifi-status"></td></tr>
          <tr><td>WiFi address</td><td id="wifi-ip"></td></tr>
          <tr><td>WiFi rssi</td><td id="wifi-rssi"></td></tr>
          <tr><td>WiFi phy</td><td id="wifi-phy"></td></tr>
          <tr><td>WiFi MAC</td><td id="wifi-mac"></td></tr>
          <tr><td colspan="2" id="wifi-warn"></td></tr>
          </tbody> </table>
        </div>
        
        </div>
        <div class="pure-u-1 pure-u-md-1-2"><div class="card">
          <h1>WiFi Association</h1>
          <p id="reconnect" style="color: #600" hidden></p>
          <form action="#" id="wifiform" class="pure-form pure-form-stacked">
            <legend>To connect to a WiFi network, please select one of the detected networks,
               enter the password, and hit the connect button...</legend>
            <label>Network SSID</label>
            <div id="aps">Scanning... <div class="spinner spinner-small"></div></div>
            <label for="opt-hiddenssid">
              <input type="radio" name="essid" value="_hidden_ssid_" id="opt-hiddenssid">
              <input type="text" id="hidden-ssid" value="" style="width:auto; display:inline-block; margin-left: 0.7em">
            </label>
            <label>WiFi password, if applicable:</label>
            <input id="wifi-passwd" type="password" name="passwd" placeholder="password">
            <button id="connect-button" type="submit" class="pure-button button-primary">Connect!</button>
          </form>
        </div></div>
      </div>
      <div class="pure-g">
        <div class="pure-u-1 pure-u-md-1-2"><div class="card">
          <h1>Special Settings</h1>
          <form action="#" id="specform" class="pure-form">
            <legend>Special settings, use with care!</legend>
            <div class="form-horizontal">
              <label for="dhcp-ron" style="margin-right:1em">
                <input type="radio" name="dhcp" value="on" id="dhcp-ron"/>
                DHCP</label>
              <label for="dhcp-roff">
                <input type="radio" name="dhcp" value="off" id="dhcp-roff"/>
                Static IP</label>
            </div>
            <div id="dhcp-on" class="pure-form-stacked"></div>
            <div id="dhcp-off" class="pure-form-stacked">
              <label>Static IP address</label>
              <input id="wifi-staticip" type="text" name="staticip"/>
              <label>Netmask (for static IP)</label>
              <input id="wifi-netmask" type="text" name="netmask"/>
              <label>Gateway (for static IP)</label>
              <input id="wifi-gateway" type="text" name="gateway"/>
            </div>
            <button id="special-button" type="submit" class="pure-button button-primary">Change!</button>
          </form>
        </div></div>

        <div class="pure-u-1 pure-u-md-1-2"><div class="card">
          <h1>Security Settings</h1>
          <form action="#" id="securform" class="pure-form">
            <legend>Disable or protect station access</legend>
            <div class="form-horizontal">
	      Port 1
              <label for="port1-ron" style="margin-right:1em">
                <input type="radio" name="port1" value="on" id="secure-port1-ron"/>
                Unsecure</label>
              <label for="port1-roff" style="margin-right:1em">
                <input type="radio" name="port1" value="off" id="secure-port1-roff"/>
                Disabled</label>
              <label for="port1-rpwd">
                <input type="radio" name="port1" value="pwd" id="secure-port1-rpwd"/>
                Secure</label>
            </div>
            <div id="port1-off" class="pure-form-stacked"></div>
            <div id="port1-pn" class="pure-form-stacked">
              <label>TCP port number</label>
              <input id="secure-port1portnumber" type="text" name="port1number"/>
            </div>
            <div id="port1-pwd" class="pure-form-stacked">
              <label>Password</label>
              <input id="secure-port1password" type="password" name="port1password"/>
            </div>

            <div class="form-horizontal">
	      Port 2
              <label for="port2-ron" style="margin-right:1em">
                <input type="radio" name="port2" value="on" id="secure-port2-ron"/>
                Unsecure</label>
              <label for="port2-roff" style="margin-right:1em">
                <input type="radio" name="port2" value="off" id="secure-port2-roff"/>
                Disabled</label>
              <label for="port2-rpwd">
                <input type="radio" name="port2" value="pwd" id="secure-port2-rpwd"/>
                Secured</label>
            </div>
            <div id="port2-off" class="pure-form-stacked"></div>
            <div id="port2-pn" class="pure-form-stacked">
              <label>TCP port number</label>
              <input id="secure-port2portnumber" type="text" name="port2number"/>
            </div>
            <div id="port2-pwd" class="pure-form-stacked">
              <label>Password</label>
              <input id="secure-port2password" type="password" name="port2password"/>
            </div>

            <button id="secure-button" type="submit" class="pure-button button-primary">Change!</button>
          </form>
        </div></div>
      </div>

    </div>
  </div>
</div>

<script type="text/javascript">
</script>
<script src="wifiSta.js"></script>
<script type="text/javascript">
onLoad(function() {
  getWifiInfo();
  bnd($("#wifiform"), "submit", changeWifiAp);
  bnd($("#specform"), "submit", changeSpecial);

  getSecurityInfo();
  bnd($("#securform"), "submit", changeSecurity);
  bnd($("#secure-port1-roff"), "click", doPort1Off);
  bnd($("#secure-port1-ron"), "click", doPort1Unsecure);
  bnd($("#secure-port1-rpwd"), "click", doPort1Secure);

  bnd($("#secure-port2-roff"), "click", doPort2Off);
  bnd($("#secure-port2-ron"), "click", doPort2Unsecure);
  bnd($("#secure-port2-rpwd"), "click", doPort2Secure);

  bnd($("#dhcp-ron"), "click", doDhcp);
  bnd($("#dhcp-roff"), "click", doStatic);
  scanTimeout = window.setTimeout(scanAPs, 500);
});
</script>
</body></html>