{% extends base_template %}
{% load seahub_tags i18n %}
{% load url from future %}

{% block nav_shareadmin_class %}class="cur"{% endblock %}

{% if org %}
{% block title_panel %}
<h2>{{ org.org_name }}</h2>
{% endblock %}
{% endif %}

{% block right_panel %}
<h3>{% trans "Shared Libraries"%}</h3>
{% if shared_repos %}
<table>
    <tr>
        <th width="4%"><!--icon--></th>
        <th width="18%">{% trans "Name"%}</th>
        <th width="21%">{% trans "Share To"%}</th>
        <th width="15%">{% trans "Permission"%}</th>
        <th width="30%">{% trans "Description"%}</th>
        <th width="12%">{% trans "Operations"%}</th>
    </tr>
    {% for repo in shared_repos %}
    <tr data="{{repo.props.share_type}}">
        <td><img src="{{MEDIA_URL}}img/sync-folder-20.png" title="{% trans "Read-Write"%}" alt="{% trans "directory icon" %}" /></td>
        <td data="{{ repo.props.repo_id }}"><a href="{{ SITE_ROOT }}repo/{{ repo.props.repo_id }}">{{ repo.props.repo_name }}</a></td>
        <td data="{{repo.props.user_info}}">{{ repo.props.user }}</td>
        <td>
            <div class="share-permission">
                <span class="share-permission-cur-value">{{ repo.share_permission }}</span>
                <img src="{{MEDIA_URL}}img/edit_12.png" alt="{% trans "Edit"%} icon" title="{% trans "Edit"%}" class="share-permission-edit-icon vh" />
            </div>
            <select name="permission" class="share-permission-select hide">
                <option value="{{ repo.props.permission }}" selected="selected">{{ repo.share_permission }}</option>
                {% if repo.props.permission == 'rw' %}
                <option value="r">{% trans "Read-Only"%}</option>
                {% else %}
                <option value="rw">{% trans "Read-Write"%}</option>
                {% endif %} 
            </select>
        </td>
        <td>{{ repo.props.repo_desc }}</td>
        <td>
          {% if repo.props.share_type == 'group' %}
          <a href="#" data="{{ SITE_ROOT }}shareadmin/removeshare/?repo_id={{ repo.props.repo_id }}&from={{ request.user }}&gid={{ repo.props.group_id }}" class="cancel-share op">{% trans "Revoke"%}</a>
	  {% endif %}
          {% if repo.props.share_type == 'personal' %}
          <a href="#" data="{{ SITE_ROOT }}shareadmin/removeshare/?repo_id={{ repo.props.repo_id }}&from={{ request.user }}&to={{ repo.props.user }}" class="cancel-share op">{% trans "Revoke"%}</a>
	  {% endif %}
	  {% if repo.props.share_type == 'public' %}
	      {% if not org %}
	      <a href="#" data="{{ SITE_ROOT }}repo/unsetinnerpub/{{ repo.props.repo_id }}" class="cancel-share op">{% trans "Revoke"%}</a>
	      {% else %}
	      <a href="#" data="{{ SITE_ROOT }}organizations/{{ org.url_prefix }}/innerpubrepo/unset/{{ repo.props.repo_id }}" class="cancel-share op">{% trans "Revoke"%}</a>
	      {% endif %}
          {% endif %}
        </td>
    </tr>
    {% endfor %}
</table>
{% else %}
<p class="empty-repo-tips">{% blocktrans %}Libraries you shared to others will be shown here.{% endblocktrans %}</p>
{% endif %}

<h3>{% trans "Links"%}</h3>
{% if fileshares %}
<table class="sharelink-list">
  <tr>
    <th width="45%">{% trans "File"%}</th>
    <th width="25%">{% trans "Library"%}</th>
    <th width="15%">{% trans "Visits"%}</th>
    <th width="15%">{% trans "Operations"%}</th>
  </tr>
  {% for fs in fileshares %}
  <tr>
    <td><a href="{{ SITE_ROOT }}repo/{{ fs.repo.id }}/files/?p={{ fs.path|urlencode }}">{{ fs.filename }}</a></td>
    <td><a href="{{ SITE_ROOT }}repo/{{ fs.repo.id }}/">{{ fs.repo.name }}</a></td>
    <td>{{ fs.view_cnt }}</td>
    <td>
        <a href="#" class="op view-link" data="{{ fs.token }}">{% trans "View" %}</a>
        <a class="op" href="{{ SITE_ROOT }}sharedlink/remove/?t={{ fs.token }}">{% trans "Remove"%}</a>
    </td>
  </tr>
  {% endfor %}
</table>
<p id="link" class="hide"><input type="text" readonly="readonly" value="" id="shared-link" /></p>
{% else %}
<p class="empty-repo-tips">{% trans "links generated by click 'share link' in file-view page will be shown here." %}</p>
{% endif %}
{% endblock %}

{% block extra_script %}
<script type="text/javascript">
$('tr:gt(0)').hover(
    function() {
        $(this).find('.share-permission-edit-icon').removeClass('vh');
    },
    function() {
        $(this).find('.share-permission-edit-icon').addClass('vh');
    }
);
$('.share-permission-edit-icon').click(function() {
    $(this).parent().addClass('hide');
    $(this).parent().next().removeClass('hide'); // show 'share-permission-select'
});
$('.share-permission-select').change(function() {
    var select = $(this),
        select_cont = $(this).parent(),
        user = select_cont.prev(),
        share_type = select_cont.parent().attr('data');
        {% if org %}
        var url = '{% url 'org_share_permission_admin' org.url_prefix %}?org_id={{ org.org_id }}&share_type=' + share_type;
        {% else %}
        var url = '{% url 'share_permission_admin' %}?share_type=' + share_type;
        {% endif %}
    $.ajax({
        url: url,
        type: 'POST',
        dataType: 'json',
        cache: false,
        contentType: 'application/json; charset=utf-8',
        beforeSend: prepareCSRFToken,
        data: {
            repo_id: user.prev().attr('data'),
            email_or_group: user.attr('data'),
            permission: select.val()
        },
        success: function(data) {
            if (data['success']) {
                feedback('{% trans "Edit succeeded" %}', 'success');
                select.prev().children('.share-permission-cur-value').html(select.children('option[value="' +select.val() + '"]').text());
            } else {
                feedback('{% trans "Edit failed" %}', 'error');
            }
            select.addClass('hide');
            select.prev().removeClass('hide');
        },
        error: function(jqXHR, textStatus, errorThrown) {
            feedback(textStatus + '，{% trans "edit failed" %}', 'error');
            select.addClass('hide');
            select.prev().removeClass('hide');
        }   
    });
});
// select shows, but the user doesn't select a value, or doesn't change the permission, click other place to hide the select
$(document).click(function(e) {
    var target = e.target || event.srcElement;
    // target can't be edit-icon
    if (!$('.share-permission-edit-icon, .share-permission-select').is(target)) {
        $('.share-permission').removeClass('hide');
        $('.share-permission-select').addClass('hide');
    }
});
$('.cancel-share').click(function() {
    location.href = $(this).attr('data');
});

$(".view-link").click(function() {
    var token = $(this).attr('data'),
        link = '{{ protocol }}://' + '{{ domain }}{{ SITE_ROOT }}f/' + token + '/';
    $('#link').before('<p class="hide">' + link + '</p>');
    $('#shared-link').val(link).css('width', $('#link').prev().width() + 2);
    $("#link").modal({appendTo:'#main'});
    $('#link').prev().remove();
    return false;
});
$('#shared-link').click(function() {
    $(this).select();
});
</script>
{% endblock %}