javascript show/hide of different statuses

diff --git a/public/mojo_facets.css b/public/mojo_facets.css
index 09a8fb6..765b2eb 100644 (file)
--- a/public/mojo_facets.css
+++ b/public/mojo_facets.css
@@ -180,15 +180,19 @@ div.edit pre {
        color: #000;
 }
 
        color: #000;
 }
 

-.edit-unknown {
+tr.unknown {

        background: #eee;
 }
 
        background: #eee;
 }
 

-.edit-found {
+tr.found {

        background: #cfc;
 }
 
        background: #cfc;
 }
 

-.edit-missing {
+tr.missing {

        background: #fcc;
 }
 
        background: #fcc;
 }
 

+tr.hidden {
+       display: none;
+}
+

diff --git a/templates/changes/edits.html.ep b/templates/changes/edits.html.ep
index 7192346..25e688c 100644 (file)
--- a/templates/changes/edits.html.ep
+++ b/templates/changes/edits.html.ep
@@ -1,4 +1,4 @@
-% layout 'default';
+% layout 'ui';

 
 
 % my $apply_on_path = param('apply_on_path');
 
 
 % my $apply_on_path = param('apply_on_path');


@@ -13,9 +13,13 @@
 </form>
 
 % if ( $apply_on_path ) {
 </form>
 
 % if ( $apply_on_path ) {

-<ul>
+<ul id=status>

 %  foreach my $status ( keys %$stats ) {
 %  foreach my $status ( keys %$stats ) {

-<li><%= $status %> <span class=count><%= $stats->{$status} %></span>
+<li><label>
+<input name=show type=checkbox value="<%= $status %>" checked>
+<%= $status %>
+<span class=count><%= $stats->{$status} %></span>
+</label>

 %  }
 </ul>
 % }
 %  }
 </ul>
 % }


@@ -24,7 +28,7 @@
 <tr><th></th><th>old</th><th>new</th></tr>
 
 % foreach my $e ( @$edits ) {
 <tr><th></th><th>old</th><th>new</th></tr>
 
 % foreach my $e ( @$edits ) {

-<tr class="edit edit-<%= $e->{_status} || 'unknown' %>">
+<tr class="edit <%= $e->{_status} || 'unknown' %>">

 <td>
 <%= $e->{time} %>
 
 <td>
 <%= $e->{time} %>
 


@@ -47,3 +51,16 @@
 <pre class=debug>
 <%= dumper( $stats ) %>
 </pre>
 <pre class=debug>
 <%= dumper( $stats ) %>
 </pre>

+
+<script type="text/javascript">
+
+$(document).ready( function(){
+       console.debug('ready');
+       $('ul#status > li input[type=checkbox]').click( function(){
+               var toggle = this.value;
+               console.debug('click',this,toggle);
+               $('tr.'+toggle).toggleClass('hidden');
+       });
+});
+
+</script>