filter list by few facet checkboxes
authorDobrica Pavlinusic <dpavlin@rot13.org>
Sat, 12 Jan 2013 23:55:10 +0000 (00:55 +0100)
committerDobrica Pavlinusic <dpavlin@rot13.org>
Sat, 12 Jan 2013 23:55:10 +0000 (00:55 +0100)
app/js/controllers.js
app/partials/list.html.ep

index 9454ff9..a025606 100644 (file)
@@ -168,35 +168,58 @@ function ListCtrl($scope, $log, Registration, RegistrationTypes, $filter) {
        $scope.list = [];
        $scope.search = {};
        $scope.ready = false;
+       $scope.filters = [ 'student', 'hpd_member', 'reception', 'dinner' ];
 
        $scope.all_registrations = Registration.query( function() {
-               var RegistrationTypeCount = { '': 0 };
-               angular.forEach( $scope.all_registrations, function(value, key) {
-                       var type = value.user.registration_type;
-                       if ( ! angular.isNumber( RegistrationTypeCount[type] ) ) {
-                               RegistrationTypeCount[type] = 1;
+               var Counts = {};
+               var inc_count = function(type) {
+                       if ( ! angular.isNumber( Counts[type] ) ) {
+                               Counts[type] = 1;
                        } else {
-                               RegistrationTypeCount[type]++;
+                               Counts[type]++;
                        }
-                       RegistrationTypeCount['']++;
+               };
+               angular.forEach( $scope.all_registrations, function(value, key) {
+                       var type = value.user.registration_type;
+                       inc_count( type );
+                       inc_count( '' ); // total
+                       angular.forEach( $scope.filters, function(subtype) {
+                               var v = value.user[subtype];
+                               if ( v === 'yes' || v === true ) {
+                                       inc_count( subtype );
+                                       inc_count( type + '+' + subtype );
+                                       inc_count( '+' + subtype ); // total
+                               }
+                       });
 
-                       value.registration_type = type; // for search
-                       
-//                     $log.info( key, value.user.registration_type, RegistrationTypeCount[type]  );
+                       // for filter
+                       value.registration_type = type;
+                       angular.forEach( $scope.filters, function(f) {
+                               var v = value.user[f];
+                               value[f] = v == true || v == 'yes' ? true : false;
+                       });
+
+//                     $log.info( key, value, Counts[type]  );
                });
-               $log.info('RegistrationTypeCount', RegistrationTypeCount);
-               $scope.RegistrationTypeCount = RegistrationTypeCount;
+               $log.info('Counts', Counts);
+               $scope.Counts = Counts;
 
-//             $scope.list = $scope.all_registrations; // FIXME show all registrations on page load
+//             $scope.list = $scope.all_registrations; // FIXME show all registrations on page loadyy
                $scope.ready = true;
+
        });
 
        $scope.filter_list = function(newVal, oldVal) {
+               $log.info('filter_list', newVal, oldVal, 'search', $scope.search);
                $scope.list = $filter('filter')($scope.all_registrations, $scope.search);
-               $log.info('filter_list', newVal, oldVal, 'search', $scope.search, 'results', $scope.list);
+               $log.info('list', $scope.list);
        };
+       angular.forEach( $scope.filters, function(f) {
+               $scope.$watch('search.'+f, $scope.filter_list);
+               $log.info('watch search.'+f);
+       });
        $scope.$watch('search.registration_type', $scope.filter_list);
-       $scope.$watch('search.$', $scope.filter_list); // $ is skipped by search watch!!
+       $scope.$watch('search.$', $scope.filter_list);
 
        $scope.RegistrationTypes = RegistrationTypes;
        $log.info( "RegistrationTypes", RegistrationTypes );
index 2a05bc2..2bfa179 100644 (file)
@@ -5,24 +5,45 @@ Loading data...
 
 <form ng-controller="ListCtrl" class="form-search" ng-show="ready">
 
+<div class="controls-row">
+
 <h2>Odaberite tip registracije</h2>
 
-<label class="radio input-block-level" ng-repeat="type in RegistrationTypes" ng-switch on="type.code" ng-show="RegistrationTypeCount[type.code] > 0">
+<label class="radio input-block-level" ng-repeat="type in RegistrationTypes" ng-switch on="type.code" ng-show="Counts[type.code] > 0">
 <hr ng-switch-when="false">
 <span ng-switch-default>
- <span class="badge {{type.css_class}}">{{RegistrationTypeCount[type.code]}}</span>
+ <span class="badge {{type.css_class}}">{{Counts[type.code]}}</span>
  <input type="radio" name="search.registration_type" ng-model="search.registration_type" value="{{type.code}}" >
  {{type.label}}
 <!--
  <i>{{type.description}}</i>
 -->
+ <span class="badge" ng-repeat="subtype in filters" ng-show="Counts[type.code+'+'+subtype]"+>
+       {{Counts[type.code+'+'+subtype]}} {{subtype}}
+ </span>
 </span>
 </label>
 
+</div>
+
+<div class="controls-row">
+filters
+<label class="badge" ng-repeat="filter in filters">
+ <input ng-model="search[filter]" type="checkbox">
+ <span class="blob">{{Counts[filter]}}</span>
+ {{filter}}
+</label>
+
+</div>
+
 <div>
+
+<label>
 Search:
 <input class="search-query" ng-model="search.$">
-<a class="btn btn-invert" href="" ng-click="search.$ = ''">
+</label>
+
+<a class="btn btn-invert" href="" ng-click="search = {}">
 <i class="icon-remove"></i></a>
 <b>{{list.length}} results</b>
 <tt>{{search}}</tt>
@@ -42,5 +63,11 @@ Search:
 
 </div><!-- ng-show="list.length"-->
 
+% if ( $lang =~ m/-dev/ ) {
+<pre class="controls-row">
+{{Counts}}
+</pre>
+% }
+
 </form>