{% extends 'dashboard/new_base.html' %}
{% load blog_tags %}
{% load paginate %}
    {% block title %}Posts{% endblock %}
    {% block extra_css %}
    <style type="text/css">
        table td {
            padding: 6px;
        }
    </style>
    {% endblock %}

    {% block content %}
        <div class="row no_row_margin heading_count">
          <div class="heading col-md-6">Blogs</div>
          <div class="count_add-new col-md-6 text-right">
            <ul class="list-inline">
              <li><a href="#">All ({{ blog_list|length }}) </a></li>
              <li><a href="#">Published ({{ published_blogs|length }}) </a></li>
            </ul>
            <span class="add_new"><a href="{% url 'blog_add' %}"><i class="fa fa-plus"></i> Add Blog</a></span>
          </div>
        </div>
        <div class="filters_row">
            <div class="col-md-6 filter_left">
                {% if request.user.is_superuser or request.user.userrole_set.last.role == "Admin"%}
                <div class="bulk_button" style="display:none">
                  <form class="bulk_actions_form" method='get'>
                    {% csrf_token %}
                    <select class="form-control" name="bulk_actions_select" id='bulk_actions_select'>
                      <option>Choose An Action</option>
                      {% for key, choice in blog_choices %}
                        <option value="{{ key }}">{{ choice }}</option>
                      {% endfor %}
                    </select>
                    <button class="btn btn-default" type="submit">Apply Action</button>
                  </form>
                </div>
                {% endif %}
            </div>
            <div class="col-md-6 filter_right">
                <form action="" method="post" id="blogs_data" class="form-inline">
                    {% csrf_token %}
                    <input type="text" placeholder="Filter By Title" value="{% if request.POST %}{{ request.POST.search_text }}{% endif %}" name='search_text' class="form-control" />
                    <select class="form-control" id="select_status" name="select_status">
                        <option value="" default>Status</option>
                        {% for key, choice in blog_choices %}
                            <option value="{{ key }}" {% ifequal key request.POST.select_status %}selected{% endifequal %}>{{ choice }}</option>
                        {% endfor %}
                    </select>
                    <button class="btn btn-default" type="submit">Apply Filter</button>
                </form>
            </div>
            <br clear="all">
        </div>

        {% if blog_list %}
            <div class="row no_row_margin table_row">
              <div class="container-fluid">
                {% paginate 5 blog_list %}
                {% show_pageitems %}
            {% with request.user.userrole_set.last as user_role %}
                <table class="table table-bordered table-striped" id="my_table">
                    <thead>
                        <tr>
                        {% if request.user.is_superuser or user_role.role == "Admin"%}
                            <th width="5%" class="text-center"><input name="bulk_actions" id="selectAll" type="checkbox"></th>
                        {% endif %}
                            <th width="30%">Title</th>
                            <th width="10%">Author</th>
                            <th width="15%">Category</th>
                            <th width="15%">Status</th>
                            <th width="25%" colspan="3">Actions</th>
                        </tr>
                    </thead>

                    {% for blog in blog_list %}
                        <tbody>
                            <tr>
                            {% if request.user.is_superuser or user_role.role == "Admin"%}
                                <td class="text-center"><input name="bulk_actions" class="bulk_actions" value="{{ blog.id }}" type="checkbox">
                                </td>
                            {% endif %}
                                <td><a href="#">{{ blog.title }}</a></td>
                                <td>{{ blog.user }}</td>
                                <td>{{ blog.category }}</td>
                                <td id="blog_status">

                                    {% if blog.status == "Published" %}
                                        <i class="fa fa-thumbs-up"></i> {{ blog.status }}
                                    {% elif blog.status == "Drafted" %}
                                        <i class="fa fa-file-o"></i> {{ blog.status }}
                                    {% elif blog.status == "Trashed" %}
                                        <i class="fa fa-trash-o"></i> {{ blog.status }}
                                    {% else %}
                                        <i class="fa fa-thumbs-down"></i> {{ blog.status }}
                                    {% endif %}

                                </td>
                                <td class="actions" colspan="3">
                                    {% if blog|is_deletable_by:request.user or request.user|get_user_role_name != 'Author' %}
                                        <form class="blog_trash_form" role="form" method="POST" action="{% url 'delete_blog' blog_slug=blog.slug %}">
                                          {% csrf_token %}
                                          <input type="hidden" name="action">
                                        </form>
                                    {% endif %}
                                    <a href="{% url 'view_blog' blog_slug=blog.slug %}" class="view"><i class="fa fa-eye"></i> View</a>
                                    {% if blog|is_deletable_by:request.user or request.user|get_user_role_name != 'Author' %}
                                        <a href="{% url 'edit_blog' blog_slug=blog.slug %}" class="edit"><i class="fa fa-edit"></i> Edit</a>
                                    {% endif %}
                                    {% if request.user.is_superuser or request.user|get_user_role_name != 'Author' or blog.user == request.user %}
                                    {% ifequal blog.status "Trashed" %}
                                      <a href='#' class="restore manage_blog" action="restore" title="Restore from trash"><i class="fa fa-refresh"></i> Restore</a>
                                      <a href='#' class="delete manage_blog" action="delete" title="Permanently delete from trash" data-confirm="true"><i class="fa fa-trash-o"></i> Delete</a>
                                    {% else %}
                                      <a href='#' class="trash manage_blog" action="trash" title="Move to Trash"><i class="fa fa-times"></i> Trash</a>
                                    {% endifequal %}

                                    {% endif %}
                                </td>
                            </tr>
                        </tbody>

                    {% endfor %}
                </table>
            {% endwith %}
            <!-- end div of table -->

            <!-- pagination -->
              <div class="pagination_wrap text-center">
                  {% show_pages %}
              </div>
            <!--/ pagination -->
            {% else %}
                <h2 align="center"> There are no blog-posts here !</h2>
            {% endif %}
            </div>
        </div>

    {% endblock %}
    {% block delete_confirmation %}
    {% endblock delete_confirmation %}
    {% block js_script %}
        <script type="text/javascript">

            $('.dashboard').addClass('active');
            $('.manage_blog').click(function(e){
              e.preventDefault();
              if ($(this).attr('action') == 'delete'){
                var confirmation = confirm("Are you sure?");
                if (confirmation){
                    $(this).siblings("form.blog_trash_form").children("input[name='action']").val($(this).attr('action'));
                }else {
                    return
                }
              }else{
                $(this).siblings("form.blog_trash_form").children("input[name='action']").val($(this).attr('action'));
              }
              $(this).siblings("form.blog_trash_form").submit();
            });

        </script>

        <script type="text/javascript">
            $('.select2_blog').select2({placeholder: 'Select Blogs'});
        </script>

        <script type="text/javascript">
        $("#selectAll").change(function() {
            // $(".bulk_button").toggle();
            $(".bulk_actions:checkbox").prop('checked', $(this).prop("checked"));
            if($(this).prop("checked")){
                $(".bulk_button").show();
            }else{
                $(".bulk_button").hide();
            }
        });

        $(".bulk_actions:checkbox").change(function() {
            if ($(this).attr("id") != "selectAll"){
                if($(".bulk_actions:checkbox:checked").length > 0){
                    $(".bulk_button").show();
                }
                else{
                    $("#selectAll").prop('checked', false);
                    $(".bulk_button").hide();
                }
            }
        });

        $('.bulk_actions_form').submit(function(e){
            e.preventDefault();
            var blog_ids = [];
            $.each($(".bulk_actions:checked"), function(){
                blog_ids.push(parseInt($(this).val(), 0));
            });
            var action = $('#bulk_actions_select :selected').val();

            $.get("{% url 'bulk_actions_blog' %}", {'blog_ids':blog_ids, 'action': action}, function(data){
                if(data.response){
                    window.location="{% url 'blog' %}";
                }else{
                    window.location="{% url 'blog' %}";
                }
            }, 'json');
        })

        $('.pagination li a').click(function(event){
            event.preventDefault();
            console.log($(this).attr('href'));
            $('#blogs_data').attr('action', $(this).attr('href'));
            $('#blogs_data').submit();
        });
        </script>

    {% endblock %}
