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

{% block viewport %}{% endblock %}

{% block extra_style %}
{% include 'snippets/file_view_style.html' %}
{% endblock %}

{% block main_content %}
    {% if traffic_over_limit %}
        <p class="strip-tip">{% trans "File download is disabled: the share link traffic of owner is used up." %}</p>
    {% endif %}
    <div id="shared-file-view-hd" class="ovhd">
        <div class="fleft js-file-info">
            <h2 class="ellipsis no-bold" title="{{ file_name }}">{{ file_name }}</h2>
            {% if zipped %}
            <p class="cur-path ellipsis">
              {% trans "Current path: "%}
              {% for name, link in zipped %}
                {% if not forloop.last %}
                <a href="{{ SITE_ROOT }}d/{{ token }}/?p={{ link|urlencode }}">{{ name }}</a> /
                {% else %}
                {{ name }}
                {% endif %}
              {% endfor %}
              </p>
            {% else %}
            <p class="share-by ellipsis">{% trans "Shared by: " %}{{ shared_by|email2nickname }}</p>
            {% endif %}
        </div>

        <div class="fright js-file-op">
            {% if request.user.is_authenticated and request.user.username != shared_by %}
              {% if save_to_link %}
              <button data="{{save_to_link}}" id="save" class="shared-file-op-btn">{% trans "Save to..."%}</button>
              {% endif %}
            {% endif %}
            {% if not traffic_over_limit %}
              <a href="{% if from_shared_dir %}?p={{path|urlencode}}&dl=1{% else %}?dl=1{% endif %}" class="obv-btn shared-file-op-btn">{% trans "Download" %} ({{file_size|filesizeformat}})</a>
            {% endif %}
        </div>
    </div>

    <div id="file">
        {% include 'snippets/file_content_html.html' %}
    </div>


    <form id="file-save-form" action="{{save_to_link}}" method="post" class="file-choose-form hide">{% csrf_token %}
        <h3>{% trans "Save To:" %}</h3>
        <div class="dir-tree-cont">
            <div id="repos-dirs">
                <span class="loading-icon loading-tip"></span>
            </div>
        </div>
        <input type="hidden" name="s_token" value="{{shared_token}}" />
        <input type="hidden" name="dst_repo" value="" />
        <input type="hidden" name="dst_path" value="" />
        <p class="error hide">{% trans "Please click and choose a directory." %}</p>
        <button type="submit" class="submit">{% trans "Submit" %}</button>
        <button class="simplemodal-close">{% trans "Cancel" %}</button>
    </form>

{% endblock %}

{% block extra_script %}
{% include "snippets/file_view_js.html" %}
<script type="text/javascript">
$(function() {
    var dld_btn = $('.obv-btn').clone();
    dld_btn.html("{% trans "Download" %}").attr('class', 'sf-btn-link big-btn-link');
    $('#file-view-tip').append(dld_btn);
});
$(function () {
    var $hd = $('#shared-file-view-hd');
    $('.js-file-info', $hd).css({'max-width': $hd.width() - $('.js-file-op', $hd).outerWidth(true) - 10});
});

{% if filetype == 'PDF' and use_pdfjs and not err %}
{% else %}
function setFileViewAreaHeight() {
    var file_view = $('#file-view');
    if ($(window).height() > file_view.outerHeight(true) + file_view.offset().top) {
        file_view.outerHeight($(window).height() - file_view.offset().top);
    }
}
$(window).load(setFileViewAreaHeight).resize(setFileViewAreaHeight);
{% endif %}

{% if request.user.is_authenticated and request.user.username != shared_by %}
$('#save').click(function() {
    var form = $('#file-save-form'),
        file_tree = new FileTree();
    form.modal({appendTo:'#main', autoResize:true, focus:false});
    $.ajax({
        url: '{% url 'unenc_rw_repos' %}',
        cache: false,
        dataType: 'json',
        success: function(data) {
            var all_repos = [], repo;
            for (var i = 0, len = data.length; i < len; i++) {
                repo = data[i];
                all_repos.push({
                    'data': repo.name,
                    'attr': {'repo_id': repo.id, 'root_node': true},
                    'state': 'closed'
                });
            }
            file_tree.renderDirTree($('#repos-dirs').data('site_root', '{{SITE_ROOT}}'), form, all_repos);
        }
    });
});
$('#file-save-form').submit(function() {
    var form = $(this),
        dst_repo = $('[name="dst_repo"]', form).val(),
        dst_path = $('[name="dst_path"]', form).val();

    if (!$.trim(dst_repo) || !$.trim(dst_path)) {
        $('.error', form).removeClass('hide');
        return false;
    }
});
{% endif %}
{% include "snippets/file_content_js.html" %}
</script>
{% endblock %}
