{{ define "title" }}Invite People to {{ .Data.event.Title }}{{ end }}
{{ define "content" }}

{{ $e := .Data.event }}
{{ $cl := .Data.contacts }}

<h1>Invite <em>{{ $e.Title }}</em></h1>

<p>
    <a href="/e/{{ $e.Fragment }}" class="btn btn-success">Back to Event Page</a>
</p>

<div class="card mb-4">
    <div class="card-header">Contact List</div>
    <div class="card-body">
        <p>
            First, choose who you want to invite to your event. Adding them to the
            "Invited" list does <strong>not</strong> immediately send them an e-mail;
            the <span class="badge badge-warning">not notified</span> badge means they
            have <em>yet</em> to receive an e-mail or SMS message.
        </p>
        <p>
            To invite a <em>new</em> contact, scroll down to <a href="#new-contact">Invite New People</a>.
        </p>

        <div class="row" style="max-height: 500px; overflow: auto">
            <div class="col-6">
                <h4>Invited</h4>

                <ul class="list-unstyled">
                    {{ range $index, $rsvp := .Data.invited }}
                    <li>
                        <div class="alert alert-info">
                            <form method="POST" action="/e/admin/invite/{{ $e.ID }}">
                            <input type="hidden" name="_csrf" value="{{ $.CSRF }}">
                            <input type="hidden" name="action" value="revoke-invite">
                            <input type="hidden" name="index" value="{{ $rsvp.ID }}">
                            {{ if $rsvp.Contact }}
                                <strong>{{ $rsvp.Contact.Name }}</strong>
                            {{ else }}
                                <strong>{{ $rsvp.Name }}</strong>
                            {{ end }}
                            <button type="submit" class="btn btn-sm btn-danger">uninvite</button>
                            </form>
                            <ul class="list-inline">
                                {{ if .Contact }}
                                    {{ if .Contact.Email }}
                                    <li class="list-inline-item text-muted">
                                        {{ .Contact.Email }}
                                    </li>
                                    {{ end }}
                                    {{ if .Contact.SMS }}
                                    <li class="list-inline-item text-muted">
                                        {{ .Contact.SMS }}
                                    </li>
                                    {{ end }}
                                {{ else }}
                                    {{ if .Email }}
                                    <li class="list-inline-item text-muted">
                                        {{ .Email }}
                                    </li>
                                    {{ end }}
                                    {{ if .SMS }}
                                    <li class="list-inline-item text-muted">
                                        {{ .SMS }}
                                    </li>
                                    {{ end }}
                                {{ end }}
                            </ul>
                            {{ if not .Notified }}
                                <div class="badge badge-warning">not notified</div>
                            {{ end }}
                        </div>
                    </li>
                    {{ end }}
                </ul>
            </div>
            <div class="col-6">
                <h4>Available</h4>

                <form action="/e/admin/invite/{{ $e.ID }}" method="POST">
                <input type="hidden" name="_csrf" value="{{ .CSRF }}">

                <ul class="list-unstyled">
                    {{ range $cl }}
                    {{ if not (index $.Data.invitedMap .ID) }}
                    <li>
                        <label class="d-block alert alert-info">
                            <input type="checkbox" name="invite" value="{{ .ID }}">
                            <strong>{{ .Name }}</strong>
                            <ul class="list-inline">
                                {{ if .Email }}
                                    <li class="list-inline-item text-muted">
                                        {{ .Email }}
                                    </li>
                                {{ end }}
                                {{ if .SMS }}
                                    <li class="list-inline-item text-muted">
                                        {{ .SMS }}
                                    </li>
                                {{ end }}
                            </ul>
                        </label>
                    </li>
                    {{ end }}
                    {{ end }}
                    <li>
                        <label class="d-block alert alert-info">
                                <input type="checkbox" name="invite" value="1">
                                <strong>John Doe</strong><br>
                                <span class="text-muted">name@example.com</span>
                        </label>
                    </li>
                    <li>
                        <label class="d-block alert alert-info">
                                <input type="checkbox" name="invite" value="1">
                                <strong>John Doe</strong><br>
                                <span class="text-muted">name@example.com</span>
                        </label>
                    </li>
                </ul>

                <button type="submit"
                    name="action" value="send-invite"
                    class="btn btn-primary">Invite Contact</button>
                <a href="/admin/contacts"
                    class="btn btn-secondary">Manage Contacts</a>

                </form>
            </div>
        </div>
    </div>
</div>

<div class="card mb-4" id="new-contact">
    <div class="card-header">Invite New People</div>
    <div class="card-body">
        <form action="/e/admin/invite/{{ $e.ID }}" method="POST">
        <input type="hidden" name="_csrf" value="{{ .CSRF }}">

        <p>
            Fill in this form to create a new Contact and add them to the
            Invited list above.
        </p>

        <div class="form-row">
            <div class="form-group col-md-6">
                <label for="first_name">First name:</label>
                <input type="text"
                    name="first_name"
                    id="first_name"
                    class="form-control"
                    placeholder="First name">
            </div>
            <div class="form-group col-md-6">
                <label for="last_name">Last name:</label>
                <input type="text"
                    name="last_name"
                    id="last_name"
                    class="form-control"
                    placeholder="Last name">
            </div>
        </div>

        <div class="form-row">
            <div class="form-group col-md-6">
                <label for="email">E-mail:</label>
                <input type="email"
                    name="email"
                    id="email"
                    class="form-control"
                    placeholder="name@example.com">
            </div>
            <div class="form-group col-md-6">
                <label for="last_name">SMS Number:</label>
                <input type="text"
                    name="sms"
                    id="sms"
                    class="form-control"
                    placeholder="800-555-1234">
            </div>
        </div>

        <div class="form-row">
            <button type="submit"
                name="action"
                value="new-contact"
                class="btn btn-success">Create Contact & Invite</button>
        </div>

        </form>
    </div>
</div>

<div class="card mb-4">
    <div class="card-header">Send Notifications</div>
    <div class="card-body">
        <form method="POST" action="/e/admin/invite/{{ $e.ID }}">
        <input type="hidden" name="_csrf" value="{{ $.CSRF }}">
        <input type="hidden" name="action" value="notify">

        <p>
            To send out notifications (e-mail and/or SMS) to all of the invited contacts,
            click the button below.
        </p>
        <p>
            This will only notify contacts who have not yet received a notification.
            That is, those with the <span class="badge badge-warning">not notified</span>
            badge above.
        </p>

        <button type="submit" class="btn btn-danger">Notify Invited Contacts</button>
        </form>
    </div>
</div>

<h2>Invited</h2>

To Do

{{ end }}