Add filter and sort options to “known Sones” page.

[Sone.git] / src / main / resources / templates / knownSones.html

diff --git a/src/main/resources/templates/knownSones.html b/src/main/resources/templates/knownSones.html
index 2ff7b82..fde1060 100644 (file)
--- a/src/main/resources/templates/knownSones.html
+++ b/src/main/resources/templates/knownSones.html
@@ -1,13 +1,62 @@
-<div id="sone">
+<%include include/head.html>
+
+       <div class="page-id hidden">known-sones</div>
+       
+       <script language="javascript">
+
+               $(document).ready(function() {
+                       $("select[name=sort]").change(function() {
+                               value = $(this).val();
+                               if (value == "activity") {
+                                       $("select[name=order]").val("desc");
+                               } else if (value == "name") {
+                                       $("select[name=order]").val("asc");
+                               } 
+                       });
+               });
+       
+       </script>
 
        <h1><%= Page.KnownSones.Page.Title|l10n|html></h1>
+       
+       <div id="sort-options">
+               <form action="knownSones.html" method="get">
+                       <div>
+                               Sort:
+                               <select name="sort">
+                                       <option value="name"<%if sort|match value="name"> selected="selected"<%/if>>Name</option>
+                                       <option value="activity"<%if sort|match value="activity"> selected="selected"<%/if>>Last activity</option>
+                               </select>
+                               <select name="order">
+                                       <option value="asc"<%if order|match value="asc"> selected="selected"<%/if>>Ascending</option>
+                                       <option value="desc"<%if order|match value="desc"> selected="selected"<%/if>>Descending</option>
+                               </select>
+                       </div>
+                       <%ifnull !currentSone>
+                               <div>
+                                       Followed Sones:
+                                       <select name="followedSones">
+                                               <option value="none"></option>
+                                               <option value="show-only"<%if followedSones|match value="show-only"> selected="selected"<%/if>>Show only followed Sones</option>
+                                               <option value="hide"<%if followedSones|match value="hide"> selected="selected"<%/if>>Hide followed Sones</option>
+                                       </select>
+                               </div>
+                       <%/if>
+                       <div>
+                               <button type="submit">Apply</button>
+                       </div>
+               </form>
+       </div>
 
        <div id="known-sones">
-               <%foreach knownSones sone>
-                       <div><a href="viewSone.html?sone=<% sone.id>"><% sone.niceName|html></a> (<% sone.requestUri|html>)</div>
+               <%= page|store key=pageParameter>
+               <%include include/pagination.html>
+               <%foreach pagination.items sone>
+                       <%include include/viewSone.html>
                <%foreachelse>
                        <div><%= Page.KnownSones.Text.NoKnownSones|l10n|html></div>
                <%/foreach>
+               <%include include/pagination.html>
        </div>
 
-</div>
+<%include include/tail.html>