Bug 974867 - [MMS]Auto suggestion for email address r=Julien

apps/sms/js/contact_renderer.js

@@ -1,4 +1,4 @@
-/*global Template, Utils */
+/*global Template, Utils, Settings */
 
 'use strict';
 
@@ -172,7 +172,10 @@ ContactRenderer.prototype = {
 
     // don't render if there is no phone number
     // TODO: Add email checking support for MMS
-    if (!contact.tel || !contact.tel.length) {
+    var hasTel = contact.tel && contact.tel.length;
+    var hasEmail = contact.email && contact.email.length;
+
+    if (!hasTel && !(Settings.supportEmailRecipient && hasEmail)) {
       return false;
     }
 
@@ -190,16 +193,30 @@ ContactRenderer.prototype = {
       number: escsubs.map(function(k) {
         // Match any of the search terms with the number
         return new RegExp(k, 'ig');
+      }),
+      email: escsubs.map(function(k) {
+        // Match any of the search terms with the number
+        return new RegExp('^' + k, 'gi');
       })
     };
 
     var include = renderPhoto ? { photoURL: true } : null;
-    var tels = contact.tel;
-    var details = Utils.getContactDetails(tels[0].value, contact, include);
+    var addresses = [];
+
+    if (contact.tel && contact.tel.length) {
+      addresses = addresses.concat(contact.tel);
+    }
+    if (Settings.supportEmailRecipient &&
+        contact.email && contact.email.length) {
+      addresses = addresses.concat(contact.email);
+    }
+    var details = Utils.getContactDetails(
+      addresses[0].value, contact, include
+    );
 
     var tempDiv = document.createElement('div');
 
-    tels.forEach(function(current) {
+    addresses.forEach(function(current) {
       // Only render a contact's tel value entry for the _specified_
       // input value when not rendering all values. If the tel
       // record value _doesn't_ match, then continue.
@@ -219,7 +236,12 @@ ContactRenderer.prototype = {
 
       var data = Utils.getDisplayObject(details.title, current);
 
-      ['name', 'number'].forEach(function(key) {
+      var props = ['name', 'number'];
+      if (Settings.supportEmailRecipient) {
+        props.push('email');
+      }
+
+      props.forEach(function(key) {
         var escapedData = Template.escape(data[key]);
         if (shouldHighlight) {
           escapedData = highlight(escapedData, regexps[key]);

apps/sms/js/contacts.js

@@ -2,7 +2,7 @@
 /* vim: set shiftwidth=2 tabstop=2 autoindent cindent expandtab: */
 (function(exports) {
   'use strict';
-  /*global fb */
+  /*global fb, Settings */
   var unknownNumbers = [];
 
   var filterFns = {
@@ -188,6 +188,9 @@
       request.onsuccess = function onsuccess() {
         var contacts = this.result.slice();
         var fields = ['tel', 'givenName', 'familyName'];
+        if (Settings.supportEmailRecipient) {
+          fields.push('email');
+        }
         var criteria = { fields: fields, terms: lower };
         var results = [];
         var contact;
@@ -228,8 +231,12 @@
     },
 
     findContactByString: function contacts_findBy(filterValue, callback) {
+      var props = ['tel', 'givenName', 'familyName'];
+      if (Settings.supportEmailRecipient) {
+        props.push('email');
+      }
       return this.findBy({
-        filterBy: ['tel', 'givenName', 'familyName'],
+        filterBy: props,
         filterOp: 'contains',
         filterValue: filterValue
       }, callback);

apps/sms/js/desktop-only/contacts.js

@@ -184,6 +184,9 @@
     // nested condition a way out of the second and third loop.
     outer:
     for (var field of filter.filterBy) {
+      if (!contact[field]) {
+         continue;
+      }
       for (var value of contact[field]) {
         if (typeof value !== 'string') {
           value = value.value;

apps/sms/js/recipients.js

@@ -1,4 +1,4 @@
-/*global GestureDetector, Dialog, Navigation */
+/*global Utils, GestureDetector, Dialog, Navigation, Settings */
 
 (function(exports) {
   'use strict';
@@ -28,6 +28,8 @@
     this.separator = opts.separator || '';
     this.carrier = opts.carrier || '';
     this.className = 'recipient';
+    this.isEmail = Settings.supportEmailRecipient &&
+                   Utils.isEmailAddress(this.number);
 
     // isLookupable
     //  the recipient was accepted by pressing <enter>
@@ -52,7 +54,9 @@
     // is questionable and may be invalid.
     number = this.number[0] === '+' ? this.number.slice(1) : this.number;
 
-    if (this.source === 'manual' && !rdigit.test(number)) {
+    if (this.isEmail) {
+      this.className += ' email';
+    } else if (this.source === 'manual' && !rdigit.test(number)) {
       this.isQuestionable = true;
     }
 

apps/sms/js/settings.js

@@ -20,6 +20,8 @@ var Settings = {
 
   _serviceIds: null,
 
+  supportEmailRecipient: false,
+
   // We set the default maximum concatenated number of our SMS app to 10
   // based on:
   // https://bugzilla.mozilla.org/show_bug.cgi?id=813686#c0

apps/sms/js/thread_ui.js

@@ -2571,32 +2571,33 @@ var ThreadUI = global.ThreadUI = {
     var last = this.recipientsList.lastElementChild;
     var typed = last && last.textContent.trim();
     var isContact = false;
-    var record, tel, length, number, contact;
+    var record, length, number, contact, prop;
 
     if (index < 0) {
       index = 0;
     }
+    prop = Settings.supportEmailRecipient &&
+           Utils.isEmailAddress(fValue) ? 'email' : 'tel';
 
     // If there is greater than zero matches,
     // process the first found contact into
     // an accepted Recipient.
     if (contacts && contacts.length) {
       isInvalid = false;
       record = contacts[0];
-      length = record.tel.length;
+      length = record[prop].length;
 
       // Received an exact match with a single tel record
       if (source.isLookupable && !source.isQuestionable && length === 1) {
-        if (Utils.probablyMatches(record.tel[0].value, fValue)) {
+        if (Utils.probablyMatches(record[prop][0].value, fValue)) {
           isContact = true;
-          number = record.tel[0].value;
+          number = record[prop][0].value;
         }
       } else {
         // Received an exact match that may have multiple tel records
         for (var i = 0; i < length; i++) {
-          tel = record.tel[i];
-          if (this.recipients.numbers.indexOf(tel.value) === -1) {
-            number = tel.value;
+          if (this.recipients.numbers.indexOf(record[prop][i].value) === -1) {
+            number = record[prop][i].value;
             break;
           }
         }

apps/sms/js/utils.js

@@ -1,14 +1,15 @@
 /* -*- Mode: Java; tab-width: 2; indent-tabs-mode: nil; c-basic-offset: 2 -*- /
 /* vim: set shiftwidth=2 tabstop=2 autoindent cindent expandtab: */
 
-/* globals ContactPhotoHelper, Notification, Threads*/
+/* globals ContactPhotoHelper, Notification, Threads, Settings */
 
 (function(exports) {
   'use strict';
   var rdashes = /-(.)/g;
   var rescape = /[.?*+^$[\]\\(){}|-]/g;
   var rparams = /([^?=&]+)(?:=([^&]*))?/g;
   var rnondialablechars = /[^,#+\*\d]/g;
+  var rmail = /[\w-]+@[\w\-]/;
   var downsamplingRefSize = {
     // Estimate average Thumbnail size:
     // 120 X 60 (max pixel) X 3 (full color) / 20 (average jpeg compress ratio)
@@ -267,6 +268,12 @@
         return false;
       }
 
+      if (Settings.supportEmailRecipient &&
+          Utils.isEmailAddress(a) &&
+          Utils.isEmailAddress(b)) {
+        return a === b;
+      }
+
       if (service && service.normalize) {
         a = service.normalize(a);
         b = service.normalize(b);
@@ -588,6 +595,11 @@
         numberHTML: ''
       };
 
+      if (Settings.supportEmailRecipient) {
+        data.email = number;
+        data.emailHTML = '';
+      }
+
       return data;
     },
 
@@ -604,7 +616,12 @@
         };
       });
     },
-
+    /*
+       TODO: Email Address check.
+     */
+    isEmailAddress: function(email) {
+      return rmail.test(email);
+    },
     /*
       Helper function for removing notifications. It will fetch the notification
       using the current threadId or the parameter if provided, and close them

apps/sms/style/sms.css

@@ -729,6 +729,11 @@ Do not remove.
   float: left;
 }
 
+.recipient[contenteditable].email {
+  padding-right: 3.8rem;
+  background: white url(images/icons/icon_sms_compose_email.png) calc(100% - 1.5rem) center no-repeat;
+}
+
 /* Disable padding and margin on empty contenteditable recipients when they do
  * not have focus. This allows the Recipients List to intelligently collapse
  * when the final row contains no "assimilated" (i.e. non-contenteditable)