<?php
$this->css($this->assetModule('script/admin.css'));
$this->jQuery();
$this->Backbone();
$this->js(Pi::url('static/vendor/bootstrap/js/bootstrap.js'));
?>

<style>
    .article-pull-title {
        padding: 10px 0 20px 0;
    }

    form {
        margin: 0;
    }
</style>

<?php include $this->template('./message-box.phtml'); ?>

<div class="row-fluid">
    <div class="span12">
        <div id="pi-js-list">
            <div class="article-pull-title">
                <strong><?php echo _a('Pull articles for '); ?>
                    <a href="<?php echo $this->url('', ['action' => 'list-article', 'topic' => $topic['id']]); ?>">
                        <?php echo $this->escape($topic['title']); ?>
                    </a>
                </strong>
            </div>
            <div class="clearfix">
                <div class="float-left form-inline">
                    <div class="form-group">
                        <a class="btn btn-primary" id="article-pull"
                           data-content="<?php echo $this->url('', ['action' => 'pull-article', 'topic' => $topic['id'], 'id' => 'placeholder']); ?>">
                            <?php echo _a('Pull'); ?>
                        </a>
                    </div>
                    <div class="form-group">
                        <select class="search-cate form-control">
                            <option value=""><?php echo _a('All categories'); ?></option>
                            <?php foreach ($categories as $val) { ?>
                                <option value="<?php echo $this->escape($val['id']); ?>"
                                    <?php if ($category == $val['id']) echo "selected"; ?>>
                                    <?php echo str_pad('', $val['depth'], '-', STR_PAD_LEFT)
                                        . ' ' . $this->escape($val['title']); ?>
                                </option>
                            <?php } ?>
                        </select>
                    </div>
                </div>
                <?php
                $form->setAttributes([
                    'action' => $this->url('', ['action' => 'pull', 'topic' => $topic['id']]),
                    'method' => 'get',
                    'class'  => 'form-inline navbar-right',
                    'style'  => 'margin: 0; padding-right: 0',
                ]);
                echo $this->form()->openTag($form);
                ?>
                <div class="form-group">
                    <?php
                    $element = $form->get('keyword');
                    $element->setAttributes([
                        'class'       => 'form-control',
                        'placeholder' => $element->getOption('label') ?: _a('Subject'),
                    ]);
                    echo $this->formElement($element);
                    ?>
                </div>
                <button type="submit" class="btn"><?php echo _a('Search'); ?></button>
                <?php echo $this->form()->closeTag(); ?>
            </div>
            <table class="table table-striped">
                <tbody>
                <tr>
                    <th style="width:2.2em;">
                        <input type="checkbox" class="check-all">
                    </th>
                    <th><?php echo _a('Title'); ?></th>
                    <th style="width: 10%"><?php echo _a('Category'); ?></th>
                    <th style="width: 15%"><?php echo _a('Topic'); ?></th>
                    <th style="width: 8%"><?php echo _a('Submitter'); ?></th>
                    <th style="width: 100px"><?php echo _a('Publish date'); ?></th>
                </tr>
                <?php $now = time(); ?>
                <?php foreach ($data as $article) { ?>
                    <tr data-id="<?php echo $this->escape($article['id']); ?>">
                        <td>
                            <?php if (!in_array($article['id'], $pulled)) { ?>
                                <input type="checkbox" value="<?php echo $this->escape($article['id']); ?>"
                                       class="check-one">
                            <?php } ?>
                        </td>
                        <td>
                            <?php if ($article['time_publish'] > $now) { ?>
                                <span><?php echo $this->escape($article['subject']); ?></span>
                            <?php } else { ?>
                                <a href="<?php echo $this->escape($article['url']); ?>"
                                   title="<?php echo $this->escape($article['subject']); ?>"
                                   target="_blank"><?php echo $this->escape($article['subject']); ?>
                                </a>
                            <?php } ?>
                            <?php if (in_array($article['id'], $pulled)) { ?>
                                - <strong class="text-warning"><?php echo _a('Pulled'); ?></strong>
                            <?php } ?>
                            <?php if ($article['image']) { ?>
                                <i class="icon-picture" title="<?php echo _a('Feature image'); ?>"></i>
                            <?php } ?>
                            <div class="row-actions">
                                <?php if (!in_array($article['id'], $pulled)) { ?>
                                    <a class="one-action" data-value="pull" href="#"
                                       data-content="<?php echo $this->url('', [
                                           'action' => 'pull-article',
                                           'topic'  => $topic['id'],
                                           'id'     => 'placeholder',
                                       ]); ?>"><?php echo _a('Pull'); ?></a>
                                <?php } ?>
                            </div>
                        </td>
                        <td><?php echo $this->escape($article['category_title']); ?></td>
                        <td><?php echo isset($relation[$article['id']])
                                ? $this->escape($relation[$article['id']])
                                : '<span class="muted">' . _a('No topics') . '</span>'
                            ?>
                        </td>
                        <td><?php echo !empty($article['user_name'])
                                ? $this->escape($article['user_name']) : '&nbsp;'; ?>
                        </td>
                        <td><?php echo _date($article['time_publish']); ?></td>
                    </tr>
                <?php } ?>
                </tbody>
            </table>
            <?php echo $this->paginationControl(
                $paginator,
                'Sliding',
                'paginator.phtml',
                ['class' => 'pagination-right'])
            ?>
        </div>
    </div>
</div>
<script>
    (function ($) {
        var page = {
            url: "<?php echo $this->url('', [
                'controller' => 'article',
                'action'     => '',
            ]); ?>".replace(/\/$/, ""),
            el: $("#pi-js-list"),
            $: function (selector) {
                return this.el.find(selector);
            },
            init: function () {
                _.bindAll(this);
                this.$(".check-all").click(this.checkAll);
                this.$(".search-cate").change(this.search);
                this.$(".check-one").click(this.clickOne);
                this.$(".one-action").click(this.oneAction);
                this.$("#article-pull").click(this.pullArticle);
                this.$("#pull-topic").click(this.pullToTopic);

                var count = '<?php echo $this->escape($count); ?>';
                if (count) {
                    var message = count + ' article have been pull into '
                        + '<?php echo $this->escape($topic['title']); ?>'
                        + '&nbsp;&nbsp;&nbsp;&nbsp'
                        + '<a href="<?php
                            echo $this->url('', ['action' => 'list-article', 'topic' => $topic['id']])
                            ?>"><?php echo _a('Preview'); ?></a>';
                    this.renderMessage(true, message);
                }

            },
            checkAll: function () {
                var flag = this.$(".check-all").prop("checked");
                this.$(".check-one").prop("checked", flag).each(function () {
                    var tr = $(this).parents("tr:first");
                    if (flag) {
                        tr.addClass("info");
                    } else {
                        tr.removeClass("info");
                    }
                });
            },
            search: function () {
                var url = "<?php echo $this->url('', ['action' => 'pull', 'topic' => $topic['id']]); ?>";
                location.href = url + "?category=" + this.$(".search-cate").val();
            },
            clickOne: function (e) {
                var el = $(e.target),
                    tr = el.parents("tr:first");
                if (el.prop("checked")) {
                    tr.addClass("info");
                } else {
                    tr.removeClass("info");
                }
            },
            oneAction: function (e) {
                var el = $(e.target),
                    id = el.parents("tr:first").attr("data-id"),
                    val = el.attr("data-value");
                var self = this;
                if ('pull' == val) {
                    var url = el.attr('data-content');
                    url = url.replace(/placeholder$/, id);

                    location.href = url + "?from=" + this.encodeUrl();
                } else {
                    location.href = this.url + val + "?id=" + id + "&from="
                        + this.encodeUrl();
                }
            },
            encodeUrl: function () {
                return encodeURIComponent(location.href);
            },
            pullArticle: function (e) {
                var el = $(e.target);
                var url = el.attr('data-content');

                var id = [];
                var count = 0;
                this.$(".check-one:checked").each(function () {
                    id.push($(this).val());
                    count++;
                });
                var ids = id.join(',');
                url = url.replace(/placeholder$/, ids);

                location.href = url + "?from=" + this.encodeUrl();
            },
            renderMessage: function (status, message) {
                $('#message-box').html(
                    _.template($('#template-message').html(), {
                        status: status ? 'success' : 'error',
                        message: message
                    })
                );
            }
        }
        page.init();
    })(jQuery)
</script>
