separate sort orders for persons and events

angular_app/event-info.html

@@ -16,9 +16,11 @@
                 </div>
                 <div class="form-group">
                     <label for="persons-order">{{'Sort by:' | translate}}</label>
-                    <select id="persons-order" class="form-control" ng-model="orderProp">
-                        <option value="name" ng-selected="selected">{{'Alphabetical' | translate}}</option>
-                        <option value="_id">{{'ID' | translate}}</option>
+                    <select id="persons-order" class="form-control" ng-model="personsOrderProp">
+                        <option value="name" ng-selected="selected">{{'Name' | translate}}</option>
+                        <option value="-name" ng-selected="selected">{{'Name (descending)' | translate}}</option>
+                        <option value="surname" ng-selected="selected">{{'Surname' | translate}}</option>
+                        <option value="-surname" ng-selected="selected">{{'Surname (descending)' | translate}}</option>
                     </select>
                 </div>
             </form>
@@ -31,7 +33,7 @@
                     </tr>
                 </thead>
                 <tbody>
-                    <tr ng-repeat="person in event.persons | splittedFilter:query | orderBy:orderProp">
+                    <tr ng-repeat="person in event.persons | splittedFilter:query | orderBy:personsOrderProp">
                         <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/events-list.html

@@ -11,14 +11,16 @@
         <div class="panel-body">
             <form class="form-inline">
                 <div class="form-group">
-                    <label for="query-events">Search:</label>
+                    <label for="query-events">{{'Search:' | translate}}</label>
                     <input type="text" id="query-events" class="form-control" placeholder="{{'Event title' | translate}}" ng-model="query">
                 </div>
                 <div class="form-group">
                     <label for="events-order">Sort by:</label>
-                    <select id="events-order" class="form-control" ng-model="orderProp">
-                        <option value="title">Alphabetical</option>
-                        <option value="begin-datetime">Date</option>
+                    <select id="events-order" class="form-control" ng-model="eventsOrderProp">
+                        <option value="title">{{'Title' | translate}}</option>
+                        <option value="-title">{{'Title (descending)' | translate}}</option>
+                        <option value="begin-date">{{'Date' | translate}}</option>
+                        <option value="-begin-date">{{'Date (descending)' | translate}}</option>
                     </select>
                 </div>
             </form>
@@ -31,7 +33,7 @@
                     </tr>
                 </thead>
                 <tbody>
-                <tr ng-repeat="event in events | splittedFilter:query | orderBy:orderProp">
+                <tr ng-repeat="event in events | splittedFilter:query | orderBy:eventsOrderProp">
                     <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/controllers.js

@@ -41,7 +41,8 @@ eventManControllers.controller('DatetimePickerCtrl', ['$scope',
 eventManControllers.controller('EventsListCtrl', ['$scope', 'Event',
     function ($scope, Event) {
         $scope.events = Event.all();
-        $scope.orderProp = 'begin-datetime';
+        $scope.personsOrderProp = 'name';
+        $scope.eventsOrderProp = '-begin-date';
 
         $scope.remove = function(_id) {
             Event.remove({'id': _id}, function() {
@@ -54,6 +55,8 @@ eventManControllers.controller('EventsListCtrl', ['$scope', 'Event',
 
 eventManControllers.controller('EventDetailsCtrl', ['$scope', 'Event', '$stateParams', '$log',
     function ($scope, Event, $stateParams, $log) {
+        $scope.personsOrderProp = 'name';
+        $scope.eventsOrderProp = '-begin-date';
         if ($stateParams.id) {
             $scope.event = Event.get($stateParams);
         }
@@ -104,7 +107,8 @@ eventManControllers.controller('EventDetailsCtrl', ['$scope', 'Event', '$statePa
 eventManControllers.controller('PersonsListCtrl', ['$scope', 'Person',
     function ($scope, Person) {
         $scope.persons = Person.all();
-        $scope.orderProp = 'name';
+        $scope.personsOrderProp = 'name';
+        $scope.eventsOrderProp = '-begin-date';
 
         $scope.remove = function(_id) {
             Person.remove({'id': _id}, function() {
@@ -117,6 +121,8 @@ eventManControllers.controller('PersonsListCtrl', ['$scope', 'Person',
 
 eventManControllers.controller('PersonDetailsCtrl', ['$scope', '$stateParams', 'Person', 'Event', '$log',
     function ($scope, $stateParams, Person, Event, $log) {
+        $scope.personsOrderProp = 'name';
+        $scope.eventsOrderProp = '-begin-date';
         if ($stateParams.id) {
             $scope.person = Person.get($stateParams);
             Person.getEvents($stateParams, function(data) {

angular_app/person-info.html

@@ -11,26 +11,28 @@
         <div class="panel-body">
             <form class="form-inline">
                 <div class="form-group">
-                    <label for="query-persons">Search:</label>
+                    <label for="query-persons">{{'Search:' | translate}}</label>
                     <input type="text" id="query-persons" class="form-control" placeholder="{{'Name or email' | translate}}" ng-model="query">
                 </div>
                 <div class="form-group">
-                    <label for="events-order">Sort by:</label>
-                    <select id="events-order" class="form-control" ng-model="orderProp">
-                        <option value="name" ng-selected="selected">Alphabetical</option>
-                        <option value="date">Date</option>
+                    <label for="events-order">{{'Sort by:' | translate}}</label>
+                    <select id="events-order" class="form-control" ng-model="eventsOrderProp">
+                        <option value="title">{{'Title' | translate}}</option>
+                        <option value="-title">{{'Title (descending)' | translate}}</option>
+                        <option value="begin-date">{{'Date' | translate}}</option>
+                        <option value="-begin-date">{{'Date (descending)' | translate}}</option>
                     </select>
                 </div>
             </form>
             <table class="table">
                 <thead>
                     <tr>
-                        <th>Event</th>
-                        <th>Attended</th>
+                        <th>{{'Event' | translate}}</th>
+                        <th>{{'Attended' | translate}}</th>
                     </tr>
                 </thead>
                 <tbody>
-                    <tr ng-repeat="event in events">
+                    <tr ng-repeat="event in events | splittedFilter:query | orderBy:eventsOrderProp">
                         <td><strong><a ui-sref="event.info({id: event._id})">{{event.title}}</a></strong></td>
                         <td>
                             <button class="btn btn-link" name="switch-attended" ng-click="updateAttendee(event, !event.person_data.attended)"><span class="glyphicon {{(event.person_data.attended) && 'glyphicon-ok-sign text-success' || 'glyphicon-remove-sign text-danger'}}"></span></button>

angular_app/persons-list.html

@@ -20,9 +20,11 @@
                 </div>
                 <div class="form-group">
                     <label for="persons-order">{{'Sort by:' | translate}}</label>
-                    <select id="persons-order" class="form-control" ng-model="orderProp">
-                        <option value="name">{{'Alphabetical' | translate}}</option>
-                        <option value="_id">{{'ID' | translate}}</option>
+                    <select id="persons-order" class="form-control" ng-model="personsOrderProp">
+                        <option value="name" ng-selected="selected">{{'Name' | translate}}</option>
+                        <option value="-name" ng-selected="selected">{{'Name (descending)' | translate}}</option>
+                        <option value="surname" ng-selected="selected">{{'Surname' | translate}}</option>
+                        <option value="-surname" ng-selected="selected">{{'Surname (descending)' | translate}}</option>
                     </select>
                 </div>
             </form>
@@ -35,7 +37,7 @@
                     </tr>
                 </thead>
                 <tbody>
-                <tr ng-repeat="person in persons | splittedFilter:query | orderBy:orderProp">
+                <tr ng-repeat="person in persons | splittedFilter:query | orderBy:personsOrderProp">
                     <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>