{% load seahub_tags group_avatar_tags i18n %}

<div id="tabs" class="tab-tabs">
<div class="hd ovhd">
    <ul class="tab-tabs-nav fleft">
        <li class="tab"><a href="#my-own-repos" class="a">{% trans "Mine" %}</a></li>
        {% if ENABLE_SUB_LIBRARY and sub_lib_enabled %}
        <li class="tab"><a href="#my-sub-repos" class="a">{% trans "Sub-libraries" %}</a></li>
        {% endif %}
        <li class="tab"><a href="#repos-shared-to-me" class="a">{% trans "Shared" %}</a></li>
        <li class="tab"><a href="#group-repos" class="a">{% trans "Group" %}</a></li>
    </ul>
    <button id="repo-create" class="fright"><span class="add icon-plus-sign-alt"></span>{% trans "New Library" %}</button>
</div>
<div id="my-own-repos" class="hide">
{% if owned_repos %}
<table class="repo-list">{# 'repo-list': for repo which has 'repo-delete-btn' #}
    <tr>
        <th width="4%"><!--icon--></th>
        <th width="24%">{% trans "Name" %}</th>
        <th width="43%">{% trans "Description" %}</th>
        <th width="15%">{% trans "Last Update" %}</th>
        <th width="14%">{% trans "Operations" %}</th>
    </tr>
    {% for repo in owned_repos %}
    {% if not ENABLE_SUB_LIBRARY or not repo.is_virtual %}
    <tr>
        {% if repo.encrypted %}
        <td><img src="{{MEDIA_URL}}img/sync-folder-encrypt-20.png" title="{% trans "Read-Write" %}" alt="{% trans "directory icon" %}" /></td>
        {% else %}
        <td><img src="{{MEDIA_URL}}img/sync-folder-20.png?t=1387267140" title="{% trans "Read-Write" %}" alt="{% trans "directory icon" %}" /></td>
        {% endif %}
        <td><a href="{% url 'repo' repo.props.id %}">{{ repo.props.name }}</a></td>
        <td>{{ repo.props.desc }}</td>
        {% if repo.latest_modify %}
        <td>{{ repo.latest_modify|translate_seahub_time }}</td>
        {% else %}
        <td>--</td>
        {% endif %}
        <td data-id="{{ repo.props.id }}" data-name="{{ repo.props.name }}">
            <div>
            {% if show_repo_download_button %}
            <span class="icon-cloud-download download-btn op-icon vh" title="{% trans "Download and Sync" %}"></span>
            {% endif %}
            <span class="sf-icon-share repo-share-btn op-icon vh" title="{% trans "Share" %}"></span>
            <span class="icon-trash repo-delete-btn op-icon vh" title="{% trans "Delete" %}"></span>
            </div>
        </td>
    </tr>
    {% endif %}
    {% endfor %}
</table>
{% else %}
<div class="empty-tips">
  <h2 class="alc">{% trans "You have not created any libraries" %}</h2>
  <p>{% trans "You can create a library to organize your files. For example, you can create one for each of your projects. Each library can be synchronized and shared separately." %}</p>
</div>
{% endif %}
</div>

{% if ENABLE_SUB_LIBRARY and sub_lib_enabled %}
<div id="my-sub-repos" class="hide">
{% if sub_repos %}
<table class="repo-list">
    <tr>
        <th width="4%"><!--icon--></th>
        <th width="24%">{% trans "Name" %}</th>
        <th width="43%">{% trans "Origin" %}</th>
        <th width="15%">{% trans "Last Update" %}</th>
        <th width="14%">{% trans "Operations" %}</th>
    </tr>
    {% for repo in sub_repos %}
    <tr>
        {% if repo.encrypted %}
        <td><img src="{{MEDIA_URL}}img/sync-folder-encrypt-20.png" title="{% trans "Read-Write" %}" alt="{% trans "directory icon" %}" /></td>
        {% else %}
        <td><img src="{{MEDIA_URL}}img/sync-folder-20.png?t=1387267140" title="{% trans "Read-Write" %}" alt="{% trans "directory icon" %}" /></td>
        {% endif %}
        <td><a href="{% url 'repo' repo.id %}">{{ repo.name }}</a></td>
        <td><a href="{{ SITE_ROOT }}repo/{{ repo.origin_repo_id}}/?p={{ repo.origin_path }}">{{ repo.abbrev_origin_path }}</a></td>
        {% if repo.latest_modify %}
        <td>{{ repo.latest_modify|translate_seahub_time }}</td>
        {% else %}
        <td>--</td>
        {% endif %}
        <td data-id="{{ repo.props.id }}" data-name="{{ repo.props.name }}">
            <div>
            {% if show_repo_download_button %}
            <span class="icon-cloud-download download-btn op-icon vh" title="{% trans "Download and Sync" %}"></span>
            {% endif %}
            {% if repo.is_original_owner %}
            <span class="sf-icon-share repo-share-btn op-icon vh" title="{% trans "Share" %}"></span>
            {% endif %}
            <span class="icon-trash repo-delete-btn op-icon vh" title="{% trans "Delete" %}"></span>
            </div>
        </td>
    </tr>
    {% endfor %}
</table>
{% else %}
<div class="empty-tips">
  <h2 class="center-contents">{% trans "You have not created any sub-libraries" %}</h2>
  <p>{% trans "You can create a sub-library from a directory inside a library. A sub-library can be independently synced and shared. Files in the sub-library will be automatically kept in sync with those in the directory of the origin library." %}</p>
</div>
{% endif %}
</div>
{% endif %}

<div id="repos-shared-to-me" class="hide">
    {% if personal_shared_repos %}
    <table>
        <tr>
            <th width="4%"><!--icon--></th>
            <th width="20%">{% trans "Name" %}</th>
            <th width="33%">{% trans "Description" %}</th>
            <th width="15%">{% trans "Last Update" %}</th>
            <th width="15%">{% trans "Shared By" %}</th>
            <th width="13%">{% trans "Operations" %}</th>
        </tr>

        {% for repo in personal_shared_repos %}
        <tr>
            <td>
              {% if repo.encrypted %}
                <img src="{{MEDIA_URL}}img/sync-folder-encrypt-20.png" title="{% trans "Read-Write" %}" alt="{% trans "directory icon" %}" />
              {% else %}
                {% if repo.user_perm == 'rw' %}
                <img src="{{MEDIA_URL}}img/sync-folder-20.png?t=1387267140" title="{% trans "Read-Write" %}" alt="{% trans "directory icon" %}" />
                {% else %}
                <img src="{{MEDIA_URL}}img/folder-no-write-20.png?t=1387267140" title="{% trans "Read-Only" %}" alt="{% trans "directory icon" %}" />
                {% endif %}
              {% endif %}
            </td>
            <td><a href="{% url 'repo' repo.repo_id %}">{{ repo.repo_name }}</a></td>
            <td>{{ repo.repo_desc }}</td>
            {% if repo.last_modified %}
            <td>{{ repo.last_modified|translate_seahub_time }}</td>
            {% else %}
            <td>--</td>
            {% endif %}
            <td>{{ repo.user|email2nickname }}</td>
            <td>
                {% if show_repo_download_button %}
                <span data="{{ repo.repo_id }}" class="icon-cloud-download download-btn op-icon vh" title="{% trans "Download and Sync" %}"></span>
                {% endif %}
                {% if repo.share_type == 'personal' %}
                <span data-url="{% url 'repo_remove_share' %}?repo_id={{ repo.repo_id }}&from={{ repo.user|urlencode }}&to={{ request.user.username|urlencode }}" data-target="{{repo.repo_name}}" class="icon-trash unshare-btn op-icon vh" title="{% trans "Leave Share" %}"></span>
                {% endif %}
            </td>
        </tr>
        {% endfor %}

    </table>
    {% else %}
    <div class="empty-tips">
        <h2 class="alc">{% trans "No library is shared to you" %}</h2>
    </div>
    {% endif %}
</div>

<div id="group-repos" class="hide">
    {% if group_repos %}
    <table>
        <tr>
            <th width="4%"><!--icon--></th>
            <th width="13%">{% trans "Group" %}</th>
            <th width="4%"><!--icon--></th>
            <th width="20%">{% trans "Name" %}</th>
            <th width="29%">{% trans "Description" %}</th>
            <th width="15%">{% trans "Last Update" %}</th>
            <th width="15%">{% trans "Shared By" %}</th>
        </tr>

        {% for repo in group_repos %}
        <tr>
          {% if repo.show_group_name %}
            <td>{% grp_avatar repo.group.id 20 %}</td>
            <td><a href="{% url 'group_info' repo.group.id %}">{{ repo.group.group_name }}</a></td>
          {% else %}
            <td></td>
            <td></td>
          {% endif %}
            <td>
              {% if repo.encrypted %}
                <img src="{{MEDIA_URL}}img/sync-folder-encrypt-20.png" title="{% trans "Read-Write" %}" alt="{% trans "directory icon" %}" />
              {% else %}
                {% if repo.user_perm == 'rw' %}
                <img src="{{MEDIA_URL}}img/sync-folder-20.png?t=1387267140" title="{% trans "Read-Write" %}" alt="{% trans "directory icon" %}" />
                {% else %}
                <img src="{{MEDIA_URL}}img/folder-no-write-20.png?t=1387267140" title="{% trans "Read-Only" %}" alt="{% trans "directory icon" %}" />
                {% endif %}
              {% endif %}
            </td>
            <td><a href="{% url 'repo' repo.repo_id %}">{{ repo.repo_name }}</a></td>
            <td>{{ repo.repo_desc }}</td>
            {% if repo.last_modified %}
            <td>{{ repo.last_modified|translate_seahub_time }}</td>
            {% else %}
            <td>--</td>
            {% endif %}
            <td>{{ repo.user|email2nickname }}</td>
        </tr>
        {% endfor %}
    </table>
    {% else %}
    <div class="empty-tips">
        <h2 class="alc">{% trans "No library is shared to your groups" %}</h2>
    </div>
    {% endif %}
</div>

</div>

<table id="new-repo" class="hide">
    <tr>
        <th width="4%"><!--icon--></th>
        <th width="24%">{% trans "Name" %}</th>
        <th width="43%">{% trans "Description" %}</th>
        <th width="15%">{% trans "Last Update" %}</th>
        <th width="14%">{% trans "Operations" %}</th>
    </tr>
    <tr class="repo-item">
        <td><img src="{{MEDIA_URL}}img/sync-folder-20.png?t=1387267140" title="{% trans "Read-Write" %}" alt="{% trans "directory icon" %}" /></td>
        <td><a href="{{ SITE_ROOT }}repo/{{ repo.props.id }}/">{{ repo.props.name }}</a></td>
        <td>{{ repo.props.desc }}</td>
        <td>{% trans "Just now" %}</td>
        <td data-id="{{ repo.props.id }}" data-name="{{ repo.props.name }}">
            {% if show_repo_download_button %}
            <span class="icon-cloud-download download-btn op-icon vh" title="{% trans "Download and Sync" %}"></span>
            {% endif %}
            <span class="sf-icon-share repo-share-btn op-icon vh" title="{% trans "Share" %}"></span>
            <span class="icon-trash repo-delete-btn op-icon vh" title="{% trans "Delete" %}"></span>
        </td>
    </tr>
</table>
{% include 'snippets/repo_del_popup.html' %}
