]> git.plutz.net Git - serve0/blobdiff - templates/filterdiag.html.sh
html/css cleanup
[serve0] / templates / filterdiag.html.sh
index 5fbf2c3d2228313af61bcca1f394b27f19f31bae..2ebb22e3b452867281fd047429183826c4b99c8b 100755 (executable)
@@ -1,69 +1,90 @@
 #!/bin/zsh    
 
 cat <<FilterEnd
-  <div class="panel" id="search" style="display: block;">
-    <form action="?" method="get" accept-charset="UTF-8">
-      <input type="text" name="s" value="$search" placeholder="Search">
-      Order by:<select size="1" name="o">
-       <option>Name</option>
-       <option>Date</option>
-       <option>Length</option>
-      </select>
-      <input type="submit" name="submit" value="Find">
-      <a class="panel" href="?">Clear All</a>
-      <a class="panel" href="#" onclick="javascript:hide_block('search');show_block('advfilter');">Advanced</a>
-    <span style="float:right;">
-      <b>Page:</b> <a href="?i=$info&o=$order&p=$([ "$page" != 0 ] && echo $(($page - 1)) || echo 0)&f=$filter&s=$search#$anchor">&lt;&lt;</a>
-      <a href="?i=&o=$order&p=$page&f=$filter&s=$search#$anchor">$(($page + 1))</a>
-      <a href="?i=$info&o=$order&p=$(($page + 1))&f=$filter&s=$search#$anchor">&gt;&gt;</a>
-    </span>
-    </form>
-  </div>
+  <form class="panel" id="search" style="display: block;"
+        action="?" method="get" accept-charset="UTF-8">
+    <input type="text" name="s" value="$search" placeholder="Search">
+
+    <span class="label order">Order by:</span>
+    <select class="order" size="1" name="o">
+      <option>Name</option>
+      <option>Date</option>
+      <option>Length</option>
+    </select>
+    <input type="submit" name="submit" value="Find">
+
+    <a class="panel clearsearch" href="?">Clear All</a>
+    <a class="panel advanced show" href="#" onclick="javascript:hide('search');show_block('advfilter');">Advanced</a>
 
+    <div class="pagination_nav">
+      <span class="label">Page:</span>
+      <a href="?${page_prev}">&lt;&lt;</a>
+      <a href="?${page_this}">$(($page + 1))</a>
+      <a href="?${page_next}">&gt;&gt;</a>
+    </div>
+  </form>
 
-  <div class="panel" id="advfilter" style="display: none;">
+  <form class="panel" id="advfilter" style="display: none;"
+        action="?action=filter" method="post" accept-charset="UTF-8">
     <input disabled type="text" name="s" value="$search" placeholder="Search">
     <input disabled type="submit" name="submit" value="Find">
-    <a class="panel" href="?">Clear All</a>
-    <a class="panel" href="#" onclick="javascript:hide_block('advfilter');$(for n in {1..9}; do echo "hide_inline('filter$n');"; done)show_block('search')">Hide</a>
+
+    <a class="panel clearsearch" href="?">Clear All</a>
+    <a class="panel advanced hide" href="#" 
+     onclick="javascript:hide('advfilter');$(for n in {1..9}; do echo "hide('filter$n');"; done)show_block('search')"
+    >Hide</a>
     <hr>
