{% extends base_template %}

{% load seahub_tags avatar_tags i18n %}
{% load url from future %}

{% block info_bar_message %}
{% if request.user.is_authenticated %}
  {{ block.super }}
{% else %}
  <div id="sharelink-infobar">
    <p>{% blocktrans %}This page will be invalid shortly, you can join <a href="http://seafile.com/" target="_blank">Seafile</a> to experience more.{% endblocktrans %}</p>
  </div>
{% endif %}
{% endblock %}

{% block main_panel %}
    <div class="w100 ovhd">
        <h2 class="fleft">{{repo.props.name}}</h2>
        <div class="fright">
            <button id="repo-download-btn">{% trans "Download"%}</button>
            {% if user_perm == 'rw' %}
            <button id="recycle-btn" data="{% url 'repo_recycle_view' repo.id %}">{% trans "Trash"%}</button>
            {% endif %}
        </div>
    </div>
    {% if user_perm == 'r' %}
    <p>{% trans "This library is read-only, and you can only view the files."%}</p>
    {% endif %}

    {% if user_perm and path == '/' %}
    <div id="repo-basic-info">
      <p class="desc">{{repo.props.desc}}</p>
      <p class="size">{% trans 'Size: ' %}{{ repo_size|filesizeformat }}</p>
    </div>

    <div id="repo-latest-commit">
        <p class="commit-msg ovhd">
        <span class="fleft">
            {{ current_commit.props.desc|translate_commit_desc }}
            <a class="lsch" href="{{ SITE_ROOT }}repo/history/changes/{{ repo.id }}/?commit_id={{ current_commit.id }}" data="{{ current_commit.props.ctime|tsstr_sec }}">{% trans "Detail"%}</a>
        </span>
        {% if user_perm == 'rw' %}
        <a href="{% url 'seahub.views.repo_history' repo.id %}" class="more fright">{% trans "History"%}</a>
        {% endif %}
        </p>
        <p class="meta-info">
        <span class="author">
            {% if current_commit.props.creator_name %}
            {% if not current_commit.second_parent_id %}
            {% avatar current_commit.props.creator_name 20 %}
            <a class="name" href="{% url 'profile.views.user_profile' current_commit.props.creator_name %}">{{ current_commit.creator_name|email2nickname }}</a>
            {% else %}
            <span class="name">{% trans "Generated by system"%}</span>
            {% endif %}
            {% else %}
            {% trans "Unknown"%}
            {% endif %}
        </span>
        <span class="time">{{ current_commit.props.ctime|translate_seahub_time }}</span>
        </p>
        <div id="ls-ch" class="hide"></div><!--list modification details of a commit-->
    </div>
    {% endif %}

    <div class="repo-file-list-outer-container">
        <div class="repo-file-list-inner-container">
            {% if not user_perm %}
            <div class="repo-file-list-not-show">
                <p class="access-notice">{% trans "You can't access this library."%}</p>
            </div>
            {% else %}
            <div class="repo-file-list-topbar ovhd">
                <p class="path fleft">
                {% trans "Current path: "%}
                {% for name, link in zipped %}
                {% if not forloop.last %}
                <a href="{{ SITE_ROOT }}repo/{{ repo.id }}/?p={{ link|urlencode }}">{{ name }}</a> /                
                {% else %}
                {{ name }}
                {% endif %}
                {% endfor %}
                </p>
                {% if user_perm == 'rw' %}
                <div class="repo-op fright">
                    <button data="{{ SITE_ROOT }}repo/upload_file/{{repo.id}}/?p={{ path|urlencode }}" id="upload-file" class="op-btn">{% trans "Upload"%}</button>
                    <button id="add-new-dir" class="op-btn">{% trans "New Directory"%}</button>
                    <button id="add-new-file" class="op-btn">{% trans "New File"%}</button>
                </div>
                {% endif %}
            </div>
            <!-- /.repo-file-list-topbar -->
            <table class="repo-file-list">
                <tr>
                    <th width="3%"></th>
                    <th width="5%"></th>
                    <th width="55%">{% trans "Name"%}</th>
                    <th width="10%">{% trans "Size"%}</th>
                    <th width="27%">{% trans "Operations"%}</th>
                </tr>

                {% for dirent in dir_list %}
                <tr>
                    <td></td>
                    <td class="icon-container"><img src="{{ MEDIA_URL }}img/folder-icon-24.png" alt="{% trans "Directory icon"%}" /></td>
                    <td>
                        <a href="{{ SITE_ROOT }}repo/{{ repo.id }}/?p={{ path|urlencode }}{{ dirent.obj_name|urlencode }}">{{ dirent.obj_name }}</a>
                    </td>

                    <td></td>
                    <td>
                        {% if user_perm %}
                        <div class="repo-file-op vh">
                            <div class="displayed-op">
                                <a class="op" href="{{ SITE_ROOT }}repo/download_dir/{{ repo.id }}/?parent={{ path|urlencode }}&dirname={{ dirent.obj_name|urlencode }}">{% trans 'Download' %}</a>
                            </div>
                            {% if user_perm == 'rw' %}
                            <img src="{{ MEDIA_URL }}img/dropdown-arrow.png" title="{% trans 'More operations'%}" alt="{% trans 'More operations'%}" class="more-op-icon" data="no-popup" />
                            <ul class="hidden-op hide">
                                <li><a class="op" href="{{ SITE_ROOT }}repo/{{ repo.props.id }}/{{ dirent.props.obj_id }}/?p={{ path|urlencode }}&file_name={{ dirent.props.obj_name|urlencode }}&op=del">{% trans "Delete"%}</a></li>
                                <li><a class="op dir-rename" href="#" data="{{ dirent.obj_name }}">{% trans "Rename"%}</a></li>
                                <li><a class="op dir-mv" href="#" data="{{ dirent.obj_name }}">{% trans "Move"%}</a></li>
                                <li><a class="op dir-cp" href="#" data="{{ dirent.obj_name }}">{% trans "Copy"%}</a></li>
                            </ul>
                            {% endif %} 
                        </div>
                        {% endif %}
                    </td>
                </tr>
                {% endfor %}

                {% for dirent in file_list %}
                <tr>
                    <td class="icon-container">
                        {% if dirent.starred %}
                        <img src="{{ MEDIA_URL }}img/gray-star-icon.png" alt="{% trans 'Starred' %}" title="{% trans 'Starred' %}" class="file-star" data-path="{{ path }}{{dirent.obj_name}}" data-status="starred" />
                        {% else %}
                        <img src="{{ MEDIA_URL }}img/gray-unstar-icon.png" alt="{% trans 'Unstarred' %}" title="{% trans 'Unstarred' %}" class="file-star" data-path="{{ path }}{{dirent.obj_name}}" data-status="unstarred" />
                        {% endif %}
                    </td>
                    <td class="icon-container"><img src="{{ MEDIA_URL }}img/file/{{ dirent.obj_name|file_icon_filter }}" alt="{% trans "File"%}" /></td>
                    <td>
                        <a class="op" href="{{ SITE_ROOT }}repo/{{ repo.props.id }}/files/?p={{ path|urlencode }}{{ dirent.obj_name|urlencode }}">{{ dirent.props.obj_name }}</a>
                    </td>

                    <td>{{ dirent.file_size|filesizeformat }}</td>
                    <td>
                        <div class="repo-file-op vh">
                            <div class="displayed-op">
                                <a class="op" href="{{ SITE_ROOT }}repo/{{ repo.props.id }}/{{ dirent.props.obj_id }}/?file_name={{ dirent.props.obj_name }}&op=download">{% trans "Download"%}</a>
                                {% if user_perm == 'rw' %}
                                <a class="op update-file" data-target="{{ path }}{{dirent.obj_name}}" href="#">{% trans "Update"%}</a>
                                {% endif %}
                            </div>
                            {% if user_perm == 'rw' %}
                            <img src="{{ MEDIA_URL }}img/dropdown-arrow.png" title="{% trans "More Operations"%}" alt="{% trans "More Operations"%}" class="more-op-icon" data="no-popup" />
                            <ul class="hidden-op hide">
                                <li><a class="op" href="{{ SITE_ROOT }}repo/{{ repo.props.id }}/{{ dirent.props.obj_id }}/?p={{ path|urlencode }}&file_name={{ dirent.props.obj_name|urlencode }}&op=del">{% trans "Delete" %}</a></li>
                                <li><a class="op file-rename" href="#" data="{{ dirent.obj_name }}">{% trans "Rename" %}</a></li>
                                <li><a class="op file-mv" href="#" data="{{ dirent.obj_name }}">{% trans "Move" %}</a></li>
                                <li><a class="op file-cp" href="#" data="{{ dirent.obj_name }}">{% trans "Copy" %}</a></li>
                                <li><a class="op" href="{% url 'file_revisions' repo.props.id %}?p={{ path }}{{ dirent.obj_name }}">{% trans "History" %}</a></li>
                            </ul>
                            {% endif %}
                        </div>
                    </td>
                </tr>
                {% endfor %}
            </table>
            <!-- /.repo-file-list -->
            {% endif %}
        </div>
    </div>

    <!-- popup dialog for file upload -->
    <div id="upload-file-dialog" class="hide">
        <h3>{% trans "Upload Files" %}</h3>
        {% if no_quota %}
        <p class="error">{% trans "The owner of this library has ran out of space." %}</p>
        {% else %}
        <form id="upload-file-form" enctype="multipart/form-data" method="post" action="{{ upload_url }}">
            <input type="hidden" name="parent_dir" id="parent_dir" value="{{ parent_dir }}" />
            <div class="files-add">
                <span class="op">{% trans "Add files" %}</span>
                <span id="upload-add-tip">({% trans "smaller than" %} {{ max_upload_file_size|filesizeformat }})</span>
                <input type="file" name="file" id="file-upload-input" />
            </div>
            <div id="upload-file-list"></div>
            <p class="error">{{ error_msg }}</p>
            <input type="submit" value="{% trans "Upload" %}" class="submit" />
        </form>
        <div id="upload-progress-con" class="upload-progress-con hide">
            <p>{% trans "Uploaded:" %} <span class="upload-progress-text">{% trans "Fetching ..." %}</span></p>
            <div class="upload-progress-bar"></div>
            <button class="upload-cancel">{% trans "Cancel" %}</button>
            <iframe class="hide"><!--for chrome--></iframe>
        </div>
        {% endif %}
    </div>

    <!-- popup dialog for file update -->
    <div id="update-file-dialog" class="hide">
        <h3>Update File</h3>
        {% if no_quota %}
        <p class="error">{% trans "The owner of this library has ran out of space." %}</p>
        {% else %}      
        <form id="update-file-form" enctype="multipart/form-data" method="post" action="{{ update_url }}?head={{ head_id }}">
            <input type="hidden" name="target_file" />
            <input type="file" name="file" id="file-update-input" />
            <p>({% trans "Smaller than" %} {{ max_upload_file_size|filesizeformat }})</p>          
            <p class="error">{{ error_msg }}</p>
            <input type="submit" value="{% trans "Update" %}" class="submit" />
        </form>

        <div id="update-progress-con" class="upload-progress-con hide">
            <p>{% trans "Uploaded:" %} <span class="upload-progress-text">{% trans "Fetching..." %}</span></p>
            <div class="upload-progress-bar"></div>
            <button class="upload-cancel">{% trans "Cancel" %}</button>
            <iframe class="hide"><!--for chrome--></iframe>
        </div>
        {% endif %}
    </div>

    <form id="add-new-dir-form" action="" method="post" class="simple-input-popup hide">{% csrf_token %}
        <h3>{% trans "New Directory" %}</h3>
        <label>{% trans "Directory Name" %}</label>
        <input type="hidden" name="repo_id" value="{{ repo.id }}" />
        <input type="hidden" name="parent_dir" value="{{ path }}" />
        <input type="text" name="new_dir_name" value="" class="long-input" maxlength="{{max_file_name}}"/><br />
        <p class="error hide"></p>
        <input type="submit" value="{% trans "Submit" %}" class="submit" />
        <button class="simplemodal-close">{% trans "Cancel" %}</button>
    </form>

    <form id="add-new-file-form" action="" method="post" class="simple-input-popup hide">{% csrf_token %}
        <h3>{% trans "New File" %}</h3>
        <div id="featured-filetype">
            <label>{% trans "Featured File Type" %}</label><br />
            <button type="button" data="seaf" title="{% trans "Click to choose" %}">seaf</button> <span>{% trans "online Rich Text format ( experimental ) ." %}</span> <a href="http://www.seafile.com/{% if LANGUAGE_CODE == 'en' %}en/{% endif %}help/seaf/" target="_blank">{% trans 'more' %}</a><br />
            <button type="button" data="md" title="{% trans "Click to choose" %}">markdown</button> <span>{% trans "simple markup format." %}</span> <a href="http://www.seafile.com/{% if LANGUAGE_CODE == 'en' %}en/{% endif %}help/markdown/" target="_blank">{% trans 'more' %}</a>
        </div>
        <label>{% trans "File Name" %}</label>
        <input type="hidden" name="repo_id" value="{{ repo.id }}" />
        <input type="hidden" name="parent_dir" value="{{ path }}" />
        <input type="text" name="new_file_name" value="" class="long-input" maxlength="{{max_file_name}}"/>
        <p class="error hide"></p>
        <input type="submit" value="{% trans "Submit"%}" class="submit" />
        <button class="simplemodal-close">{% trans "Cancel"%}</button>
    </form>

    <form id="mv-form" action="{{ SITE_ROOT }}file/move/" method="post" class="hide">
        <h3 id="mv-hd"></h3>
        <h4 id="mv-detail"></h4>
        <div id="mv-dir-list">
            <h5><span class="tri-bg tri-down-bg"></span>{% trans "Current Library"%}</h5>
            <div id="current-repo-dirs"></div>
            <h5><span class="tri-bg tri-right-bg"></span>{% trans "Other Libraries"%}</h5>
            <div id="other-repos-dirs" class="hide"></div>
        </div>
        <input type="hidden" name="operation" id="mv-type" value="" />
        <input type="hidden" name="src_repo" value="{{ repo.id }}" />
        <input type="hidden" name="src_path" value="{{ path }}" />
        <input type="hidden" name="obj_name" value="" />
        <input type="hidden" name="obj_type" value="" />
        <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>
        <input type="submit" value="{% trans "Submit"%}" class="submit" />
        <button class="simplemodal-close">{% trans "Cancel"%}</button>
    </form>

    <form id="rename-form" action="{{ SITE_ROOT}}repo/file_rename/" method="post" class="simple-input-popup hide">
        <h3>{% trans 'Rename <span id="rename-type"></span>' %}</h3>
        <p>{% trans 'Rename <span id="rename-obj" class="op-target"></span> as: ' %}</p>
        <input type="hidden" name="repo_id" value="{{ repo.id }}" />
        <input type="hidden" name="parent_dir" value="{{ path }}" />
        <input type="hidden" name="oldname" value="" />
        <input type="text" name="newname" value="" class="long-input" maxlength="{{max_file_name}}"/><br />
        <p class="error hide"></p>
        <input type="submit" value="{% trans "Submit"%}" class="submit" />
        <button class="simplemodal-close">{% trans "Cancel"%}</button>
    </form>

    {% with attach_type='dir' %}
    {% include "snippets/group_recommend_form.html" %}
    {% endwith %}
{% endblock %}

