~1[<!-- -*-html-*-
  --
  -- Main account listing and password changing form
  --
  -- (c) 2013 Mark Wooding
  -->

<!------- Licensing notice --------------------------------------------------
  --
  -- This file is part of Chopwood: a password-changing service.
  --
  -- Chopwood is free software; you can redistribute it and/or modify
  -- it under the terms of the GNU Affero General Public License as
  -- published by the Free Software Foundation; either version 3 of the
  -- License, or (at your option) any later version.
  --
  -- Chopwood is distributed in the hope that it will be useful,
  -- but WITHOUT ANY WARRANTY; without even the implied warranty of
  -- MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE.  See the
  -- GNU Affero General Public License for more details.
  --
  -- You should have received a copy of the GNU Affero General Public
  -- License along with Chopwood; if not, see
  -- <http://www.gnu.org/licenses/>.
  -->~]~

<h1>Chopwood: accounts list</h1>

<form method=POST action="~={script}H">

<div class=expand-outer>
<div class=expand-inner>
<table class=expand>
  <tr><td>
    <h2><label for=acct-list accesskey=a>Your <u>a</u>ccounts</label></h2>
  <tr class=expand><td>
    <select multiple id=acct-list name=services>~={accts}{
    <option value=~={@.service}H>~
      ~={@.service}H: ~={@.friendly}:H~={@.alias}@[ (~H)~]~*~}
    </select>
</table>
<script type="text/javascript"><!--
        function check_accounts() {
          if (elt('acct-list').selectedIndex == -1)
            return 'No accounts selected.';
          return null;
        }
        FORMS.acct = {
          elts: ['list'],
          check: function () { return null; }
        }
--></script>
</div>

<div class=expand-reference>

<h2>Set a new password</h2>
<table>
<tr>
  <td class=label>
    <label for=set-first accesskey=p>New <u>p</u>assword:</label>
  <td>
    <input id=set-first type=password name=first>
<tr>
  <td class=label>
    <label for=set-second>Confirm password:</label>
  <td>
    <input id=set-second type=password name=second>
  <td>
    <button type=submit accesskey=s id=set-submit
            name=%act value=set><u>S</u>et</button>
<tr>
  <td colspan=3 class=whinge id=set-whinge align=center>OK
</table>
<script type="text/javascript"><!--
        function check_partial_passwd() {
          if (elt('set-first').value != '' ||
              elt('set-second').value != '')
            return 'Password at least partially entered.';
          return null;
        }
        FORMS.set = {
          elts: ['first', 'second'],
          check: function () {
            var w;
            if ((w = check_accounts()) !== null)
              return w;
            else if (elt('set-first').value == "")
              return 'Empty password not permitted.';
            else if (elt('set-first').value != elt('set-second').value)
              return 'Passwords don\u2019t match.';
            return null;
          }
        }
--></script>

<h2>Generate a new password</h2>
<button type=submit id=reset-submit accesskey=g
        name=%act value=reset><u>G</u>enerate</button>
<span class=whinge id=reset-whinge>OK</span>
<script type="text/javascript"><!--
        FORMS.reset = {
          check: function () {
            return check_accounts() || check_partial_passwd();
          }
        }
--></script>

<h2>Clear the existing passwords</h2>
<button type=submit id=clear-submit accesskey=c
        name=%act value=clear><u>C</u>lear</button>
<span class=whinge id=clear-whinge>OK</span>
<script type="text/javascript"><!--
        FORMS.clear = {
          check: function () {
            return check_accounts() || check_partial_passwd();
          }
        }
--></script>

</div>
</div>

<input type=hidden name=%user value="~={user}H">
<input type=hidden name=%nonce value="~={nonce}H">
</form>

~1[<!------- That's all, folks ------------------------------------------>~]~