{% extends "ClarolineCoreBundle:Administration:layout.html.twig" %}

{% block title %}{{ parent() ~ ' - ' ~ 'workspace_home_tabs' | trans({}, 'platform') | striptags | raw }}{% endblock %}

{% block breadcrumb %}
    {{
        macros.breadcrumbs([
            {
                'icon': 'fa fa-cog',
                'name': 'administration'|trans({}, 'platform'),
                'href': path('claro_admin_index')
            },
            {
                'name': 'home_tabs'|trans({}, 'platform'),
                'href': path('claro_admin_home_tabs_configuration_menu')
            },
            {
                'name': 'workspace_home_tabs'|trans({}, 'platform'),
                'href': ''
            }
        ])
    }}
{% endblock %}

{% block section_content %}

    <div id="hometab-type-div" hometab-type-value="workspace"></div>
    <div id="hometab-id-div" hometab-id="{{ curentHomeTabId }}"></div>

    <div class="panel-heading">
        <h3 class="panel-title">
            {{ 'workspace_home_tabs'|trans({}, 'platform') }}
        </h3>
    </div>

    <div class="panel-body">
        <div class="well well-sm">
            <small>{{ 'only_for_workspace_creation'|trans({}, 'platform') }}</small>
        </div>
        <div>
            <ul class="nav nav-tabs margin-bottom-md">
                {% for homeTabConfig in homeTabConfigs %}
                {% set homeTab = homeTabConfig.getHomeTab() %}
                {% set homeTabId = homeTab.getId() %}
                    <li class="{% if homeTabId == curentHomeTabId %}active{% endif %} hometab-element"
                        hometab-id="{{ homeTabId }}"
                        hometab-config-id="{{ homeTabConfig.getId() }}"
                    >
                        <a href="{{
                            path(
                                'claro_admin_workspace_home_tabs_configuration',
                                {'homeTabId': homeTabId}
                            )
                        }}">
                            <i class="hometab-reorder-left-btn pointer-hand fa fa-arrow-left"></i>
                            {{ homeTab.getName() }}
                            <span class="hometab-buttons" id="hometab-buttons-{{ homeTabId }}">
                                <i class="hometab-rename-btn pointer-hand fa fa-pencil-square-o"></i>
                                <i class="hometab-visibility-btn pointer-hand
                                    {% if homeTabConfig.isVisible() %}
                                        fa fa-eye
                                    {% else %}
                                        fa fa-eye-slash
                                    {% endif %}"
                                    visiblility-value="
                                        {% if homeTabConfig.isVisible() %}
                                            visible
                                        {% else %}
                                            invisible
                                        {% endif %}"
                                ></i>
                                <i class="hometab-delete-btn fa fa-trash-o pointer-hand"></i>
                            </span>
                            <i class="hometab-reorder-right-btn pointer-hand fa fa-arrow-right"></i>
                        </a>
                    </li>
                {% endfor %}
                <li id="add-hometab-btn">
                    <a href="">
                        <i id="add-hometab-button" class="fa fa-plus"></i>
                    </a>
                </li>
            </ul>
        </div>
        <br>
        <br>
        <div class="panel-group">
            <div id="widgets-list-panel">
                {% for widgetHomeTabConfig in widgetHomeTabConfigs %}
                {% set widgetInstance = widgetHomeTabConfig.getWidgetInstance() %}
                {% set widget = widgetInstance.getWidget() %}
                    <div id="widget-panel-{{ widgetHomeTabConfig.getId() }}"
                        class="panel panel-default widget-instance-panel"
                        widget-hometab-config-id="{{ widgetHomeTabConfig.getId() }}"
                        widget-instance-id="{{ widgetInstance.getId() }}"
                    >
                        <div class="panel-body widget-instance-view-element">
                            <span class="widget-instance-name">
                                {{ widgetInstance.getName() }}
                            </span>
                            <small>
                                [{{ widget.getName()|trans({}, 'widget') }}]
                            </small>
                            <span class="widget-instance-btns">
                                <i class="fa fa-pencil widget-instance-rename pointer-hand"></i>
                                <i class="fa fa-cog widget-instance-config pointer-hand"></i>
                            </span>
                            <span class="widget-hometab-config-btns pull-right">
                                <span class="widget-order-btn-group">
                                    {% if widgetHomeTabConfig.getWidgetOrder() > 1 %}
                                        <i class="fa fa-arrow-up widget-order-up pointer-hand"></i>
                                    {% endif %}
                                    {% if widgetHomeTabConfig.getWidgetOrder() < lastWidgetOrder %}
                                        <i class="fa fa-arrow-down widget-order-down pointer-hand"></i>
                                    {% endif %}
                                </span>
                                <i class="widget-visibility-btn pointer-hand
                                    {% if widgetHomeTabConfig.isVisible() %}
                                        fa fa-eye
                                    {% else %}
                                        fa fa-eye-slash
                                    {% endif %}"
                                    visiblility-value="
                                        {% if widgetHomeTabConfig.isVisible() %}
                                            visible
                                        {% else %}
                                            invisible
                                        {% endif %}"
                                ></i>
                                <i class="widget-delete-btn fa fa-trash-o pointer-hand"></i>
                            </span>
                        </div>
                        <div class="panel-body widget-instance-edition-element hide">
                        </div>
                    </div>
                {% endfor %}
            </div>
            <br>
            {% if homeTabConfigs|length > 0 %}
            <div class="panel panel-default add-widget-instance">
                <div class="panel-heading pointer-hand text-center">
                    <i class="fa fa-plus-circle">
                        {{ 'add_widget_to_home_tab'|trans({}, 'platform') }}
                    </i>
                </div>
            </div>
            {% endif %}
        </div>
    </div>

    <div id="form-modal-box" class="modal fade" role="dialog" aria-hidden="true">
        <div class="modal-dialog">
            <div class="modal-content">
                <div class="modal-header">
                    <button type="button" class="close" data-dismiss="modal" aria-hidden="true">&times;</button>
                    <h3 id="form-modal-title"></h3>
                </div>
                <div id="form-modal-body" class="modal-body">
                </div>
            </div>
        </div>
    </div>

    <div id="delete-hometab-validation-box" class="modal fade" role="dialog" aria-hidden="true">
        <div class="modal-dialog">
            <div class="modal-content">
                <div class="modal-header">
                    <button type="button" class="close" data-dismiss="modal" aria-hidden="true">&times;</button>
                    <h3>{{ 'home_tab_delete_confirm_title'|trans({}, 'platform') }}</h3>
                </div>
                <div class="modal-body">
                    <p>{{ 'home_tab_delete_confirm_message'|trans({}, 'platform') }}</p>
                </div>
                <div class="modal-footer">
                    <input type="button" id="delete-hometab-confirm-ok" class="btn btn-primary" value="{{ 'ok'|trans({}, 'platform') }}"/>
                    <input type="button" class="btn btn-default" data-dismiss="modal" value="{{ 'cancel'|trans({}, 'platform') }}"/>
                </div>
            </div>
        </div>
    </div>

    <div id="delete-widget-hometab-validation-box" class="modal fade" role="dialog" aria-hidden="true">
        <div class="modal-dialog">
            <div class="modal-content">
                <div class="modal-header">
                    <button type="button" class="close" data-dismiss="modal" aria-hidden="true">&times;</button>
                    <h3>{{ 'widget_home_tab_delete_confirm_title'|trans({}, 'platform') }}</h3>
                </div>
                <div class="modal-body">
                    <p>{{ 'widget_home_tab_delete_confirm_message'|trans({}, 'platform') }}</p>
                </div>
                <div class="modal-footer">
                    <input type="button" id="delete-widget-hometab-confirm-ok" class="btn btn-primary" value="{{ 'ok'|trans({}, 'platform') }}"/>
                    <input type="button" class="btn btn-default" data-dismiss="modal" value="{{ 'cancel'|trans({}, 'platform') }}"/>
                </div>
            </div>
        </div>
    </div>
{% endblock %}

{% block javascripts %}
    {{ parent() }}
    <script
        src='{{ asset('bundles/clarolinecore/js/administration/adminHomeTabsConfig.js') }}'
        type="text/javascript">
    </script>
{% endblock %}