{% block extra_script %}
<script type="text/javascript" src="{{ MEDIA_URL }}jstree_pre1.0_stable/jquery.jstree.js"></script>
<script type="text/javascript" src="{{ MEDIA_URL }}js/jquery.MultiFile.pack.js"></script>
<script type="text/javascript">
var popup_tr = ''; // the tr which the shown popup belongs to
var no_file_op_popup = true;
$("tr:gt(0)").unbind().hover( // remove previously binded hover handler at first
    function() {
        if (no_file_op_popup) {
            $(this).addClass('hl').find('.repo-file-op').removeClass('vh');
        }
    },
    function() {
        if (no_file_op_popup) {
            $(this).removeClass('hl').find('.repo-file-op').addClass('vh');
        }
    }
);
$('#main-panel').removeClass('ovhd');
$('.more-op-icon').click(function(e) {
    var hidden_op = $(this).next();
    if ($(this).attr('data')) { // no popup
        hidden_op.css({'left': $(this).position().left + $(this).width() + 5});
        if ($(this).offset().top + hidden_op.height() <= $('#main').offset().top + $('#main').height()) {
            hidden_op.css('top', 6);
        } else {
            hidden_op.css('bottom', 2);
        }
        hidden_op.removeClass('hide');
        $(this).attr('data','');
        no_file_op_popup = false;
        popup_tr = $(this).parents('tr');
    } else {
        hidden_op.addClass('hide');
        $(this).attr('data','no-popup');
        no_file_op_popup = true;
        popup_tr = '';
    }
});
$(document).click(function(e) {
    var target =  e.target || event.srcElement;
    if (!no_file_op_popup &&
        !$('.more-op-icon, .hidden-op').is(target) &&
        !$('.hidden-op').find('*').is(target)) {
        $('.hidden-op').addClass('hide');
        $('.more-op-icon').attr('data', 'no-popup');
        no_file_op_popup = true;

        if (!popup_tr.find('*').is(target)) {
            popup_tr.removeClass('hl').find('.repo-file-op').addClass('vh'); // clicked place: the first tr, place out of the table
            $('tr:gt(0)').each(function() { // when other tr is clicked
                if ($(this).find('*').is(target)) {
                    $(this).addClass('hl').find('.repo-file-op').removeClass('vh');
                }
            });
        }
    }
});

