<?php echo $header; ?>
<div class="container-fluid">
    <div class="row">
        <div class="col-lg-8">
            <h1 class="page-header">
                Chdaily Global News Feed
            </h1>
        </div>
        <div class="col-lg-4">
            <select class="form-control cm-section-selector">
                <?php foreach(['nation','world','church', 'mission', 'ministries', 'society', 'life', 'entertainment', 'comment', 'it'] as $s) echo '<option'.($this->uri->segment(4) == $s? ' selected':'').'>'.$s.'</option>';?>
            </select>
        </div>
        <div class="col-lg-12">
            <ol class="breadcrumb">
                <li>
                    <i class="fa fa-dashboard"></i>
                    <a href="<?php echo BASE_URL; ?>/admin"><?php echo $this->lang->line('nav_dash'); ?></a>
                </li>
                <li class="active">
                    <i class="fa fa-fw fa-file"></i>
                    <a href="<?php echo BASE_URL; ?>/admin/pages">Chdaily Global News Feed</a>
                </li>
            </ol>

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

<div class="container-fluid">
    <div class="row">
        <div class="col-md-12">
            <table class="table table-striped table-bordered">
                <thead>
                    <tr>
                        <th><input type="checkbox"></th>
                        <th> Image </th>
                        <th> Title </th>
                        <th class="td-actions"> </th>
                    </tr>
                </thead>
                <tbody id="postContainer">
                    <tr class="hide">
                        <td><input type="checkbox"></td>
                        <td width="90"><img src="" width="80"></td>
                        <td><a href="" target="_blank" class="news-item-title"></a></td>          
                        <td class="td-actions"><a href="/admin/data/chdaily/"
                                class="btn btn-small btn-success"><i class="fa fa-pencil"> </i></a></td>
                    </tr>
                </tbody>
            </table>

            <div class="text-center" id="loadingSpinner">
                <i class="fa fa-cog fa-spin fa-3x fa-fw"></i>
            </div>
        </div>
        <!-- /colmd12 -->
    </div>
    <!-- /row -->
</div>
<script>
$(function() {
    $('.cm-section-selector').on('change', function() {
        $('#postContainer').find('.cm-row').remove();
        $('#loadingSpinner').show();
        var section = this.value;
        $.get('/admin/data/chdaily/' + section, function(res) {            
            for (i in res) {
                var r = res[i];
                var row = $('#postContainer').find('tr').eq(0).clone(true);
                row.find('img').prop('src', r.img);
                row.find('td').eq(2).find('a').prop('href', r.url).text(r.title);
                row.find('td').eq(3).find('a').prop('href', '/admin/data/chdaily/'+section+'/'+(i-1+2))
                row.removeClass('hide').addClass('cm-row');
                $('#postContainer').append(row);
            }
            $('#loadingSpinner').hide();
        }, 'json')
    }).trigger('change');

})
</script>
<!-- /container -->
<?php echo $footer; ?>