{% extends base_template %}

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

{% block info_bar_message %}
{% if request.user.is_authenticated %}
  {{ block.super }}
{% else %}
  <div id="sharelink-infobar">
    <p>当前链接会在短期内失效，欢迎您 <a href="http://seafile.com/" target="_blank">加入Seafile </a>体验更多功能。</p>
  </div>
{% endif %}
{% endblock %}

{% block main_panel %}
{% if messages %}
{% autoescape off %}
<ul class="messages hide">
  {% for message in messages %}
  <li class="info">{{ message }}</li>
  {% endfor %}
</ul>
{% endautoescape %}
{% endif %}

  {% if view_history %}
    <h2>{{repo.props.name}} 历史浏览<span class="latest-commit-time-author">({{ current_commit.props.ctime|tsstr_sec }})</span></h2>
  {% else %}
    <h2>{{repo.props.name}}</h2>
  {% endif %}

  {% if view_history %}
    <div class="side fright">
      {% if can_access %}
      <div class="latest-commit">
        <h3>修改信息</h3>
        <p>{{ current_commit.props.desc|translate_commit_desc }}</p>
        <p class="al-rt">
          <span class="author">by
          {% if current_commit.props.creator_name %}
          {{ current_commit.props.creator_name|short_email }}
          {% else %}
          未知
          {% endif %}
          </span>
          <span class="time">{{ current_commit.props.ctime|translate_commit_time }}</span>
        </p>
      </div>
      {% endif %}

      <h3>操作</h3>
      <ul class="with-bg">
        <li><a href="{{ SITE_ROOT }}repo/history/{{ repo.id }}/">返回历史列表</a></li>
      </ul>
    </div>
  {% else %}
    <div class="side fright">
      <h3>基本信息</h3>
      <p>{{repo.props.desc}}</p>
      <p>大小：{{ repo_size|filesizeformat }}</p>
      
      {% if not repo.props.encrypted or password_set %}
          {% if can_access %}
          <div class="latest-commit">
            <h3>最新修改
            {% if request.user.is_authenticated %}
            <a href="{% url 'seahub.views.repo_history' repo.id %}" class="more">（更多）</a>
            {% endif %}
            </h3>
            <p>{{ current_commit.props.desc|translate_commit_desc }}</p>
            <p class="al-rt">
              <span class="author">by
              {% if current_commit.props.creator_name %}
              {{ current_commit.props.creator_name|short_email }}
              {% else %}
              未知
              {% endif %}
              </span>
              <span class="time">{{ current_commit.props.ctime|translate_commit_time }}</span>
            </p>
          </div>
          {% endif %}
      {% endif %}
    </div>
  {% endif %}
  
    <div class="main fleft">
      {% if repo.props.encrypted and not password_set %}
      <p class="access-notice">该目录已加密。如需在线查看里面的内容，请输入解密密码。密码只会在服务器上暂存1小时。</p>
      <form action="{{ SITE_ROOT }}repo/{{ repo.id }}/" method="post">
        <label>密码：</label>
        <input id="id_password" type="password" name="password" maxlength="64" /><br />
        {% if error %}
        <p class="error">{{ error }}</p>
        {% endif %}
        <input type="submit" value="提交" />
      </form>

      {% else %}
          {% if not can_access %}
          <p class="access-notice">无法在线查看该同步目录。</p>
          {% else %}
              <p class="path">
              当前路径：
              {% for name, link in zipped %}
              {% if not forloop.last %}
                {% if view_history %}
                <a href="{{ SITE_ROOT }}repo/{{ repo.id }}/?commit_id={{ current_commit.id }}&p={{ link|urlencode }}">{{ name }}</a> /                 
                {% else %}
                <a href="{{ SITE_ROOT }}repo/{{ repo.id }}/?p={{ link|urlencode }}">{{ name }}</a> /                
                {% endif %}
              {% else %}
              {{ name }}
              {% endif %}
              {% endfor %}
              </p>
              {% if not view_history and request.user.is_authenticated %}
              <div class="repo-op">
                  <button data="{{ SITE_ROOT }}repo/upload_file/{{repo.id}}/?p={{ path|urlencode }}" id="upload-file" class="op-btn">上传</button>
                  <button id="add-new-dir" class="op-btn">新建目录</button>
                  <button id="add-new-file" class="op-btn">新建文件</button>
              </div>
              {% endif %}

          <table>
            <tr>
              <th width="5%"></th>
              <th width="67%">名字</th>
              <th width="13%">大小</th>
              <th width="15%">操作</th>
            </tr>

            {% for dirent in dir_list %}
            <tr>
              <td class="icon-container"><img src="{{ MEDIA_URL }}img/folder-icon-24.png" alt="目录" /></td>
              {% if view_history %}
              <td><a href="{{ SITE_ROOT }}repo/{{ repo.id }}/?commit_id={{ current_commit.id }}&p={{ path|urlencode }}{{ dirent.obj_name|urlencode }}">{{ dirent.obj_name }}</a></td>              
              {% else %}
              <td>
                  <a href="{{ SITE_ROOT }}repo/{{ repo.id }}/?p={{ path|urlencode }}{{ dirent.obj_name|urlencode }}">{{ dirent.obj_name }}</a>
              </td>
              {% endif %}

              <td></td>
              <td>
                {% if not view_history and request.user.is_authenticated %}
                  <div>
                      <img src="{{ MEDIA_URL }}img/dropdown-arrow.png" alt="更多操作" class="more-op vh" data="no-popup" />
                      <ul class="op-list 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">删除</a></li>
                          <li><a class="op dir-rename" href="#" data="{{ dirent.obj_name }}">重命名</a></li>
                          <li><a class="op dir-mv" href="#" data="{{ dirent.obj_name }}">移动</a></li>
                          <li><a class="op dir-cp" href="#" data="{{ dirent.obj_name }}">复制</a></li>
                      </ul>
                  </div>
                {% endif %}
              </td>
            </tr>
            {% endfor %}

            {% for dirent in file_list %}
            <tr>
              <td class="icon-container"><img src="{{ MEDIA_URL }}img/file/{{ dirent.obj_name|file_icon_filter }}" alt="文件" /></td>
              {% if view_history %}
              <td><a class="op" href="{{ SITE_ROOT }}repo/{{ repo.props.id }}/files/?obj_id={{ dirent.props.obj_id }}&commit_id={{ current_commit.id }}&p={{ path|urlencode }}{{ dirent.obj_name|urlencode }}">{{ dirent.props.obj_name }}</a></td>              
              {% else %}
              <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>
              {% endif %}

              <td>{{ dirent.file_size|filesizeformat }}</td>
              <td>
                  <div>
                      <img src="{{ MEDIA_URL }}img/dropdown-arrow.png" alt="更多操作" class="more-op vh" data="no-popup" />
                      <ul class="op-list hide">
                          <li><a class="op" href="{{ SITE_ROOT }}repo/{{ repo.props.id }}/{{ dirent.props.obj_id }}/?file_name={{ dirent.props.obj_name }}&op=download">下载</a></li>
                          {% if not view_history and request.user.is_authenticated %}
                          <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">删除</a></li>
                          <li><a class="op file-rename" href="#" data="{{ dirent.obj_name }}">重命名</a></li>
                          <li><a class="op file-mv" href="#" data="{{ dirent.obj_name }}">移动</a></li>
                          <li><a class="op file-cp" href="#" data="{{ dirent.obj_name }}">复制</a></li>
                          <li><a class="op file-update" href="{{ SITE_ROOT }}repo/update_file/{{repo.id}}/?p={{ path|urlencode }}{{dirent.obj_name|urlencode}}">更新</a></li>
                          {% endif %}
                          {% if view_history and request.user.is_authenticated %}
                          <li><a href="{{ SITE_ROOT }}repo/revert_file/{{ repo.id }}/?commit={{ current_commit.id }}&p={{path|urlencode}}{{ dirent.obj_name|urlencode }}&from=repo_history" class="op file-revert">还原</a></li>
                          {% endif %}
                      </ul>
                  </div>
              </td>
            </tr>
            {% endfor %}
          </table>
          {% endif %}
      {% endif %}
    </div>