$('.hidden-op li').hover(
    function() {
        $(this).css('background', '#eee');
    },
    function() {
        $(this).css('background', '#fff');
    }
);

$('.file-rename, .dir-rename').click(function () {
    var type = $(this).hasClass('file-rename') ? '{% trans "File" %}' : '{% trans "Directory" %}';
    var name = $(this).attr('data');
    $('#rename-type').html(type);
    $('#rename-obj').html(name);
    $('#rename-form input[name*="name"]').val(name);
    $('#rename-form').modal();
    $('#simplemodal-container').css({'width':'auto', 'height':'auto'});
    $(window).resize();// make the popup in the center of the window
    return false;
});

var current_repo = [],
    other_repos = [];
{% for a_repo in accessible_repos %}
    {% if a_repo.props.id == repo.props.id %}
        {% if a_repo.props.has_subdir %} 
            current_repo.push({
                'data': '{{ a_repo.props.name }}',
                'attr': {'repo_id': '{{ a_repo.props.id }}'},
                'state': 'closed'
            });  
        {% else %}
            current_repo.push({
                'data': '{{ a_repo.props.name }}',
                'attr': {'repo_id': '{{ a_repo.props.id }}'}
            });
        {% endif %}
    {% else %}
        {% if a_repo.props.has_subdir %} 
            other_repos.push({
                'data': '{{ a_repo.props.name }}',
                'attr': {'repo_id': '{{ a_repo.props.id }}'},
                'state': 'closed'
            });  
        {% else %}
            other_repos.push({
                'data': '{{ a_repo.props.name }}',
                'attr': {'repo_id': '{{ a_repo.props.id }}'}
            });
        {% endif %}
    {% endif %}
{% endfor %}

