<?php
// Copyright 1999-2022. Plesk International GmbH. All rights reserved.
?>
<table class="bar-chart-table" id="outgoingMailMessagesHead" cellspacing="0">
    <thead>
        <tr>
            <td colspan="2"><?php echo $this->lmsg('selectDay'); ?> :</td>
            <td class="bar-chart-table-data">
                <select class="f-max-size" name="outgoingMailMessagesDate" id="outgoingMailMessagesDate">
                    <?php foreach($this->messagesDates as $date): ?>
                        <option value="<?php echo $date;?>"><?php echo ldate(strtotime($date));?></option>
                    <?php endforeach; ?>
                </select>
            </td>
        </tr>
        <tr class="separator"><td colspan="3"><hr></td></tr>
    </thead>
    <tbody id="outgoingMailMessagesResult"></tbody>
</table>
<script type="text/javascript">
//<![CDATA[
(function () {
    var updateControlsState = function () {
        var date = document.getElementById('outgoingMailMessagesDate').value;
        new Ajax.Request(Jsw.prepareUrl('/outgoing-mail/messages/type/<?php echo $this->type; ?>/id/<?php echo $this->objectId; ?>/date/' + date), {
            method: 'get',
            onCreate: function() {
                document.getElementById('outgoingMailMessagesResult').innerHTML = (
                    '<div class="ajax-loading">' +
                        <?php echo $this->jsLmsg('loading'); ?> +
                        '</div>'
                );
            },
            onSuccess: function(transport) {
                if ('' == transport.responseText) {
                    return;
                }
                document.getElementById('outgoingMailMessagesResult').innerHTML = transport.responseText;
            }
        });
    };

    updateControlsState();
    document.getElementById('outgoingMailMessagesDate').addEventListener('change', updateControlsState);
})();
//]]>
</script>