{% if not view_history %}
    <form id="add-new-dir-form" action="" method="post" class="hide">{% csrf_token %}
        <h4>新目录名称：</h4>
        <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="" /><br />
        <p class="error hide"></p>
        <input type="submit" value="提交" class="submit" />
        <button class="simplemodal-close">取消</button>
    </form>

    <form id="add-new-file-form" action="" method="post" class="hide">{% csrf_token %}
        <h4>新文件名称：</h4>
        <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="" /><br />
        <p class="error hide"></p>
        <input type="submit" value="提交" class="submit" />
        <button class="simplemodal-close">取消</button>
    </form>

    <form id="mv-form" action="{{ SITE_ROOT }}file/move/" method="post" class="hide">
        <h3 id="mv-hd"></h3>
        <div class="con">
            <h4><span class="tri-bg tri-down-bg"></span>当前同步目录：</h4>
            <div id="current-repo-dirs"></div>
            <h4><span class="tri-bg tri-right-bg"></span>其他同步目录：</h4>
            <div id="other-repos-dirs" class="hide"></div>
        </div>
        <input type="hidden" name="operation" id="operation" 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">请点击选择目标目录。</p>
        <input type="submit" value="提交" class="submit" />
        <button class="simplemodal-close">取消</button>
    </form>

    <form id="rename-form" action="{{ SITE_ROOT}}repo/file_rename/" method="post" class="hide">
        <p>将 <span id="rename-target" class="op-target"></span> 重命名为：</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="new-name" /><br />
        <p class="error hide"></p>
        <input type="submit" value="提交" class="submit" />
        <button class="simplemodal-close">取消</button>
    </form>
    {% with attach_type='dir' %}
    {% include "snippets/group_recommend_form.html" %}
    {% endwith %}
{% endif %}