$('.file-cp, .file-mv, .dir-cp, .dir-mv').click(function () {
    var obj_name = $(this).attr('data'),
        mv_type = '',
        file_type = '';
    if ($(this).hasClass('file-cp') || $(this).hasClass('dir-cp')) {
        $('#mv-type').val('cp');
        mv_type = '{% trans "Copy " %}';
    } else {
        $('#mv-type').val('mv');
        mv_type = '{% trans "Move " %}';
    }

    if ($(this).hasClass('file-cp') || $(this).hasClass('file-mv')) {
        file_type = '{% trans "File" %}';
        $('input[name="obj_type"]').val('file');
    } else {
        file_type = '{% trans "Directory" %}';
        $('input[name="obj_type"]').val('dir');
    }

    $('input[name="obj_name"]').val(obj_name);
    $('#mv-hd').html(mv_type + file_type);
    $('#mv-detail').html(mv_type + ' <span class="op-target">' + obj_name + '</span> {% trans "to:" %}');
    $('#mv-form').modal({appendTo:'#main', autoResize:true, focus:false});
    renderDirTree($('#current-repo-dirs'), current_repo);
    return false;
});

function renderDirTree(container, repo_data) {
    container
        .delegate('.jstree-closed', 'dblclick', function(e) {
            container.jstree('open_node', $(this));
            $(this).find('a').removeClass('jstree-clicked');
        })
        .bind('before.jstree', function(e, data) {
            if (data.func === 'select_node') { // ensure only one selected dir display in the popup
                $('#mv-form .jstree-clicked').removeClass('jstree-clicked');
            }
        })
        .bind('select_node.jstree', function(e, data) {
            var repo_id = data.rslt.obj.attr('repo_id') || data.inst._get_parent(data.rslt.obj).attr('repo_id');
            $('input[name="dst_repo"]').attr('value', repo_id);
            var path = data.inst.get_path(data.rslt.obj);
            var mv_dst_path = '';
            if (path.length == 1) {
                mv_dst_path = '/';
            } else {
                path.shift();
                mv_dst_path = '/' + path.join('/') + '/';
            }
            $('input[name="dst_path"]').attr('value', mv_dst_path);
        })
        .jstree({
            'json_data': {
                'data': repo_data,
                'ajax': {
                    'url': function(data) {
                        var path = this.get_path(data);
                        var repo_id = data.attr('repo_id');
                        if (path.length == 1) {
                            path = '/';
                        } else {
                            path.shift();
                            path = '/' + path.join('/') + '/';
                        }
                        return '{{ SITE_ROOT }}file/move/get_subdir/?repo_id=' + e(repo_id) + '&path=' + e(path);
                    }
                }
            },
            'core': {
                'animation': 100
            },
            'plugins': ['themes', 'json_data', 'ui']
        });
}

