<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"
                      "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml"
      xmlns:py="http://genshi.edgewall.org/"
      xmlns:xi="http://www.w3.org/2001/XInclude">

  <xi:include href="master.html" />
  <xi:include href="lib.html" />

  <head>
    <meta content="text/html; charset=UTF-8" http-equiv="content-type" py:replace="''"/>
    <title>$c.project.name / Roles</title>

    <py:def function="role_select(name)">
      <select name="$name">
        <option py:for="r in c.project.roles"
                value="$r._id">${r.display()}</option>
      </select>
    </py:def>
  </head>

  <body>
    <h1 class="title">Project Roles for $c.project.shortname</h1>
    <div class="content">
      <div class="row">
        <div class="column grid_12">
          <div py:if="c.project.deleted" class="notice">This project has been deleted and is not visible to non-admin users</div>
          <p>
            Each user on the project has a private role.
            Each role can have subroles.  A role inherits all the permissions
            that its subroles have.  All users who have read access should
            automatically appear here.
          </p>
          <form method="POST" action="update_roles" id="roles_form">
            <input py:for="i,r in enumerate(c.project.roles)"
              type="hidden"
              name="role-${i}.id"
              value="$r._id"/>
            <table>
              <thead>
                <tr>
                  <th>User</th>
                  <th>Roles</th>
                  <th>Edit</th>
                  <th/>
                </tr>
              </thead>
              <tbody>
                <tr py:for="i, r in enumerate(c.project.roles)" class="${i%2 and 'even' or ''}">
                  <td>${r.display()}</td>
                  <td>
                    <span py:for="j, sr in enumerate(h.make_roles(r.roles))" class="removable">
                      ${sr.display()}
                      <input type="hidden" name="role-${i}.subroles-${j}.id" value="$sr._id"/>
                      <!--                       <input type="submit" name="role-${i}.subroles-${j}.delete" value="Del"/> -->
                    </span>
                  </td>
                  <td>
                    Acts as
                    <select name="role-${i}.new.id" style="width: 100px" class="add_role">
                      <option value=""> </option>
                      <option py:for="r in roles" py:if="not r.special" value="$r._id">
                        ${r.display()}
                      </option>
                    </select>
                    <input py:if="not r.special" name="role-${i}.delete" type="submit" value="Delete"
                     />
                  </td>
                </tr>
                <tr>
                  <td><input name="new.name" class="title"/></td>
                  <td colspan="3">
                    <input type="submit" name="new.add" value="Create Role"
                     />
                  </td>
                </tr>
              </tbody>
            </table>
          </form>
        </div>
      </div>
    </div>
  </body>
  <script type="text/javascript">
    /*<![CDATA[*/
    $('span.removable').click(function(e){
      var vals = $('#roles_form').serialize();
      var del_name = $('input', this)[0].name.replace('.id','.delete');
      $.post($('#roles_form')[0].action, vals+'&'+del_name+'=Del', function(){
        e.target.parentNode.removeChild(e.target);
      });
    });
    $('select.add_role').change(function(e){
      var vals = $('#roles_form').serialize();
      var add_name = e.target.name.replace('.id','.add');
      $.post($('#roles_form')[0].action, vals+'&'+add_name+'=Add', function(){
        window.location.reload();
      });
    });
    /*]]>*/
  </script>
</html>
