JS magic to add toggle support to Advanced Query

diff --git a/web/MonitorWeb/monitorweb/controllers.py b/web/MonitorWeb/monitorweb/controllers.py
index 5ac368b..b284851 100644 (file)
--- a/web/MonitorWeb/monitorweb/controllers.py
+++ b/web/MonitorWeb/monitorweb/controllers.py
@@ -63,6 +63,7 @@ class NodeQueryFields(widgets.WidgetsList):
 class QueryForm(widgets.TableForm):
     template = """
     <form xmlns:py="http://purl.org/kid/ns#"
+        id="queryform"
         name="${name}"
         action="${action}"
         method="${method}"

diff --git a/web/MonitorWeb/monitorweb/templates/query.kid b/web/MonitorWeb/monitorweb/templates/query.kid
index 55bcd30..f467237 100644 (file)
--- a/web/MonitorWeb/monitorweb/templates/query.kid
+++ b/web/MonitorWeb/monitorweb/templates/query.kid
@@ -13,11 +13,18 @@ from links import *
 
   <div py:match="item.tag == 'content'">
                <h2>Functional, but Under Development...</h2>
+
+<img id="toggle-image-visible-query" src="/plekit/icons/toggle-visible.png" style="height:18px;" onclick="plc_toggle('query')" />
+<img id="toggle-image-hidden-query" src="/plekit/icons/toggle-hidden.png" style="height:18px;display:none" onclick="plc_toggle('query')" /> <span style="font-size:2em;">Monitor Query</span>
+
+<div id="toggle-area-query">
                <table>
                        <tr>
                                <td>${queryform.display(method="GET", value=data)}</td>
                        </tr>
                </table>
+</div>
+
 <h4>Results</h4>
        <table py:if="fields and len(fields.keys()) > 0" id="querylist" cellpadding="0" border="0" class="plekit_table sortable-onload-0 colstyle-alt no-arrow paginationcallback-querylist_paginator max-pages-10 paginate-50" width="100%">
        <thead>
@@ -64,5 +71,16 @@ from links import *
                </tr>
       </tbody>
        </table>
+<script type="text/javascript">
+var lst = $("querylist");
+var tbody = lst.getElementsBySelector("tbody")[0];
+var trs = tbody.getElementsBySelector("tr");
+if (trs.length > 2) {
+ plc_toggle("query");
+}
+</script>
+
   </div>
+
+
 </html>

diff --git a/web/MonitorWeb/monitorweb/templates/sitemenu.kid b/web/MonitorWeb/monitorweb/templates/sitemenu.kid
index 70e532d..7dc567c 100644 (file)
--- a/web/MonitorWeb/monitorweb/templates/sitemenu.kid
+++ b/web/MonitorWeb/monitorweb/templates/sitemenu.kid
@@ -7,11 +7,13 @@
 
     <script type="text/javascript" src="/plekit/prototype/prototype.js"></script>
 
+    <script type="text/javascript" src="/plekit/toggle/toggle.js"></script>
     <script type="text/javascript" src="/plekit/tablesort/tablesort.js"></script>
     <script type="text/javascript" src="/plekit/tablesort/customsort.js"></script>
     <script type="text/javascript" src="/plekit/tablesort/paginate.js"></script>
     <script type="text/javascript" src="/plekit/table/table.js"></script>
     <link href="/plekit/table/table.css" rel="stylesheet" type="text/css" />
+    <link href="/plekit/toggle/toggle.css" rel="stylesheet" type="text/css" />
 
     <script type="text/javascript" src="/plekit/niftycorner/niftycube.js"></script>
     <script type="text/javascript" src="/plekit/niftycorner/nifty_init.js"></script>