$('#mv-dir-list h5').click(function() {
    var span = $(this).children('.tri-bg'),
        next = $(this).next();
    if (span.hasClass('tri-right-bg')) {
        span.attr('class','tri-bg tri-down-bg');
        if (next.attr('id') == 'current-repo-dirs') {
            renderDirTree(next, current_repo);
        } else {
            renderDirTree(next, other_repos);
        }
        next.removeClass('hide');
    } else {
        span.attr('class','tri-bg tri-right-bg');
        next.addClass('hide');
    }
});

$('#rename-form').submit(function() {
    var new_name = $(this).find('input[name="newname"]').val();
    if (!$.trim(new_name)) {
        apply_form_error('rename-form', "{% trans "File name can't be empty" %}");
        return false;
    }

    var submit_btn = $(this).children('input[type="submit"]');  
    disable(submit_btn);
    
    $.ajax({
        url: '{% url 'views.repo_rename_file' %}',
        type: 'POST',
        dataType: 'json',
        cache: 'false',
        beforeSend: prepareCSRFToken,
        data: {
            'repo_id': $('#rename-form input[name="repo_id"]').val(),
            'parent_dir': $('#rename-form input[name="parent_dir"]').val(),
            'oldname': $('#rename-form input[name="oldname"]').val(),
            'newname': new_name
        },
        success: function(data) {
            if (data['success']) {
                location.reload(true);
            } else {
                apply_form_error('rename-form', data['error']);
                enable(submit_btn);
            }
        },
        error: function(data, textStatus, jqXHR) {
            var errors = $.parseJSON(data.responseText);
            $.each(errors, function(index, value) {
                apply_form_error('rename-form', value[0]);
            });
            enable(submit_btn);
        }
    });
    return false;
});

$('#add-new-file-form').submit(function() {
    var new_file = $(this).find('input[name="new_file_name"]').val();
    if (!$.trim(new_file)) {
        apply_form_error('add-new-file-form', "{% trans "File name can't be empty" %}");
        return false;
    }

    var submit_btn = $(this).children('input[type="submit"]');  
    disable(submit_btn);
    $.ajax({
        url: '{% url 'views.repo_new_file' %}',
        type: 'POST',
        dataType: 'json',
        beforeSend: prepareCSRFToken,
        data: {
            'repo_id': $('#add-new-file-form input[name="repo_id"]').val(),
            'parent_dir': $('#add-new-file-form input[name="parent_dir"]').val(),
            'new_file_name': new_file
        },
        success: function(data) {
            if (data['success']) {
                location.reload(true);
            } else {
                apply_form_error('add-new-file-form', data['error']);
                enable(submit_btn);
            }
        },
        error: function(data, textStatus, jqXHR) {
            var errors = $.parseJSON(data.responseText);
            $.each(errors, function(index, value) {
                apply_form_error('add-new-file-form', value[0]);
            });
            enable(submit_btn);
        }
    });
    return false;
});

$('#add-new-dir-form').submit(function() {
    var new_dir = $(this).find('input[name="new_dir_name"]').val();
    if (!$.trim(new_dir)) {
        apply_form_error('add-new-dir-form', "{% trans "Directory name can't be empty" %}");
        return false;
    }

    var submit_btn = $(this).children('input[type="submit"]');  
    disable(submit_btn);
    $.ajax({
        url: '{% url 'views.repo_new_dir' %}',
        type: 'POST',
        dataType: 'json',
        beforeSend: prepareCSRFToken,
        data: {
            'repo_id': $('#add-new-dir-form input[name="repo_id"]').val(),
            'parent_dir': $('#add-new-dir-form input[name="parent_dir"]').val(),
            'new_dir_name': new_dir 
        },
        success: function(data) {
            if (data['success']) {
                location.reload(true);
            } else {
                apply_form_error('add-new-dir-form', data['error']);
                enable(submit_btn);
            }
        },
        error: function(data, textStatus, jqXHR) {
            var errors = $.parseJSON(data.responseText);
            $.each(errors, function(index, value) {
                apply_form_error('add-new-dir-form', value[0]);
            });
            enable(submit_btn);
        }
    });
    return false;
});

$('#mv-form .submit').click(function() {
    if (!$.trim($(this).prev().prev().val())) {//if the input is empty
        $(this).prev().removeClass('hide');//show error msg
        $('#simplemodal-container').css('height', $(this).parent().height());
        return false;
    }
});

$('#upload-file').click(function () {
    $('#upload-file-dialog').modal({focus:false});
    $('#file-upload-input').MultiFile({
        list: '#upload-file-list',
        STRING: {
            file: '<span title="{% trans "Click to remove" %}" onclick="$(this).parent().prev().click()">$file</span>',
            duplicate: '{% trans "This file has already been selected:\n$file!" %}'
        },
        afterFileAppend:function() {
            $('#upload-file-form .files-add input').css({'right':$('#upload-add-tip').width()});
        }
    });     // init MultiFile 
    $('#simplemodal-container').css({'height':'auto', 'width':'auto'});
    $('#upload-file-form .files-add').css({'width':$('#upload-file-form .files-add').width() + 1}); // '+ 1' for ie
    $('#file-upload-input').css({'right':$('#upload-add-tip').width()});
});

$('a.update-file').click(function() {
    // Get target file and set hidden input of update file form.
    var target_file = $(this).data("target");
    $('#update-file-form input[name="target_file"]').val(target_file);

    $('#update-file-dialog').modal({focus:false});
    $('#simplemodal-container').css({'width':'auto', 'height':'auto'});
    return false;
});

$('#add-new-dir').click(function () {
    $('#add-new-dir-form').modal({appendTo:'#main'});
});
  
$('#add-new-file').click(function () {
    $('#add-new-file-form').modal({appendTo:'#main', focus:false, containerCss:{'padding':'20px 25px'}});
});

$('#featured-filetype button').click(function() {
   var file_name = $('#add-new-file-form input[name="new_file_name"]');
   file_name.val('.' + $(this).attr('data')); 
   setCaretPos(file_name[0], 0); 
});

$('#upload-file, #add-new-dir, #add-new-file, #repo-download-btn, #recycle-btn').hover(
    function() {
        $(this).css({'background-color': '#fff', 'cursor': 'pointer'});
    },
    function() {
        $(this).css('background-color', '#f5f5f5');
    }
);

$('#repo-download-btn').click(function() {
        window.open('{{ SITE_ROOT }}seafile_access_check/?repo_id={{repo.props.id}}'); 
});

$('#recycle-btn').click(function() {
    location.href = $(this).attr('data');
});
$('.file-star').click(function() {
    var it = $(this);
    var state = it.data('status');
    var path = it.data('path');
    $.ajax({
        url: '{{ SITE_ROOT }}repo/star_file/{{ repo.props.id }}/',
        type: 'POST',
        cache: false,
        contentType: 'application/json; charset=utf-8',
        beforeSend: prepareCSRFToken,
        dataType: 'json',
        data: {
            path: path,
            state: state,
            org_id: {% if org %} {{ org.org_id }} {% else %} -1 {% endif %}
        },
        success:function(data) {
            if (data['success']) {
                if (state == 'starred') {
                    it.attr('src', '{{ MEDIA_URL }}img/gray-unstar-icon.png').attr('alt','{% trans 'Unstarred' %}').attr('title','{% trans 'Unstarred' %}').data('status','unstarred');
                } else {
                    it.attr('src', '{{ MEDIA_URL }}img/gray-star-icon.png').attr('alt','{% trans 'Starred' %}').attr('title','{% trans 'Starred' %}').data('status','starred');
                }
            } else {
                feedback('{% trans "Failed:" %}' + data['err_msg'], 'error');
            }
        },
        error:function(jqXHR, textStatus, errorThrown) {
            feedback(textStatus + '{% trans ", failed" %}', 'error');
        }
   });
});
{% include "snippets/list_commit_detail.html" %}
{% include "snippets/bottom_bar.html" %}
</script>
{% include 'snippets/file_upload_progress_js.html' %}
{% endblock %}