{% extends 'base.html.twig' %}

{% block title %}Email Preferences | {{ parent() }}{% endblock %}

{% block body %}
    <div class="row justify-content-center">
        <div class="col-12 col-md-8">
            {% if isClient %}
                <h3>Preferences for email(s): {{ entity.email }}{% if entity.email2 is not null %}, {{ entity.email2 }}{% endif %}</h3>
            {% else %}
                <h3>Preferences for email: {{ entity.email }}</h3>
            {% endif %}
            <div style="border:solid gray 1px;"></div>
            <br>
            <form class="emailPreferences">
                {# client version #}
                {% if isClient %}
                    <input type="checkbox" name="getQuarterlyEmails" value="1"
                            {% if entity.getsBulkEmails == true %}
                                checked="checked"
                            {% endif %}
                    >&nbsp;&nbsp;&nbsp;Receive informational and emergency emails<br><br>
                {% else %}
                    {# end client version #}
                    {# lead version #}
                    <input type="checkbox" name="getPeriodicEmails" value="1"
                            {% if entity.getsDripEmails == true %}
                                checked="checked"
                            {% endif %}
                    >&nbsp;&nbsp;&nbsp;Receive periodic, keeping in the loop emails<br><br>
                    <input type="checkbox" name="getQuarterlyEmails" value="1"
                            {% if entity.getsBulkEmails == true %}
                                checked="checked"
                            {% endif %}
                    >&nbsp;&nbsp;&nbsp;Receive quarterly, promotional, and informational emails<br><br>
                    <div style="border:solid gray 1px;"></div>
                    <br>
                    <input type="checkbox" name="unsubscribeFromAllEmails" value="1"
                            {% if entity.getsDripEmails == false and entity.getsBulkEmails == false %}
                                checked="checked"
                            {% endif %}
                    >&nbsp;&nbsp;&nbsp;Unsubscribe from all emails<br><br>
                {% endif %}
                {# end lead version #}
                <button type="submit" name="submit" class="btn btn-success btn-sm">Save Preferences</button>
            </form>
            <div class="responseWrapper"></div>
        </div>
    </div>
{% endblock %}

{% block javascripts %}
    {{ parent() }}
    <script>
        $(document).ready(function () {

            {# if unsub from all changes AND IS CHECKED, uncheck all 'receive email' boxes #}
            $('input[name="unsubscribeFromAllEmails"]').change(function () {
                if ($('input[name="unsubscribeFromAllEmails"]').is(':checked')) {
                    $('input[name="getPeriodicEmails"]').prop('checked', false);
                    $('input[name="getQuarterlyEmails"]').prop('checked', false);
                }
            });
            {# if either 'receive email' boxes are checked, make sure unsub from all box is not checked #}
            $('input[name="getPeriodicEmails"]').change(function () {
                if ($('input[name="getPeriodicEmails"]').is(':checked')) {
                    $('input[name="unsubscribeFromAllEmails"]').prop('checked', false);
                }
            });
            $('input[name="getQuarterlyEmails"]').change(function () {
                if ($('input[name="getQuarterlyEmails"]').is(':checked')) {
                    $('input[name="unsubscribeFromAllEmails').prop('checked', false);
                }
            });

            $(document).on('submit', '.emailPreferences', function (event) {
                event.preventDefault();
                $.ajax({
                    type: 'POST',
                    url: '{{ path('emailPreferencesSubmit', { 'uniqueHash' : entity.uniqueHash }) }}{% if isClient %}{% endif %}/true',
                    data: $('.emailPreferences').serialize(),
                    dataType: 'json',
                    encode: true,
                    success: function (data) {
                        $('.responseWrapper').html(data);
                    }
                });
            });

        });
    </script>
{% endblock %}