-    Up to <b>10</b> filter boxes will appear as you start selecting tags. You can select <b>multiple</b> tags in each box by holding down the <b>Ctrl</b>-key. Click the "<b>Filter!</b>" button when you are ready.
-    <form action="?action=filter" method="post" accept-charset="UTF-8">
-    $(for n in {0..9}; do
-      hideall="$(sed -rn "s;^([^:]+):.*$;hide_inline('${n}_\\1')\\;;p" <<<"$taglist" |sort -u)hide_inline('${n}_none');"
-      echo "
-      <div id=\"filter$n\" $([ $n -gt 0 ] && echo 'style="display:none;"')><b>and</b><br>
-        <input type=\"radio\" name=\"type$n\" value=\"pos\" checked><b>Any</b><br>
-        <input type=\"radio\" name=\"type$n\" value=\"neg\"><b>None</b><br>
-        of the tags selected here:<br> Category:
-        <select name=\"category\" size=\"1\" onchange=\"${hideall}show_inline('${n}_'+this.options[this.options.selectedIndex].value)\">
-          <option>none</option>
-          $(sed -rn 's;^([^:]+):.*$;<option>\1</option>;p' <<<"$taglist" |sort -u)
-        </select><br>
-        <select name=\"filter\" size=\"12\" multiple id=\"${n}_none\" onchange=\"show_inline('filter$((1+$n))')\">
-           $(sed -rn 's;^([^:]+)$;<option>\1</option>;p' <<<"$taglist")
-        </select>
-        $(sed -rn 's;^([^:]+):.*$;\1;p' <<<"$taglist" |sort -u |while read cat; do echo "
-        <select name=\"cfilter\" size=\"12\" multiple id=\"${n}_$cat\" style=\"display:none;\" onchange=\"show_inline('filter$((1+$n))')\">
-           $(sed -rn "s;^$cat:(.*)$;<option>\\1</option>;p" <<<"$taglist")
-        </select>"
-        done)
-      </div>"
-    done)
-      <div>
-        Order by:<select size="1" name="o">
-          <option>Name</option>
-          <option>Date</option>
-         <option>Length</option>
-        </select><br>
-        <input type="submit" value="Filter!">
-      </div>
-    </form>
 
-    <br/>
-    <h2>Most recent</h2>
-    $(uniq ${_DATA}/meta/recent |tail -n 10 |sed -r 's:^(.*)$:<a href="\1">\1</a><br/>:g')
-  </div>
+    <span class="help">Up to <b>10</b> filter boxes will appear as you start selecting tags. You can select <b>multiple</b> tags in each box by holding down the <b>Ctrl</b>-key. Click the "<b>Filter!</b>" button when you are ready.</span>
+
+  $(for n in {0..9}; do
+    hideall="$(sed -rn "s;^([^:]+):.*$;hide('${n}_\\1')\\;;p" <<<"$taglist" |sort -u)hide('${n}_none');"
+    echo "
+    <div class="filter" id=\"filter$n\" $([ $n -gt 0 ] && echo 'style="display:none;"')>
+      <span class=\"help conjunction\">and</span>
+      <input type=\"radio\" name=\"type$n\" value=\"pos\" checked><span class=\"label conjunction\">Any</span>
+      <input type=\"radio\" name=\"type$n\" value=\"neg\"><span class=\"label conjunction\">None</span>
+      <span class=\"help\">of the tags selected here:</span>
+      <span class=\"label category\">Category:</span>
+      <select class=\"input category\" name=\"category\" size=\"1\" onchange=\"${hideall}show_block('${n}_'+this.options[this.options.selectedIndex].value)\">
+        <option>none</option>
+        $(sed -rn 's;^([^:]+):.*$;<option>\1</option>;p' <<<"$taglist" |sort -u)
+      </select>
+      <select class=\"input tagfilter\" name=\"filter\" size=\"12\" multiple id=\"${n}_none\"
+              onchange=\"show_iblock('filter$((1+$n))')\">
+         $(sed -rn 's;^([^:]+)$;<option>\1</option>;p' <<<"$taglist")
+      </select>
+      $(sed -rn 's;^([^:]+):.*$;\1;p' <<<"$taglist" |sort -u |while read cat; do echo "
+      <select class=\"input tagfilter\" name=\"cfilter\" size=\"12\" multiple id=\"${n}_$cat\" style=\"display:none;\"
+              onchange=\"show_iblock('filter$((1+$n))')\">
+         $(sed -rn "s;^$cat:(.*)$;<option>\\1</option>;p" <<<"$taglist")
+      </select>"
+      done)
+    </div>"
+  done)
+
+    <div class="filter final">
+      <span class="label order">Order by:</span>
+      <select class="edit order" size="1" name="o">
+        <option>Name</option>
+        <option>Date</option>
+        <option>Length</option>
+      </select>
+      <input type="submit" value="Filter!">
+    </div>
+
+    <div class="quicklinks">
+      <span class="label quicklinks">Most recent</span>
+      $(output=''
+        tac ${_DATA}/meta/recent |while [ "$(echo "$output" |wc -l)" -lt 10 ]; do
+          read line
+          line="<a href="$line">$line</a>"
+          echo "$output" |grep -qF "$line" || output="$output$line\n"
+        done
+        echo $output
+      )
+    </div>
+  </form>
 FilterEnd
 
 # vi:set filetype=html: