o Much better person list.

7 files changed, 139 insertions, 53 deletions

diff --git a/src/main/java/io/trygvis/esper/testing/util/Gravatar.java b/src/main/java/io/trygvis/esper/testing/util/Gravatar.java
new file mode 100644
index 0000000..c98662d
--- /dev/null
+++ b/src/main/java/io/trygvis/esper/testing/util/Gravatar.java
@@ -0,0 +1,28 @@
+package io.trygvis.esper.testing.util;
+
+import java.io.*;
+import java.security.*;
+
+public class Gravatar {
+    public static String hex(byte[] array) {
+        StringBuilder sb = new StringBuilder();
+        for (byte anArray : array) {
+            sb.append(Integer.toHexString((anArray & 0xFF) | 0x100).substring(1, 3));
+        }
+        return sb.toString();
+    }
+
+    public static String md5Hex(String message) {
+        try {
+            MessageDigest md = MessageDigest.getInstance("MD5");
+            return hex(md.digest(message.getBytes("CP1252")));
+        } catch (NoSuchAlgorithmException e) {
+        } catch (UnsupportedEncodingException e) {
+        }
+        return null;
+    }
+
+    public static String gravatar(String mail) {
+        return "http://www.gravatar.com/avatar/" + md5Hex(mail.trim().toLowerCase());
+    }
+}
diff --git a/src/main/java/io/trygvis/esper/testing/web/resource/CoreResource.java b/src/main/java/io/trygvis/esper/testing/web/resource/CoreResource.java
index 4ab95c6..22290d9 100755
--- a/src/main/java/io/trygvis/esper/testing/web/resource/CoreResource.java
+++ b/src/main/java/io/trygvis/esper/testing/web/resource/CoreResource.java
@@ -148,7 +148,7 @@ public class CoreResource extends AbstractResource {
 
         protected final SqlF<PersonDto, PersonJson> getPersonJson = new SqlF<PersonDto, PersonJson>() {
             public PersonJson apply(PersonDto person) throws SQLException {
-                return new PersonJson(person.uuid, person.name);
+                return new PersonJson(person.uuid, person.name, person.mail);
             }
         };
 
diff --git a/src/main/java/io/trygvis/esper/testing/web/resource/PersonJson.java b/src/main/java/io/trygvis/esper/testing/web/resource/PersonJson.java
index 65b081c..285ae8e 100755
--- a/src/main/java/io/trygvis/esper/testing/web/resource/PersonJson.java
+++ b/src/main/java/io/trygvis/esper/testing/web/resource/PersonJson.java
@@ -4,13 +4,20 @@ import io.trygvis.esper.testing.*;
 
 import java.util.*;
 
+import static io.trygvis.esper.testing.util.Gravatar.*;
+
 public class PersonJson {
     public final Uuid uuid;
     public final String name;
+    public final String mail;
+    public final String gravatar;
 
-    public PersonJson(Uuid uuid, String name) {
+    public PersonJson(Uuid uuid, String name, String mail) {
         this.uuid = uuid;
         this.name = name;
+        this.mail = mail;
+
+        gravatar = gravatar(mail);
     }
 }
 
diff --git a/src/main/webapp/apps/app.js b/src/main/webapp/apps/app.js
index 3e01e9e..3d200ec 100644
--- a/src/main/webapp/apps/app.js
+++ b/src/main/webapp/apps/app.js
@@ -1,5 +1,36 @@
 var directives = angular.module('core.directives', []);
 
+directives.filter('countBadgeByLevel', function () {
+  return function (badges) {
+    // 5 levels
+    var levels = [0, 0, 0, 0, 0];
+    angular.forEach(badges, function(value, key){
+      levels[value.level - 1]++;
+    });
+    return levels;
+  }
+});
+
+directives.filter('gz', function () {
+  return function (num) {
+    if(angular.isArray(num)) {
+      var out = [];
+      angular.forEach(num, function(x){
+        if(x > 0) {
+          out.push(x);
+        }
+      });
+
+      return out;
+    }
+    else if(angular.isNumber(num)) {
+      return num > 0;
+    }
+    console.log("fail");
+    return undefined;
+  }
+});
+
 directives.directive('navbar', function () {
   return {
     restrict: 'E',
@@ -7,7 +38,7 @@ directives.directive('navbar', function () {
   };
 });
 
-directives.directive('badge', function() {
+directives.directive('badge', function () {
   return {
     restrict: 'E',
     scope: {
@@ -19,19 +50,3 @@ directives.directive('badge', function() {
         '<a href="/#/person/{{badgeDetail.person.uuid}}">{{badgeDetail.person.name}}</a>'
   }
 });
-
-/*
- <!--
- <span class="badge-level-{{badge.level}} badge">{{badge.name}}</span>
- -->
- <strong>{{badge.name}}</strong>
- <!--
- <i class="icon-user ng-class: {{{1: 'badge-level-1', 2: 'badge-level-2', 3: 'badge-level-3'}[badge.level]}}"></i>
- -->
- <span class="badge-level-{{badge.level}} badge">
- <i class="icon-user"></i>
- </span>
-
- {{badge.createdDate | date:'medium'}}
-
-*/
\ No newline at end of file
diff --git a/src/main/webapp/apps/core/PagingTableService.js b/src/main/webapp/apps/core/PagingTableService.js
index d65e7f3..a6a10f7 100755
--- a/src/main/webapp/apps/core/PagingTableService.js
+++ b/src/main/webapp/apps/core/PagingTableService.js
@@ -1,14 +1,17 @@
 function PagingTableService() {
-  var create = function ($scope, fetchCallback) {
+  var create = function ($scope, fetchCallback, options) {
+    options = options || {};
+    var watcher = options.watcher || function(){};
     var self = {
       rows: [],
-      startIndex: 0,
-      count: 10
+      startIndex: options.startIndex || 0,
+      count: options.count
     };
 
     var update = function(){
       fetchCallback(self.startIndex, self.count, function(data) {
         self.rows = data.rows;
+        watcher();
       });
     };
 
@@ -40,12 +43,16 @@ function PagingTableService() {
     args = args || {};
     return function(startIndex, count, cb) {
       console.log("fetching", arguments);
-      args.startIndex = startIndex;
-      args.count = count;
+      if(startIndex) {
+        args.startIndex = startIndex;
+      }
+      if(count) {
+        args.count = count;
+      }
       Resource.query(args, function(data, headers) {
         var totalResults = headers("total-results");
-        console.log("got data", arguments);
         console.log("totalResults", totalResults);
+        console.log("got data", data);
         cb({
           totalResults: totalResults,
           rows: data
diff --git a/src/main/webapp/apps/frontPageApp/frontPageApp.js b/src/main/webapp/apps/frontPageApp/frontPageApp.js
index c973983..39dbc9d 100755
--- a/src/main/webapp/apps/frontPageApp/frontPageApp.js
+++ b/src/main/webapp/apps/frontPageApp/frontPageApp.js
@@ -13,14 +13,35 @@ function FrontPageCtrl($scope, Person, Badge) {
 }
 
 function PersonListCtrl($scope, Person, PagingTableService) {
-  $scope.persons = PagingTableService.create($scope, PagingTableService.defaultCallback(Person, {orderBy: "name"}));
+  var personsWatcher = function () {
+    var array = $scope.persons.rows;
+
+    var group = [];
+    var groups = [];
+    angular.forEach(array, function(element) {
+      group.push(element);
+      if(group.length == 4) {
+        groups.push(group);
+        group = [];
+      }
+    });
+
+    if(group.length != 0) {
+      groups.push(group);
+    }
+
+    $scope.personGroups = groups;
+  };
+
+  $scope.persons = PagingTableService.create($scope, PagingTableService.defaultCallback(Person, {orderBy: "name"}), {count: 4 * 6, watcher: personsWatcher});
+
+  $scope.personGroups = [];
 }
 
 function PersonCtrl($scope, $routeParams, Person, Build, PagingTableService) {
   var personUuid = $routeParams.personUuid;
 
   $scope.mode = 'overview';
-
   $scope.builds = PagingTableService.create($scope, PagingTableService.defaultCallback(Build, {person: personUuid}));
 
   $scope.setMode = function(mode) {
@@ -44,8 +65,4 @@ function PersonCtrl($scope, $routeParams, Person, Build, PagingTableService) {
   Build.query({person: personUuid}, function (builds) {
     $scope.recentBuilds = builds;
   });
-
-//  Badge.query({person: personUuid}, function (badges) {
-//    $scope.badges = badges;
-//  });
 }
diff --git a/src/main/webapp/apps/frontPageApp/personList.html b/src/main/webapp/apps/frontPageApp/personList.html
index a4f48c1..5212ff6 100755
--- a/src/main/webapp/apps/frontPageApp/personList.html
+++ b/src/main/webapp/apps/frontPageApp/personList.html
@@ -6,30 +6,42 @@
     <h1>People</h1>
   </div>
 
+  <style>
+    .avatar-image {
+      /* This has to match bootstrap's row margin. */
+      margin-left: 30px;
+      padding-right: 1em;
+      float: left;
+      margin-top: 0;
+
+      /* This has to match the Gravatar image */
+      width: 80px;
+      height: 80px;
+    }
+  </style>
+
   <div class="row">
     <div class="span12">
-      <table class="table">
-        <tbody>
-        <tr ng-repeat="person in persons.rows">
-          <td><a href="/#/person/{{person.person.uuid}}">{{person.person.name}}</a></td>
-        </tr>
-        </tbody>
-        <tfoot>
-        <tr>
-          <td colspan="2">
-            <ul class="pager">
-              <!--ng-class="{disabled: persons.startIndex == 0}"-->
-              <li class="previous" ng-hide="persons.startIndex == 0">
-                <a ng-click="persons.prev()">&larr; Prev</a>
-              </li>
-              <li class="next">
-                <a ng-click="persons.next()">Next &rarr;</a>
-              </li>
-            </ul>
-          </td>
-        </tr>
-        </tfoot>
-      </table>
+      <div class="row" ng-repeat="group in personGroups">
+        <div class="span3" ng-repeat="person in group" style="padding-bottom: 1em">
+          <div class="row">
+            <img ng-src="{{person.person.gravatar}}?default=identicon" class="avatar-image"/>
+            <a href="/#/person/{{person.person.uuid}}">{{person.person.name}}</a>
+            <br/>
+            <span ng-repeat="level in person.badges | countBadgeByLevel | gz">
+              <span class="badge-inverse badge-level-{{$index + 1}} badge"><i class="icon-user"></i> x {{level}}</span>
+            </span>
+          </div>
+        </div>
+      </div>
+      <ul class="pager">
+        <li class="previous" ng-hide="persons.startIndex == 0">
+          <a ng-click="persons.prev()">&larr; Prev</a>
+        </li>
+        <li class="next">
+          <a ng-click="persons.next()">Next &rarr;</a>
+        </li>
+      </ul>
     </div>
   </div>
 </div>