{% if ajax_render == false %}
    {% set template= "base.html.twig" %}
{% else %}
    {% set template= "blank.html.twig" %}
{% endif %}

    {% extends template %}

{% block body %}

    <main class='main-content bgc-grey-100' id="myImagesMainWrapper">

        {% if not is_main_dir %}
            <div class="masonry-item col-md-12 mB-10 my-images-masonry-items-not-main-dir">
                <div class="bgc-white p-10 bd">
                    <span>
                        {% include 'page-elements/components/widgets/remove-folder.twig' with {
                            'folder_path'           : subdirectory_path,
                            'upload_module_dir'     : upload_module_dir,
                            'files_count_in_tree'   : files_count_in_tree,
                            'popoverContent'        : "images.popover.removeFolder"|trans

                        } %}
                    </span>
                </div>
            </div>
        {% endif %}

        <div id='mainContent'>

            {% include 'core/galleries/lightgallery.html.twig' with {'images': all_images} %}

            <div class="widgets-wrapper">
                {% include 'page-elements/components/widgets/plus-icon.twig' with {
                    'widgetName'     : "my-files-upload-widget",
                    'id'             : "my-files-upload-widget",
                    'popoverContent' : "images.popover.addFiles"|trans
                } %}

                {% include 'page-elements/components/widgets/new-folder-icon.twig' with {
                    'widgetName'     : "new-folder-widget",
                    'id'             : "my-images-new-folder-widget",
                    'style'          : "margin-top: 10px; background-color: #0062cc; opacity: .5;",
                    'popoverContent' : "images.popover.addFolder"|trans
                } %}

                {% include 'page-elements/components/upload-modules/settings.twig' with {
                    reloaded_menu_node         : constant("App\\Action\\System\\AppAction::MENU_NODE_MODULE_NAME_MY_IMAGES"),
                    popover_translation_string : "files.popover.settings"
                } %}

                <div class="widget action pointer mass-action disabled"
                     data-entity-detials-action="true"                                       {# dialog attr #}
                     data-dialog-call-request-url="{{ path('dialog_body_files_removal') }}"  {# dialog attr #}
                     data-dialog-call-request-method="POST"                                  {# dialog attr #}
                     data-dialog-call-request-post-parameters=''                             {# dialog attr #}
                     data-call-dialog-on-click="true"                                        {# dialog attr #}
                     data-dialog-name="massActionFilesRemoval"                               {# dialog attr #}
                     data-toggle-popover="true"                                              {# popover attr #}
                     data-html="true"                                                        {# popover attr #}
                     data-content="{{ 'massActions.removeFiles.label' | trans }}"            {# popover attr #}
                >
                    <div class="fontawesome-centered">
                        <i class="far fa-trash-alt"></i>
                    </div>
                </div>

                <div class="widget action pointer mass-action disabled"
                     data-entity-detials-action="true"                                       {# dialog attr #}
                     data-dialog-call-request-url="{{ path('dialog_body_data_transfer') }}" {# dialog attr #}
                     data-dialog-call-request-method="POST"                                  {# dialog attr #}
                     data-dialog-call-request-post-parameters=''                             {# dialog attr #}
                     data-call-dialog-on-click="true"                                        {# dialog attr #}
                     data-dialog-name="massActionDataTransferImagesModule"                   {# dialog attr #}
                     data-toggle-popover="true"                                              {# popover attr #}
                     data-html="true"                                                        {# popover attr #}
                     data-content="{{ 'massActions.transferFiles.label' | trans }}"          {# popover attr #}
                >
                    <div class="fontawesome-centered ">
                        <i class="fa fa-random"></i>
                    </div>
                </div>

            </div>

        </div>
    </main>
{% endblock body %}