{% extends "corporate_memberships/base.html" %}
{% load pagination_tags %}
{% load base_filters %}
{% load perm_tags %}
{% load corporate_memberships_tags %}
{% load styled_forms %}
{% load i18n %}

{% block title %}{% trans "Corporate Membership Representatives" %}{% endblock %}

{% block extra_head %}
{{ block.super }}
<link rel="stylesheet" href="{{ STATIC_URL }}css/corporate_memberships.css">
<link rel="stylesheet" href="{{ STATIC_URL }}css/jquery_ui_all_custom/jquery-ui-1.8.5.custom.css">
<link rel="stylesheet" href="{{ STATIC_URL }}css/corporate_memberships-edit_reps.css">
{% endblock %}

{% block body %}
<div class="t">
{% corpmemb_nav request.user corp_memb %} 
<div class="corp-reps">
     <h1>{% trans "Representatives for: " %} <a href="{% url corpmembership.view corp_memb.id %}">{{ corp_memb.corp_profile.name }}</a></h1>
     {% if reps %}
     <table width="90%">
            <tr>
                <td class="header" width="55%">{% trans "Representative." %}</td>
                <td class="header" width="20%">{% trans "Is Dues Rep." %}</td>
                <td class="header" width="20%">{% trans "Is Member Rep." %}</td>
                <td class="header" width="5%">&nbsp;</td>
            </tr>
            {% for rep in reps %}
                <tr class="corp-rep">
                <td><a href="{% url profile rep.user.username %}">{{ rep.user.get_full_name }} ({{ rep.user.email  }})</a>
                    
                </td>
                <td>
                    {% if rep.is_dues_rep %}
                        {% trans "True" %}
                    {% else %}
                        -
                    {% endif %}
                </td>
                <td>
                {% if rep.is_member_rep %}
                        {% trans "True" %}
                    {% else %}
                        -
                    {% endif %}
                </td>
                <td><a href="{% url corp_membership.delete_rep rep.pk %}"><small class="delete">{% trans "Delete" %}</small></a>
                <!-- delete-corp_memb form -->
                    <form name="corp-memb-rep-delete" method="POST" action="{% url corp_membership.delete_rep rep.pk %}">{% csrf_token %}
                        <input type="hidden" name="action" value="delete">
                    </form>
                </td>
                </tr>
            {% endfor %}
            </table>
     {% else %}
        <div>{% trans "No representative designated yet." %}</div>
     {% endif %}
     
    
    <form action="" method="post">{% csrf_token %}
    <div class="forms">
        {{ form|styled_form }}
            <input type="submit" name="submit" value="Save and Continue Add Another" />
            <input type="submit" name="submit" value="Save" />
    </div>
    
    </form>
    
 
    
</div>  
</div>
{% endblock %}

{% block extra_body %}
<script>
    if (!(window.jQuery)) { 
        var s = document.createElement('script');
        s.setAttribute('src', 'https://ajax.googleapis.com/ajax/libs/jquery/1.7.1/jquery.min.js'); 
        s.setAttribute('type', 'text/javascript');
        document.getElementsByTagName('head')[0].appendChild(s);}
</script>
<script src="https://ajax.googleapis.com/ajax/libs/jqueryui/1.8.16/jquery-ui.min.js"></script>


 <script type="text/javascript">
    $(document).ready(function(){

        // delete confirmation
        $('.delete').click(function(){
            var delete_corp_memb_rep = confirm('Permenantly delete this corporate membership representative?'); // confirm
            if(delete_corp_memb_rep) $(this).parents('.corp-rep').find('form[name="corp-memb-rep-delete"]').submit() // delete: if OK
            return false;   // cancel
        });
        
        $( "#id_user_display" ).autocomplete({
            source: "{% url corp_membership.reps_lookup %}",
            selectFirst:true,
            minLength:2,
            select:function(event,ui) {
                $("#id_user").val(ui.item.id)
            }
        });
        
    });
   </script>
   
 {% endblock %}

