Replace the gigantic incumbent email drop-down in the NomCom tool with an

AutocompletedEmailField, also show the name of the incumbents and not
just their email addresses on the list page
 - Legacy-Id: 8281

ietf/nomcom/forms.py

@@ -17,6 +17,7 @@ from ietf.nomcom.utils import (NOMINATION_RECEIPT_TEMPLATE, FEEDBACK_RECEIPT_TEM
                                get_user_email, validate_private_key, validate_public_key,
                                get_or_create_nominee, create_feedback_email)
 from ietf.person.models import Email
+from ietf.person.fields import AutocompletedEmailField
 from ietf.utils.fields import MultiEmailField
 from ietf.utils.mail import send_mail
 
@@ -655,6 +656,8 @@ class PositionForm(BaseNomcomForm, forms.ModelForm):
     fieldsets = [('Position', ('name', 'description',
                                'is_open', 'incumbent'))]
 
+    incumbent = AutocompletedEmailField(required=False)
+
     class Meta:
         model = Position
         fields = ('name', 'description', 'is_open', 'incumbent')

ietf/templates/nomcom/edit_position.html

@@ -1,5 +1,14 @@
 {% extends "nomcom/nomcom_private_base.html" %}
 
+{% block pagehead %}
+<link rel="stylesheet" type="text/css" href="/css/token-input.css"></link>
+{% endblock %}
+
+{% block content_end %}
+<script type="text/javascript" src="/js/lib/jquery.tokeninput.js"></script>
+<script type="text/javascript" src="/js/tokenized-field.js"></script>
+{% endblock %}
+
 {% block nomcom_content %}
 <h3>{% if position %}Edit{% else %}Add{% endif %} position</h3>
 

ietf/templates/nomcom/list_positions.html

@@ -11,7 +11,7 @@
         <dt>Description:</dt>
         <dd>{{ position.description }}</dd>
         <dt>Incumbent:</dt>
-        <dd>{{ position.incumbent }}</dd>
+        <dd>{% if position.incumbent %}{{ position.incumbent.person }} &lt;{{ position.incumbent.address }}&gt;{% else %}None{% endif %}</dd>
         <dt>Is open:</dt>
         <dd>{{ position.is_open }}</dd>
         <dt>Templates:</dt>

static/css/base2.css

@@ -308,6 +308,10 @@ div.info-message-error { border: 1px solid red; background-color: #ffeebb; paddi
     margin-left: 150px;
 }
 
+.baseform .fieldWidget ul.token-input-list {
+    clear: none;
+}
+
 #feedbackformset .fieldWidget {
     margin-left: 0px;
 }