<script type="text/javascript">
    $(function () {
        $("#answers-table").find("tbody").sortable({
            opacity: 0.6,
            cursor: "move",
            placeholder: "placeholder",
            helper: fixHelper,
            axis: "y",
            update: function() {
                var order = $(this).sortable("serialize");
                $.post(prefix + "polls/answers/reorder", order, function(data) {
                });
            }
        });
    });
</script>

<section class="content-header">
    <h1><?= __('Answers') ?></h1>

    <div class="actions">
        <a data-ajax class="btn btn-success btn-sm" href="<?= admin_url_to('/polls/answers/add?poll_id=' . $poll['id']) ?>"><?= __('Add') ?></a>
    </div>
</section>

<section class="content">

    <div class="nav-tabs-custom">
        <ul class="nav nav-tabs">
            <li><a data-ajax href="<?= admin_url_to('/polls/edit/' . $poll['id']) ?>"><?= __('Poll') ?></a></li>
            <li class="active"><a href="#"><?= __('Answers') ?></a></li>
        </ul>

        <?php if (empty($answers)): ?>
            <div class="tab-content">
                <div class="callout callout-warning" style="margin-bottom: 0;">
                    <h4>Ops!</h4>
                    <p><?= __('No answers found') ?></p>
                </div>
            </div>
        <?php else: ?>
            <table id="answers-table" class="table table-condensed table-hover table-striped">
                <thead>
                <tr>
                    <th><?= __('Answer') ?></th>
                    <th width="200"></th>
                    <th width="80"></th>
                </tr>
                </thead>

                <tbody>
                <?php foreach ($answers as $answer): ?>
                    <?php $percent = util('Number')->percent($answer['votes'], $total) ?>
                    <tr id="sequence_<?= $answer['id'] ?>">
                        <td><i class="fa fa-bars"></i> <?= $answer['answer'] ?></td>
                        <th>
                            <div class="progress" style="margin-bottom:0">
                                <div class="progress-bar-info" style="width:<?= $percent ?>%">
                                    <?= $percent ?>%
                                </div>
                            </div>
                        </th>
                        <td class="record-actions">
                            <a data-ajax class="btn btn-xs btn-default" href="<?= admin_url_to('/polls/answers/edit/' . $answer['id']) ?>"><?= __('Edit') ?></a>
                            <a data-ajax-delete class="btn btn-danger btn-xs"href="<?= admin_url_to('/polls/answers/delete/' . $answer['id']) ?>"><?= __('Delete') ?></a>
                        </td>
                    </tr>
                <?php endforeach ?>
                </tbody>
            </table>
        <?php endif ?>
    </div>
</section>