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

{% set ob_project_setting = app.request.get('project_setting') %}
{% set ob_allowed_file_types = ob_project_setting['configuration_rule']['site_management']['option']['cms']['option']['cms_media_allowd_files']['option'] %}
{% set ob_default_file_type = (app.request.get('mediatype')) ? app.request.get('mediatype') : ob_project_setting['configuration_rule']['site_management']['option']['cms']['option']['cms_media_default_file_type']['status'] %}

{% block breadcrumb %}
<li><a href="{{ path('office_brain_page_admin_content_management') }}">{{ "cms.admin.breadcrumb"|trans }}</a> /</li>
<li><a href="{{ path('office_brain_cmsbundle_cmsmedialibrary_list') }}">{{ "cms.media_library.breadcrumb.home"|trans }}</a> / </li>
<li>{{ "cms.media_library.breadcrumb.list_title" | trans }}</li>
{% endblock breadcrumb %}

{% block main_page_title %}
    <h1>
        <i class="fa fa-file-code-o"></i>
        {% block form_title %}
            {{ 'cms.media_library.list.page_title' | trans }}
        {% endblock form_title %}
    </h1>
{% endblock main_page_title %}

{% block main_content %}
    <div class="media-image-block">
    	<form name='media-library-list-page-container' id='media-library-list-page-container' method='GET' action='{{ path('office_brain_cmsbundle_cmsmedialibrary_list') }}' data-paging-mode='' data-pagination-mode='1' data-scroll-id='media-library-list-page-container' data-container-id='media-library-page-container'>
	        <nav class="navbar navbar-default top-dropdown">
	            <div class="container-fluid">
	                <div class="row">
	                    <div class="col-lg-8 col-md-12 col-xs-12 col-sm-12">
	                        <form name="search_media_library" action="{{ path('office_brain_cmsbundle_cmsmedialibrary_list') }}" id="search_media_library" method="post">
	                            <div class="top-title-form search-width">
	                                <div class="row">
	                                    <div class="col-lg-12 col-sm-12 col-md-12">
	                                        <input type="text" target="menu-slug" maxlength="255" required="required" name="keywords" id="keywords" placeholder="{{ "cms.media_library.list.filename" | trans }}">
	                                        <div id="officebrain_bundle_cmsbundle_medialibrary_error" style="display: none;"></div>
	                                        <i class="fa-search fa search-btn"></i>
	                                    </div>
	                                </div>
	                            </div>
	                            <div class="top-title-form">
	                                <input type="button" value="{{ "cms.media_library.list.search.search_btn" | trans }}" class="button-secondary js-media-search-btn">
	                            </div>
	                            <div class="top-title-form">
	                                <a href="javascript:void(0)" onclick="window.location=window.top.location" class="admin-custom-btn"><i class="fa fa-refresh"></i>{{ "cms.media_library.list.search.reset_btn" | trans }}</a>
	                            </div>
	                        </form>
	                    </div>
	                    <div class="col-lg-4 col-md-12 col-xs-12 col-sm-12">
	                        <div class="top-title-form pull-right">
	                            <a href="{{ path('office_brain_cmsbundle_cmsmedialibrary_upload') }}" class="admin-custom-btn"><i class="fa fa-plus"></i>{{ "cms.media_library.list.upload_media_btn" | trans }}</a>
	                        </div>
	                    </div>
	                </div>
	            </div>
	        </nav>
	        <div class="dashboard-list-block">
	            <div class="tab-block">
	                <ul id="" class="nav nav-tabs js-type">
	                    {% set i = 1 %}
	                    {% for media_type, media_files in ob_allowed_file_types %}
	                        <li class="{% if media_type == ob_default_file_type %}active{% endif %}" data-media-type="{{ media_type }}" data-url="{{ path('office_brain_cmsbundle_cmsmedialibrary_list') }}"><a data-toggle="tab">{{ media_type | capitalize }}</a></li>
	                        {% set i = i + 1 %}
	                    {% endfor %}
	                </ul>
	                <div id="myTabContent" class="tab-content">
	                    {% set y = 1 %}
	                    {% for y in 1..i-1 %}
	                        <div class="tab-pane fade {% if y == 1 %}active in{% endif %}" id="tab{{ y }}">
	                            <div class="table-block table-content-res-block">
	                                <div class="table-responsive">
	                                    <table class="table table-bordered">
											<thead>
												<tr>
													<th>{{ "cms.media_library.list.file" | trans }}</th>
													<th>{{ "cms.media_library.list.path" | trans }}</th>
													<th>{{ 'admin.action'|trans }}</th>
												</tr>
											</thead>
	                                        <tbody id="js_search_list">
	                                            {% block ajax_body %}
	                                                {% if pagination.items is defined and pagination.items | length > 0 %}
	                                                    {% for media in pagination.items %}
	                                                        {% if media.type | lower == "image" %}
	                                                            {% set source = media_file_url ~ "/" ~ media.name %}
	                                                        {% else %}
	                                                            {% set file_parts = media.name | split('.') %}
	                                                            {% set file_extension = file_parts[file_parts | length-1] %}
	                                                            {% set source = asset(ob_project_assets_base_url~'/images/'~file_extension | lower~'.png') %}
	                                                        {% endif %}
	                                                        <tr id="row-{{ media.id }}">
	                                                            <td><img src="{{ source }}" alt="{{ media.name }}"></td>
	                                                            <td class="link-border-none">{{ media_file_url ~ "/" ~ media.name }}</td>
	                                                            <td>
	                                                                {% if media.type | lower == "image" %}
	{#                                                                     <a data-toggle="modal" data-target="#media_img_popup" data-original-title="{{ 'cms.media_library.list.icon.view' | trans }}" class="btn-xs sub-shop-btn js-media-view-event" data-placement="top" title="{{ 'cms.media_library.list.icon.view' | trans }}" data-hover="tooltip" data-url="{{ path('office_brain_cmsbundle_cmsmedialibrary_view', {'name' : media.name}) }}" href="javascript:void(0)"><i class="fa fa-eye"></i></a>#}
	                                                                    <a href="javascript:void(0)" data-toggle="modal" title="{{ 'cms.media_library.list.icon.view' | trans }}" data-placement="top" class="btn-xs sub-shop-btn js-view-popup" data-original-title="{{ 'cms.media_library.list.icon.view' | trans }}" data-url="{{path('office_brain_cmsbundle_cmsmedialibrary_view',{'name' : media.name})}}" data-target="#modal-table"><i class="fa fa-eye"></i></a>
	                                                                {% endif %}
	                                                                
	                                                                {% if ob_project_site_management_access_rule.cms.option.media_library.option.download.status == 1 %}
	                                                                    <a data-original-title="{{ 'cms.media_library.list.icon.download' | trans }}" class="btn-xs sub-shop-btn" data-placement="top" title="{{ 'cms.media_library.list.icon.download' | trans }}" data-toggle="modal" href="{{ path('office_brain_cmsbundle_cmsmedialibrary_download', {'name' : media.name}) }}"><i class="fa fa-cloud-download"></i></a>
	                                                                {% endif %}
	                                                                
	                                                                {% if ob_project_site_management_access_rule.cms.option.media_library.option.delete.status == 1 %}
	                                                                    {#                                                                 <a data-toggle="modal" data-target="#media_delete_popup" data-original-title="Delete" class="btn-xs sub-shop-btn js-media-delete-event" data-placement="top" title="" data-hover="tooltip" data-url="{{ path('office_brain_cmsbundle_cmsmedialibrary_delete', {'name' : media.name}) }}" href="javascript:void(0)"><i class="fa fa-trash-o"></i></a>#}
	                                                                    <a data-toggle="modal" data-target="#media_delete_popup" data-original-title="{{ 'cms.media_library.list.icon.delete' | trans }}" class="btn-xs sub-shop-btn js_delete_btn" data-id="{{ media.id }}" data-url="{{ path('office_brain_cmsbundle_cmsmedialibrary_delete') }}" data-placement="top" title="{{ 'cms.media_library.list.icon.delete' | trans }}" href="javascript:void(0)"><i class="fa fa-trash-o"></i></a>
	                                                                {% endif %}
																</td>
	                                                        </tr>
	                                                    {% endfor %}
	                                                    <tr class="last-row">
	                                                    	<th class="banner-total-record" colspan="2">{{  office_brain_pagination_render('1', 'media-library-list-page-container', pagination) }}</th>
	                                                    	<th class="total-record-list" colspan="1" align = 'right'>{{ "cms.media_library.list.pagination_total_record" | trans }}:(<span id="info_count">{{ pagination.getTotalItemCount }}</span>)</th>
	                                                	</tr>
	                                                {% else %}
	                                                    <tr>
	                                                        <td colspan="3">{{ "cms.media_library.list.no_media" | trans }}</td>
	                                                    </tr>
	                                                {% endif %}
	                                            {% endblock ajax_body %}
	                                        </tbody>
	                                    </table>
	                                </div>
	                            </div>
	                            {% set y = y + 1 %}
	                        </div>
	                    {% endfor %}
	                </div>
	            </div>
	        </div>
	     </form>
    </div>
{% endblock main_content %}

{% block footer_js %}
	{{ parent() }}
	{% javascripts  '@OfficeBrainCmsBundle/Resources/public/js/cms_media_library.js' %}
	   <script src="{{ asset_url }}" type='text/javascript'></script>
    {% endjavascripts %}
{% endblock footer_js %}