<?php
$event = $db->get_results("
      SELECT e.*, d.*, c.cat_title, ct.adults, ct.kids
      FROM events as e
      LEFT JOIN event_date as d ON e.event_id=d.event_id
      LEFT JOIN event_categories as c ON e.event_cat_id=c.event_cat_id
      LEFT JOIN (SELECT r.event_date_id, SUM(r.reg_adults) as adults, SUM(r.reg_kids) as kids FROM event_registration as r GROUP BY r.event_date_id) AS ct ON ct.event_date_id=d.event_date_id 
      WHERE e.event_id=".$eid."
      ORDER BY d.start DESC", ARRAY_A);
$dates = $event;
$event = $event[0];
?>
<div class="wrap">
    <h1 class="wp-heading">Events Dates : <?=$event['title']?></h1><br><br>
</div>
<div class="container">
    <div class="row">
        <div class="col-sm-12">
            <button class="toggle-past btn btn-primary">Show Past Dates</button>
            <button class="toggle-past btn btn-primary" style="display: none;">Show Future Dates</button>
            &nbsp;&nbsp; <b><?=count($dates)?></b> dates scheduled.
        </div>
    </div>

    <div class="row">
        <div class="col-sm">
            <br/>
            <table class="table thead-dark table-striped table-hover">
                <tr>
                    <th style="text-align:center;">Actions</th>
                    <th style="text-align:center;">Event ID</th>
                    <th style="text-align:center;">Date ID</th>
                    <th>Event Start</th>
                    <th>Event End</th>
                    <th style="text-align:center;">Seats</th>
                    <th style="text-align:center;">Available</th>
                    <th style="text-align:center;">Attendance</th>
                </tr>
                <?php foreach ($dates as $d):
                        $start_time = strtotime($d['start']);
                        $end_time = strtotime($d['end']);
                        $today = mktime(0,0,0,date('n'),date('j'),date('Y'));
                    ?>
                    <tr <?=($start_time < $today ? 'class="past-event"' : 'class="future-event"')?>>
                        <td align="center"><?php if ($d['seats'] > 0): ?>
                            <a href="/wp-admin/admin.php?page=aw_events&action=view_rsvp&eid=<?=$d['event_id']?>&did=<?=$d['event_date_id']?>" title="View RSVPs"><i class="fas fa-list-ul"></i></a>
                        <?php else: ?>
                            <i class="fas fa-list-ul"></i>
                        <?php endif; ?></td>
                        <td align="center"><a href="/wp-admin/admin.php?page=aw_events&action=edit&eid=<?=$d['event_id']?>" title="Edit Event"><?=$d['event_id']?></a></td>
                        <td align="center"><?=$d['event_date_id']?></td>
                        <td><?=date('F j, Y - g:i a', $start_time)?></a></td>
                        <td><?=date('F j, Y - g:i a', $end_time)?></td>
                        <td align="center"><?=$d['seats']?></td>
                        <td align="center"><?=($d['seats']-($d['adults']+$d['kids']))?></td>
                        <td align="center"><input type="number" class="upd-attendance" id="att-<?=$d['event_date_id']?>" style="width:80px;text-align:center;" value="<?=$d['attendance']?>" <?=($start_time < $today ? '' : 'disabled="disabled"')?> /> &nbsp;<i id="loader-<?=$d['event_date_id']?>" class="fas fa-circle-notch fa-lg gray"></i></td>
                    </tr>
                <?php endforeach; ?>
            </table>

        </div>
    </div>
</div>
<style type="text/css">
    .past-event {
        display: none;
        color: #AAA;
    }
    .future-event {
    }
    .green {
        color:#009900;
    }
    .gray {
        color: #CCCCCC;
    }
</style>
<script type="text/javascript">
    jQuery(document).ready(function($) {
        $('.toggle-past').click(function () {
           $('.past-event, .future-event, .toggle-past').toggle();
        });
        $('.upd-attendance').change(function () {
            let did = $(this).attr('id').substr(4);
            let att = $(this).val();
            if (att.length > 0) {
                let getURL = "/wp-content/themes/phlibrary/admin/aw_events_update_attendance.php?did="+did+"&att="+att;
                $('#loader-'+did).addClass('fa-spin green').removeClass('gray');
                $.get( getURL, function( data ) {
                    $( ".result" ).html( data );
                    console.log( "Load was performed." );
                    $('#loader-'+did).removeClass('fa-spin fa-circle-notch').addClass('fa-check-circle');
                    $('#loader-'+did).animate({opacity:1},3000, function () {
                        $('#loader-'+did).removeClass('fa-check-circle green').addClass('fa-circle-notch gray');
                    });
                });
            }
        });
    });
</script>