{% extends "home_base.html" %}
{% load seahub_tags i18n %}

{% block sub_title %}{% trans "Stars" %} - {% endblock %}
{% block cur_stars %}tab-cur{% endblock %}

{% block right_panel %}
<h3 class="hd">{% trans "Starred" %}</h3>
{% if starred_files %}
<table>
    <tr>
        <th width="5%"></th>
        <th width="40%">{% trans "File Name" %}</th>
        <th width="32%">{% trans "Library" %}</th>
        <th width="18%">{% trans "Last Update" %}</th>
        <th width="5%"></th>
    </tr>
    {% for sfile in starred_files %}
    <tr>
        <td class="alc"><img src="{{ MEDIA_URL }}img/file/{{ sfile.path|file_icon_filter }}" alt="{% trans "icon" %}" /></td>
        <td>
            <a href="{% url 'view_lib_file' sfile.repo.id sfile.path %}">{{ sfile.name }}</a>
        </td>
        <td>{{ sfile.repo.name }}</td>
        <td>{{ sfile.last_modified|translate_seahub_time }}</td>
        <td>
            <span data-repoid="{{sfile.repo.id}}" data-path="{{sfile.path}}" class="sf2-icon-delete unstar op-icon vh" title="{% trans "Unstar" %}"></span>
        </td>
    </tr>
    {% endfor %}
</table>
{% else %}
<div class="empty-tips">
  <h2 class="alc">{% trans "You don't have any starred files yet" %}</h2>
  <p>{% blocktrans %}You can star important files by clicking the "Star" button on file viewing page, and they will be listed here.{% endblocktrans %}</p>
</div>
{% endif %}

{% endblock %}

{% block extra_script %}{{block.super}}
<script type="text/javascript">
    $('.unstar').click(function() {
        var op = $(this),
            file_ele = op.parents('tr'),
            repo_id = op.data('repoid'),
            path = op.data('path');

        $.ajax({
            url: '{{SITE_ROOT}}ajax/repo/' + repo_id + '/file/unstar/?file=' + e(path),
            cache: false,
            dataType: 'json',
            success:function(data) {
                if (data['success']) {
                    file_ele.remove();
                    feedback("{% trans 'Successfully unstarred.' %}", "success");
                }
            },
            error: ajaxErrorHandler
        });
    });
</script>
{% endblock %}