Adds gravatar

Gruntfile.js

@@ -120,6 +120,7 @@ module.exports = function(grunt) {
           'bower_components/ng-csv/build/ng-csv.js',
           'bower_components/ionic-toast/dist/ionic-toast.bundle.min.js',
           'bower_components/angular-clipboard/angular-clipboard.js',
+          'bower_components/angular-md5/angular-md5.js',
           'bower_components/angular-mocks/angular-mocks.js',
           'angular-pbkdf2/angular-pbkdf2.js',
           'angular-bitcore-wallet-client/angular-bitcore-wallet-client.js'

bower.json

@@ -18,7 +18,8 @@
     "trezor-connect": "~1.0.1",
     "ng-csv": "~0.3.6",
     "ionic-toast": "^0.4.1",
-    "angular-clipboard": "^1.4.2"
+    "angular-clipboard": "^1.4.2",
+    "angular-md5": "^0.1.10"
   },
   "resolutions": {
     "angular": "1.5.3"

public/views/addressbook.html

@@ -29,10 +29,11 @@
 
     <ion-list>
       <ion-item ng-repeat="addrEntry in addressbook"
-                class="item-icon-left item-icon-right"
+                class="item-icon-right item-avatar"
                 ui-sref="tabs.addressbook.view({address:addrEntry.address})">
-        <i class="icon ion-ios-person-outline"></i>
-        {{addrEntry.name}}
+        <gravatar name="{{addrEntry.name}}" width="50" email="{{addrEntry.email}}"></gravatar>
+        <h2>{{addrEntry.name}}</h2>
+        <p>{{addrEntry.address}}</p>
         <i class="icon nav-item-arrow-right"></i>
 
         <ion-option-button class="button-assertive" ng-click="remove(addrEntry.address)">

public/views/addressbook.view.html

@@ -12,6 +12,10 @@
 
   <ion-content>
 
+    <div class="gravatar-content">
+      <gravatar name="{{addressbookEntry.name}}" width="80" email="{{addressbookEntry.email}}"></gravatar>
+    </div>
+
     <div class="card">
       <div class="item item-text-wrap">
         <h3 translate>Name</h3>

src/js/app.js

@@ -9,6 +9,7 @@ var modules = [
   'angular-clipboard',
   'ngLodash',
   'ngCsv',
+  'angular-md5',
   'bwcModule',
   'pbkdf2Module',
   'copayApp.filters',

src/js/directives/gravatar.js

@@ -0,0 +1,20 @@
+'use strict';
+
+angular.module('copayApp.directives')
+  .directive('gravatar', function(md5) {
+    return {
+      restrict: 'AE',
+      replace: true,
+      scope: {
+        name: '@',
+        height: '@',
+        width: '@',
+        email: '@'
+      },
+      link: function(scope, el, attr) {
+        scope.emailHash = md5.createHash(scope.email || '');
+      },
+      template: '<img class="gravatar" alt="{{ name }}" height="{{ height }}"  width="{{ width }}" src="https://secure.gravatar.com/avatar/{{ emailHash }}.jpg?s={{ width }}&d=mm">'
+    }
+  });
+

src/sass/main.scss

@@ -937,6 +937,27 @@ input[type=number] {
   }
 }
 
+/** Gravatar **/
+
+.gravatar {
+  border-radius: 50%;
+}
+
+.gravatar-content {
+  position: relative;
+  height: 70px;
+  border-color: #172565;
+  background-color: #1e3186;
+  background-image: linear-gradient(0deg, #172565, #172565 0%, transparent 0%);
+  color: #fff;
+  margin-bottom: 50px;
+  .gravatar {
+    position: absolute;
+    bottom: -30px;
+    left: 41%;
+  }
+}
+
 /* Spinner */
 
 .item-icon-left ion-spinner {