diff options
Diffstat (limited to 'templates')
-rw-r--r-- | templates/todolists/list.html | 36 | ||||
-rw-r--r-- | templates/todolists/view.html | 86 |
2 files changed, 80 insertions, 42 deletions
diff --git a/templates/todolists/list.html b/templates/todolists/list.html index 980328a..6edf132 100644 --- a/templates/todolists/list.html +++ b/templates/todolists/list.html @@ -9,22 +9,26 @@ {% endif %} <h2 class="title">Package ToDo lists</h2> <table class="results" width="100%"> - <tr> - <th>Name</th> - <th>Creation Date</th> - <th>Creator</th> - <th>Description</th> - <th>Status</th> - </tr> - {% for list in lists %} - <tr class="{% cycle pkgr2,pkgr1 %}"> - <td style="white-space:nowrap"><a href="/todo/{{ list.id }}/">{{ list.name }}</a></td> - <td>{{ list.date_added }}</td> - <td>{{ list.creator.get_full_name }}</td> - <td>{{ list.description }}</td> - <td>{% if list.complete %}<span style="color:blue">Complete</span>{% else %}<span style="color:red">Incomplete</span>{% endif %}</td> - </tr> - {% endfor %} + <thead> + <tr> + <th>Name</th> + <th>Creation Date</th> + <th>Creator</th> + <th>Description</th> + <th>Status</th> + </tr> + </thead> + <tbody> + {% for list in lists %} + <tr class="{% cycle pkgr2,pkgr1 %}"> + <td style="white-space:nowrap"><a href="/todo/{{ list.id }}/">{{ list.name }}</a></td> + <td>{{ list.date_added }}</td> + <td>{{ list.creator.get_full_name }}</td> + <td>{{ list.description }}</td> + <td>{% if list.complete %}<span style="color:blue">Complete</span>{% else %}<span style="color:red">Incomplete</span>{% endif %}</td> + </tr> + {% endfor %} + </tbody> </table> </div> {% endblock %} diff --git a/templates/todolists/view.html b/templates/todolists/view.html index b77e6e7..8fe6014 100644 --- a/templates/todolists/view.html +++ b/templates/todolists/view.html @@ -1,33 +1,67 @@ {% extends "base.html" %} - +{% block head %} +<script type="text/javascript" src="/media/jquery-1.2.3.min.js"></script> +<script type="text/javascript" src="/media/jquery.tablesorter.min.js"></script> +<script type="text/javascript"> + $(document).ready( + function(){ + $("#todotable").tablesorter({widgets: ['zebra']}); + } + ); +</script> +<style type="text/css"> + table#todotable thead tr .header { + background-image: url('/media/bg.gif'); + background-repeat: no-repeat; + background-position: center right; + cursor: pointer; + } + table#todotable thead tr .headerSortUp { + background-image: url('/media/asc.gif'); + } + table#todotable thead tr .headerSortDown { + background-image: url('/media/desc.gif'); + } + table#todotable thead tr .headerSortDown, table.todotable thead tr .headerSortUp { + background-color: #8dbdd8; + } + table#todotable tbody tr.odd { + background-color: #eee4cb; + } +</style> +{% endblock %} {% block content %} <div class="greybox"> <h3 class="title">ToDo List: {{ list.name }}</h2> - <table class="results" width="100%"> - <tr> - <th>ID</th> - <th>Arch</th> - <th>Repo</th> - <th>Name</th> - <th>Maintainer</th> - <th>Status</th> - </tr> - {% for pkg in pkgs %} - <tr class="{% cycle pkgr1,pkgr2 %}"> - <td><a href="/packages/{{ pkg.pkg.id }}/">{{ pkg.pkg.id }}</a></td> - <td>{{ pkg.pkg.arch.name }}</td> - <td>{{ pkg.pkg.repo.name }}</td> - <td>{{ pkg.pkg.pkgname }}</td> - <td>{{ pkg.pkg.maintainer.get_full_name }}</td> - <td> - {% if pkg.complete %} - <a href="/todo/flag/{{ list.id }}/{{ pkg.id }}/"><span style="color:blue">Complete</span></a> - {% else %} - <a href="/todo/flag/{{ list.id }}/{{ pkg.id }}/"><span style="color:red">Incomplete</span></a> - {% endif %} - </td> - </tr> - {% endfor %} + <table id="todotable" class="results" width="100%"> + <thead> + <tr> + <th>ID</th> + <th>Arch</th> + <th>Repo</th> + <th>Name</th> + <th>Maintainer</th> + <th>Status</th> + </tr> + </thead> + <tbody> + {% for pkg in pkgs %} + <tr class="{% cycle even,odd %}"> + <td><a href="/packages/{{ pkg.pkg.id }}/">{{ pkg.pkg.id }}</a></td> + <td>{{ pkg.pkg.arch.name }}</td> + <td>{{ pkg.pkg.repo.name }}</td> + <td>{{ pkg.pkg.pkgname }}</td> + <td>{{ pkg.pkg.maintainer.get_full_name }}</td> + <td> + {% if pkg.complete %} + <a href="/todo/flag/{{ list.id }}/{{ pkg.id }}/"><span style="color:blue">Complete</span></a> + {% else %} + <a href="/todo/flag/{{ list.id }}/{{ pkg.id }}/"><span style="color:red">Incomplete</span></a> + {% endif %} + </td> + </tr> + {% endfor %} + </tbody> </table> </div> {% endblock %} |