{% extends "base.html" %}
{% load i18n %}

{% block main_class %}d-flex ovhd{% endblock %}

{% block main_content %}
<div class="row flex-1 d-flex w100 ovhd"> {# 'ovhd' is for Firefox #}
    <div id="side-nav" class="side-nav side-tabnav col-md-3">
        <a href="#" title="{% trans "Close" %}" aria-label="{% trans "Close" %}" class="sf2-icon-x1 sf-popover-close op-icon hidden-md-up js-close-side-nav fright"></a>
        {% block left_panel %}
        <h3 class="hd">{% trans "Files" %}</h3>
        <ul class="side-tabnav-tabs">
            {% if user.permissions.can_add_repo %}
            <li class="tab"><a href="{{ SITE_ROOT }}my-libs/" class="ellipsis" title="{% trans "My Libraries" %}"><span class="sf2-icon-user" aria-hidden="true"></span>{% trans "My Libraries" %}</a></li>
            {% endif %}
            <li class="tab"><a href="{{ SITE_ROOT }}shared-libs/" class="ellipsis" title="{% trans "Shared with me" %}"><span class="sf2-icon-share" aria-hidden="true"></span>{% trans "Shared with me" %}</a></li>
            {% if user.permissions.can_view_org %}
            <li class="tab"><a href="{{ SITE_ROOT }}#org/" class="ellipsis" title="{% trans "Shared with all" %}"><span class="sf2-icon-organization" aria-hidden="true"></span>{% trans "Shared with all" %}</a></li>
            {% endif %}


            <li class="tab" id="group-nav">
                <a href="#" class="ellipsis" title="{% trans "Shared with groups" %}"><span class="toggle-icon icon-caret-left fright" aria-hidden="true"></span><span class="sf2-icon-group" aria-hidden="true"></span>{% trans "Shared with groups" %}</a>
                <ul class="grp-list hide">
                    <li>
                        <a href="{{ SITE_ROOT }}groups/"><span class="sharp" aria-hidden="true">#</span>{% trans "All Groups" %}</a>
                    </li>
                    {% for grp in grps %}
                    <li>
                        <a class="ellipsis" href="{{SITE_ROOT}}group/{{ grp.id }}/" title="{{ grp.group_name }}"><span class="sharp" aria-hidden="true">#</span>{{ grp.group_name }}</a>
                    </li>
                    {% endfor %}
                </ul>
            </li>
        </ul>

        <div class="hd w100 ovhd">
            <h3 class="fleft">{% trans "Tools" %}</h3>
        </div>
        <ul class="side-tabnav-tabs">
            <li class="tab"><a href="{{ SITE_ROOT }}starred/"><span class="sf2-icon-star" aria-hidden="true"></span>{% trans "Favorites" %}</a></li>
            {% if events_enabled %}
            <li class="tab"><a href="{{ SITE_ROOT }}dashboard/"><span class="sf2-icon-clock" aria-hidden="true"></span>{% trans "Activities" %}</a></li>
            {% endif %}
            {% for mod in request.user.mods_enabled %}
            {% if mod == 'personal wiki' %}
            <li class="tab {% block cur_personal_wiki %}{% endblock %}"><a href="{% url 'wiki:list' %}"><span class="sf2-icon-wiki" aria-hidden="true"></span>{% trans "Wikis" %}</a></li>
            {% endif %}
            {% endfor %}
            <li class="tab"><a href="{{ SITE_ROOT }}#devices/" class="ellipsis" title="{% trans "Linked Devices" %}"><span class="sf2-icon-monitor" aria-hidden="true"></span>{% trans "Linked Devices" %}</a></li>
            {% if enable_guest_invitation and user.permissions.can_invite_guest %}
            <li class="tab">
                <a href="{{ SITE_ROOT }}#invitations/"><span aria-hidden="true" class="sf2-icon-invite"></span>{% trans "Invite People" %}</a>
            </li>
            {% endif %}
            <li class="tab"><a href="{{ SITE_ROOT }}drafts/"><span class="sf2-icon-edit2" aria-hidden="true"></span>{% trans "Drafts" %}</a></li>

            <li class="tab" id="share-admin-nav">
                <a href="#" class="ellipsis" title="{% trans "Share Admin" %}"><span class="toggle-icon icon-caret-left fright" aria-hidden="true"></span><span aria-hidden="true" class="sf2-icon-wrench"></span>{% trans "Share Admin" %}</a>
                <ul class="hide">
                    {% if user.permissions.can_add_repo %}
                    <li>
                        <a href="{{ SITE_ROOT }}share-admin-libs/"><span aria-hidden="true" class="sharp">#</span>{% trans "Libraries" %}</a>
                    </li>
                    <li>
                        <a href="{{ SITE_ROOT }}share-admin-folders/"><span aria-hidden="true" class="sharp">#</span>{% trans "Folders" %}</a>
                    </li>
                    {% endif %}
                    {% if user.permissions.can_generate_share_link %}
                    <li>
                        <a href="{{ SITE_ROOT }}share-admin-share-links/"><span aria-hidden="true" class="sharp">#</span>{% trans "Links" %}</a>
                    </li>
                    {% elif user.permissions.can_generate_upload_link %}
                    <li>
                        <a href="{{ SITE_ROOT }}share-admin-upload-links/"><span aria-hidden="true" class="sharp">#</span>{% trans "Links" %}</a>
                    </li>
                    {% endif %}
                </ul>
            </li>
        </ul>
        {% endblock %}
    </div>

    <div id="right-panel" class="col-md-9 ov-auto flex-1">
        {% block right_panel %}{% endblock %}
    </div>

    {% if user.permissions.can_add_repo %}
    <form id="mods-enable-form" method="post" action="{% url 'toggle_modules' %}" class="hide">{% csrf_token%}
        <h3>{% trans "Enable Modules"%}</h3>
        <ul>
        {% for mod in request.user.mods_available %}
          {% if mod == 'personal wiki' %}
          <li>
          <label class="checkbox-label">
              <input type="checkbox" name="personal_wiki" class="vam" {%if mod in request.user.mods_enabled%}checked="checked"{% endif%} />
              <span class="checkbox-option vam">{% trans "Personal Wiki" %}</span>
          </label>
          </li>
          {% endif %}
        {% endfor %}
        </ul>
        <input type="submit" id="mods-enable-submit" value="{% trans "Submit"%}" class="submit" />
    </form>
    {% endif %}

</div>
{% endblock %}

{% block extra_script %}
<script type="text/javascript">
$('#group-nav a:first').on('click', function() {
    $('#group-nav .toggle-icon').toggleClass('icon-caret-left icon-caret-down');
    $('#group-nav .grp-list').slideToggle();
    return false;
});
$('#share-admin-nav').on('click', 'a:first', function() {
    var $shareAdmin = $('#share-admin-nav');
    $('.toggle-icon', $shareAdmin).toggleClass('icon-caret-left icon-caret-down');
    $('ul', $shareAdmin).slideToggle(250);
    return false;
});
</script>
{% endblock %}