search on space-separated words

DEVELOPMENT.md

@@ -100,7 +100,6 @@ Next to be done
 ---------------
 
 - easy way to add a new person to an event
-- search on both name and surname, for persons
 - add the minimum required fields to lists and detailed pages for persons and events
 - handle datetimes (on GUI with a calendar and on the backend deserializing ISO 8601 strings)
 - modal on event/person removal

angular_app/event-edit.html

@@ -2,7 +2,7 @@
 <div class="container">
     <h1><span ng-if="!event.title">{{'New event' | translate}}</span>{{event.title}}&nbsp;
         <button ng-if="event._id" ng-click="$state.go('event.info', {id: event._id})" class="btn btn-success">
-            <span class="glyphicon glyphicon-plus-sign"></span>
+            <span class="glyphicon glyphicon-info-sign"></span>
             {{'Info' | translate}}
         </button>
     </h1>

angular_app/event-info.html

@@ -2,7 +2,7 @@
 <div class="container">
     <h1>{{event.title}}
         <button ng-if="event._id" ng-click="$state.go('event.edit', {id: event._id})" class="btn btn-success">
-            <span class="glyphicon glyphicon-plus-sign"></span>
+            <span class="glyphicon glyphicon-edit"></span>
             {{'Edit' | translate}}
         </button>
     </h1>
@@ -31,7 +31,7 @@
                     </tr>
                 </thead>
                 <tbody>
-                    <tr ng-repeat="person in event.persons | filter:query | orderBy:orderProp">
+                    <tr ng-repeat="person in event.persons | splittedFilter:query | orderBy:orderProp">
                         <td><strong><a ui-sref="person.info({id: person.person_id})">{{person.name}} {{person.surname}}</a></strong></td>
                         <td>
                             <button class="btn btn-link" name="switch-attended" ng-click="updateAttendee(person, !person.attended)"><span class="glyphicon {{(person.attended) && 'glyphicon-ok-sign text-success' || 'glyphicon-remove-sign text-danger'}}"></span></button>

angular_app/event-main.html

@@ -1,2 +1,8 @@
 <!-- main view for Event -->
-<div ui-view></div>
+<!-- div class="container">
+    <ul class="nav nav-tabs">
+        <li ui-sref-active="active"><a ui-sref="event.info({id: $state.params.id})">Info</a></li>
+        <li ui-sref-active="active"><a ui-sref="event.edit({id: $state.params.id})">Edit</a></li>
+    </ul -->
+    <div ui-view></div>
+<!-- /div -->

angular_app/events-list.html

@@ -31,7 +31,7 @@
                     </tr>
                 </thead>
                 <tbody>
-                <tr ng-repeat="event in events | filter:query | orderBy:orderProp">
+                <tr ng-repeat="event in events | splittedFilter:query | orderBy:orderProp">
                     <td>
                         <span><strong><a ui-sref="event.info({id: event._id})">{{event.title}}</a></strong></span>
                         <p>{{'Begins:' | translate}} {{event['begin-date']}}<br/>

angular_app/js/app.js

@@ -27,10 +27,26 @@ var eventManApp = angular.module('eventManApp', [
 
 
 /* Add some utilities to the global scope. */
-eventManApp.run(function($rootScope, $state, $stateParams) {
-    $rootScope.$state = $state;
-    $rootScope.$stateParams = $stateParams;
-});
+eventManApp.run(['$rootScope', '$state', '$stateParams',
+    function($rootScope, $state, $stateParams) {
+        $rootScope.$state = $state;
+        $rootScope.$stateParams = $stateParams;
+    }]
+);
+
+
+/* Filter that handles splitted words. */
+eventManApp.filter('splittedFilter', ['$filter',
+    function($filter) {
+        return function(inputArray, searchText) {
+            var wordArray = searchText ? searchText.toLowerCase().split(/\s+/) : [];
+            for (var x=0; x < wordArray.length; x++) {
+                inputArray = $filter('filter')(inputArray, wordArray[x]);
+            }
+            return inputArray;
+        };
+    }]
+);
 
 
 /* Directive that can be used to make an input field react to the press of Enter. */

angular_app/person-edit.html

@@ -2,7 +2,7 @@
 <div class="container">
     <h1><span ng-if="!(person.name || person.surname)">{{'New person' | translate}}</span>{{person.name}} {{person.surname}}&nbsp;
         <button ng-if="person._id" ng-click="$state.go('person.info', {id: person._id})" class="btn btn-success">
-            <span class="glyphicon glyphicon-plus-sign"></span>
+            <span class="glyphicon glyphicon-info-sign"></span>
             {{'Info' | translate}}
         </button>
     </h1>

angular_app/person-info.html

@@ -2,7 +2,7 @@
 <div class="container">
     <h1>{{person.name}} {{person.surname}}
         <button ng-if="person._id" ng-click="$state.go('person.edit', {id: person._id})" class="btn btn-success">
-            <span class="glyphicon glyphicon-plus-sign"></span>
+            <span class="glyphicon glyphicon-edit"></span>
             {{'Edit' | translate}}
         </button>
     </h1>

angular_app/persons-list.html

@@ -35,7 +35,7 @@
                     </tr>
                 </thead>
                 <tbody>
-                <tr ng-repeat="person in persons | filter:query | orderBy:orderProp">
+                <tr ng-repeat="person in persons | splittedFilter:query | orderBy:orderProp">
                     <td>
                         <span><strong><a ui-sref="person.info({id: person._id})"><span>{{person.name}}</span>&nbsp;<span>{{person.surname}}</span></a></strong></span>
                         <p>{{person.email}}</p>