{% endblock %}

{% block extra_script %}
{% if not view_history %}
<script type="text/javascript" src="{{ MEDIA_URL }}jstree_pre1.0_stable/jquery.jstree.js"></script>
{% endif %}
<script type="text/javascript">
$("table tr:gt(0)").hover(
    function() {
        $(this).find('.more-op').removeClass('vh');
    },
    function() {
        $(this).find('.more-op').addClass('vh');
    }
);

$('#main-panel').removeClass('ovhd');
var clicked_more_op;
$('.more-op').click(function(e) {
    var its_op_list = $(this).next();
    if ($(this).attr('data')) { // no popup
        clicked_more_op = $(this);
        $(this).parent().css('position','relative');
        if ($(this).offset().top + its_op_list.height() <= $('#main').offset().top + $('#main').height()) {
            its_op_list.css('top', 6);
        } else {
            its_op_list.css('bottom', 2);
        }
        $('.op-list').addClass('hide');
        its_op_list.removeClass('hide');
        $(this).attr('data','');
    } else {
        its_op_list.addClass('hide');
        $(this).attr('data','no-popup');
    }
});
$(document).click(function(e) {
    var target =  e.target || event.srcElement;
    if (clicked_more_op && target != clicked_more_op[0]) {
       clicked_more_op.next().addClass('hide');
       clicked_more_op.attr('data','no-popup');
    }
});
$('.op-list li').hover(
    function() {
        $(this).css('background', '#eee');
    },
    function() {
        $(this).css('background', '#fff');
    }
);

{% if not view_history %}
$('.file-rename, .dir-rename').click(function () {
    var type = $(this).hasClass('file-rename') ? '文件 ' : '目录 ',
        name = $(this).attr('data');
    $('#rename-target').html(type + name);
    $('input[name="oldname"]').val(name);
    $('input[name="newname"]').val(name);
    $('#rename-form').modal({appendTo:'#main'});
    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')) {
        $('#operation').val('cp');
        mv_type = '复制';
    } else {
        $('#operation').val('mv');
        mv_type = '移动';
    }

    if ($(this).hasClass('file-cp') || $(this).hasClass('file-mv')) {
        file_type = '文件';
        $('input[name="obj_type"]').val('file');
    } else {
        file_type = '目录';
        $('input[name="obj_type"]').val('dir');
    }

    $('input[name="obj_name"]').val(obj_name);
    $('#mv-hd').html('将' + file_type + ' <span class="op-target">' + obj_name + '</span> ' + mv_type + '到：');
    $('#mv-form').modal({appendTo:'#main', autoResize:true});
    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-form h4').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').click(function() {
    $.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': $('#rename-form input[name="newname"]').val()
        },
        success: function(data) {
            if (data['success']) {
                location.reload(true);
            } else {
                apply_form_error('rename-form', data['error']);
            }
        },
        error: function(data, textStatus, jqXHR) {
            var errors = $.parseJSON(data.responseText);
            $.each(errors, function(index, value) {
                apply_form_error('rename-form', value[0]);
            });
        }
    });
    return false;
});

$('#add-new-file-form .submit').click(function() {
    $.ajax({
        url: '{% url 'views.repo_new_file' %}',
        type: 'POST',
        dataType: 'json',
        cache: 'false',
        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': $('#add-new-file-form input[name="new_file_name"]').val()
        },
        success: function(data) {
            if (data['success']) {
                location.reload(true);
            } else {
                apply_form_error('add-new-file-form', data['error']);
            }
        },
        error: function(data, textStatus, jqXHR) {
            var errors = $.parseJSON(data.responseText);
            $.each(errors, function(index, value) {
                apply_form_error('add-new-file-form', value[0]);
            });
        }
    });
    return false;
});

$('#add-new-dir-form .submit').click(function() {
    $.ajax({
        url: '{% url 'views.repo_new_dir' %}',
        type: 'POST',
        dataType: 'json',
        cache: 'false',
        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': $('#add-new-dir-form input[name="new_dir_name"]').val()
        },
        success: function(data) {
            if (data['success']) {
                location.reload(true);
            } else {
                apply_form_error('add-new-dir-form', data['error']);
            }
        },
        error: function(data, textStatus, jqXHR) {
            var errors = $.parseJSON(data.responseText);
            $.each(errors, function(index, value) {
                apply_form_error('add-new-dir-form', value[0]);
            });
        }
    });
    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 () {
    location.href = $(this).attr('data');
});

$('#add-new-dir').click(function () {
    $('#add-new-dir-form').modal({appendTo:'#main'});
});
  
$('#add-new-file').click(function () {
    $('#add-new-file-form').modal({appendTo:'#main'});
});

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

{% include "snippets/bottom_bar.html" %}
{% endif %}
</script>
{% endblock %}