Improve query UI.

Author: stefanseefeld

share/roundup/templates/devel/html/_generic.query.html

@@ -0,0 +1,41 @@
+<tal:block tal:define="vok context/is_view_ok">
+  <p tal:condition="not:vok" i18n:translate="">You are not
+  allowed to view this page.</p>
+
+  <tal:if condition="context/is_view_ok">
+   <tal:def define="batch request/batch">
+    <form>
+     <table class="classhelp"
+            tal:define="props python:request.form['properties'].value.split(',');
+                        legend templates/query/macros/legend;
+                        navigation templates/query/macros/navigation;">
+      <thead>
+	<tr metal:use-macro="navigation"/>
+        <tr metal:use-macro="legend"/>
+      </thead>
+      <tfoot tal:condition=true>
+        <tr metal:use-macro="legend"/>
+	<tr metal:use-macro="navigation"/>
+      </tfoot>
+      <tbody>
+       <tr tal:repeat="item request/batch">
+         <tal:block tal:define="attr python:item[props[0]]" >
+           <td>
+             <input name="check"
+             onclick="switch_val(text_field, this);" type="checkbox"
+             tal:attributes="value attr; id string:id_$attr" />
+             </td>
+             <td tal:repeat="prop props">
+                 <label class="classhelp-label"
+                        tal:attributes="for string:id_$attr"
+                        tal:content="structure python:item[prop]"></label>
+             </td>
+           </tal:block>
+         </tr>
+       </tbody>
+     </table>
+    </form>
+   </tal:def> <!-- batch -->
+  </tal:if>
+</tal:block>
+

share/roundup/templates/devel/html/query.html

@@ -0,0 +1,27 @@
+<!-- Query-related macros -->
+
+<!-- legend for query results -->
+<tr metal:define-macro="legend">
+  <th><b>x</b></th>
+  <th tal:repeat="prop props" tal:content="prop" i18n:translate=""></th>
+</tr>
+
+<!-- navigation for query results -->
+<tr metal:define-macro="navigation" 
+    tal:define="prev batch/previous;
+                next batch/next;"
+    tal:condition="python:prev or next">
+  <th tal:condition="prev" width="30%">
+    <input type="button" value="prev"
+	   tal:attributes="onclick string:query_start(${prev/start}, ${prev/size})"/>
+  </th>
+  <th i18n:translate="" width="40%">
+    <span tal:replace="batch/start" i18n:name="start"/>..
+    <span tal:replace="python: batch.start + batch.length -1" i18n:name="end"/> out of 
+    <span tal:replace="batch/sequence_length" i18n:name="total"/>
+  </th>
+ <th tal:condition="next" width="30%">
+    <input type="button" value="next" 
+	   tal:attributes="onclick string:query_start(${next/start}, ${next/size})"/>
+  </th>
+</tr>

share/roundup/templates/devel/html/query.js

@@ -0,0 +1,40 @@
+var action;
+
+function display(data)
+{
+  var list = $("div.list");
+  list.empty();
+  list.append(data);
+}
+
+// Run a query with a specific starting point and size
+function query_start(start, size)
+{
+  var inputs = $(":input");
+  var data = {}
+  if (start > 0) data['@startwith'] = start
+  if (size > -1) data['@pagesize'] = size
+  for (var i = 0; i < inputs.length; i++)
+    data[inputs[i].name] = inputs[i].value;
+  jQuery.get(action, data, display);
+  return false;
+}
+
+// Run a query, starting at the first element
+function query()
+{
+  return query_start(0, -1)
+}
+
+// Deactivate the form's submit action, and instead
+// invoke the action as part of (inline) query.
+function replace_submit()
+{
+  var form = $("form");
+  action = form.attr("action");
+  form.attr("action",""); // reset
+  form.submit(query);
+}
+
+
+$(document).ready(replace_submit);

share/roundup/templates/devel/html/search.js

@@ -5,7 +5,7 @@
                   form request/form/form/value;
                   field request/form/property/value">
   <tal:block metal:fill-slot="more-javascript">
-     <script language="Javascript" type="text/javascript" tal:content="structure string:<!--
+     <script language="Javascript" type="text/javascript">
       // this is the name of the field in the original form that we're working on
       form  = parent.opener.document.${request/form/form/value};
       callingform=form
@@ -31,10 +31,9 @@
         alert('checkListForm: bol='+bol)
         return bol
       }
-      //-->">
     </script>
     <script src="@@file/jquery.js" type="text/javascript"></script>
-    <script src="@@file/search.js" type="text/javascript"></script>
+    <script src="@@file/query.js" type="text/javascript"></script>
   </tal:block>
   <tal:block metal:fill-slot="content">
     <div name="search">
@@ -50,7 +49,7 @@
                         search_select_roles templates/page/macros/search_select_roles;
                         required python:[];
                         th_label templates/page/macros/th_label; ">
-       <input type="hidden" name="@template" value="help-list">
+       <input type="hidden" name="@template" value="query">
        <input type="hidden" name="property" value="" tal:attributes="value property">
        <input type="hidden" name="form" value="" tal:attributes="value request/form/form/value">
        <table>
@@ -85,8 +84,10 @@
       </form>
       <script type="text/javascript"><!-- focus2id('username'); //--></script>
     </div>
-    <!-- for search results: help-list -->
-    <div class="list"><p i18n:translate="">Please specify your search parameters!</p></div>
+    <!-- for search results: query -->
+    <div class="list">
+      <p i18n:translate="">Please specify your search parameters!</p>
+    </div>
     <div class="submit" onload="parent.focus();" id="submit">
     <form name="frm_help"
           tal:define="batch request/batch;