{% extends app.request.get('instance_id') > 0 or (app.request.isXmlHttpRequest) ? "::adminBaseAjax.html.twig" : app.request.get('project_setting').instance_theme_path~":AdminTheme:base.html.twig" %}

{% block breadcrumb %}
    <li><a href="{{ path('officebrain_bundle_category_list_category_wo_culture') }}">{{ 'category.category_listing'|trans }}</a> /</li>
    <li>Category Sorting</li>

{% endblock breadcrumb %}

{% block main_page_title %}
    {% block form_title %}
        <i class="fa fa-image"></i> Category List
    {% endblock form_title %}
{% endblock main_page_title %}

{% block ajax_body %}
    {% block main_content %}
        {% if (ob_project_site_management_access_rule.banner.option.banner.status == 1) and (ob_project_site_management_access_rule.banner.option.banner.option.banner_list.status == 1) %}
        <form name="banner-page-container" action="{{ path('office_brain_bannerbundle_banneradmin_listbanner') }}" id="banner-page-container" method="GET" data-scroll-id='banner-page-container' data-container-id='bannerListTabContent'>
           
            <div class="banner-listing-block dashboard-list-block">
                <div class="table-block table-content-res-block">
                    <div class="table-responsive">
                        <table id="sort" class="table table-bordered">
                            <thead>
                                <tr>
                                    <th class='text-center'>{{ 'bannertype.banner.list.sr_no'|trans }}</th>
                                    <th>Category Name</th>
                                    <th class='text-center'>Category Image</th>
                                    <th class='text-center'>Category Description</th>
                                    <th class='text-center'>Parent Category</th>
                                    <th class='text-center'>Category Url</th>
                                    <th class='text-center'>Action</th>
                                </tr>
                            </thead>

                            
                            <tbody id="sortable">
                                <tr id="add_new"></tr>
                                    {% if (categoryList) is defined and categoryList|length >0 %}
                                        {% for key, index in categoryList %}
                                            {% set imageSrc ='' %}
                                            {%  if index.image != '' and index.image is defined %}
                                                {% set imageSrc = client_upload_base_url~'category/'~index.image %}
                                            {% else %}
                                                {% set imageSrc = asset('bundles/officebraincustombundletheme/IdmeAdminTheme/images/no-image-available.png') %}
                                            {% endif %}
                                            
                                            <tr id="prod_list_{{index.cat_master_id}}" class="ui-sortable-tr">
                                                <td style="display: none">{{index.cat_master_id}}</td>
                                                <td  class="index text-center"><i class="fa fa-bars"></i> <span class="serial_no"> {{ key+1 }} </span></td>
                                                <td>{{ index.cat_name }}</td>
                                                <td class='text-center'> <img src="{{ imageSrc }}" height="40px" width="40x"/> </td>
                                                <td class='text-center'> {{ index.description }} </td>
                                                <td class='text-center'> {{ index.parent_category_name }} </td>
                                                <td class='text-center' id="js_action_{{index.cat_master_id}}"> {{ index.categoryLink }} </td>
                                                <td><a href="javascript:void(0);" data-url="{{path('officebrain_bundle_category_updatelink',{'pms_id':index.cat_master_id})}}" data-hover="tooltip" title="Edit Url" data-placement="top" class="btn-xs sub-shop-btn js_update_category_url" data-original-title="Edit Url"><i class="fa fa-edit"></i></a></td>
                                            </tr>
                                        {% endfor %}
                                        {#<tr class="last-row">
                                                <td colspan="8" class="banner-total-record">{{ office_brain_pagination_render('1', 'banner-page-container', pagination) }}</td>
                                                <td class="total-record-list">{{ "admin.request_info.total_record" | trans }}:({{ pagination.getTotalItemCount }})</td>										
                                        </tr>#}
                                    {% else %}
                                        <tr>
                                            <td colspan='8' class="center" id="NoRecords">{{'bannertype.banner.list.no_records'|trans }}</td>
                                        </tr>
                                    {% endif %}
                                </tbody>
                            </table>
                        </div>
                    </div>
            </div>
        </form>
        {% endif %}

    {% endblock main_content %}
{% endblock ajax_body %}

    {% block footer_js %}
    {{parent()}}
        <script type="text/javascript">
    $(document).ready(function(){
        
        $(document).on('click','.js_update_category_url',function(){
            var url = $(this).data('url');
            showPageAjaxLoading();
            $.ajax({
                type : 'GET',
                url : url,
                cache : false,
                success : function(response_data) 
                {
                    hidePageAjaxLoading();
                    if (response_data!='') {
                        $('#modal-table').html(response_data);
                        $('#modal-table').addClass('model-popup-black');
                        $('#modal-table').addClass('request-info-popup-modal');
                        $('#modal-table').modal('show');
                    }
                }
            });
        });

        $(document).on('click','#js_save_category_update',function(){
            var url = $(this).data('url');
            var pms_id = $('#js_pms_id').val();
            var category_url = $('#js_category_url').val();
            var data =  { 'pms_id' : pms_id,'url':category_url};
            showPageAjaxLoading();
            $('#js_category_url_error').html('');
            $.ajax({
                type : 'POST',
                url : url,
                data : data,
                cache : false,
                success : function(response) 
                {
                    var response_data = JSON.parse(response);
                    hidePageAjaxLoading();
                    if (response_data.status==0) {
                       $('#js_category_url_error').html(response_data.message);
                    }else{
                        $('#js_action_'+pms_id).html(response_data.url);
                        $('#modal-table').modal('hide');
                    }
                }
            });
        });

        $('#sortable').sortable({
  			cursor: "move",
  			items: "tr.ui-sortable-tr",
            update: function( event, ui ) 
            {
                var data = $(this).sortable("serialize");
                console.log(data);
                var i=1;
                
                showAjaxLoading();
                $.ajax({
                data:data,
                method:'POST',
                url: Routing.generate ('officebrain_bundle_category_updatePosition', {'_locale' : SITE_CULTURE }),
                success: function(responseText) {
                    hideAjaxLoading();
                        if(responseText.success == 'success'){
                            showSuccessMessage("Category position updated");
                        }
                    }
                });
            }
  		 })
    })
</script>
    {% endblock footer_js %}