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

<!DOCTYPE html>
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<title>{% block sub_title %}{% endblock %}{{ site_title }}</title>
<meta http-equiv="Content-type" content="text/html; charset=utf-8" />
<meta name="keywords" content="{% trans "File Collaboration Team Organization" %}" />
<link rel="stylesheet" type="text/css" href="{{ MEDIA_URL }}css/ui-lightness/jquery-ui-1.8.16.custom.css" />
<link rel="stylesheet" type="text/css" href="{{ MEDIA_URL }}css/font-awesome.css" />
<link rel="stylesheet" type="text/css" href="{{ MEDIA_URL }}css/seahub.css?t=1388825460" />
<link rel="stylesheet" type="text/css" href="{{ MEDIA_URL }}css/select2.css?t=1388825460" />
<link rel="icon" type="image/x-icon" href="{{ MEDIA_URL }}img/favicon.png?t=1388825460" />
<!--[if IE]>
<link rel="shortcut icon" href="{{ MEDIA_URL }}img/favicon.png?t=1388825460"/>
<![endif]-->
{% block extra_style %}{% endblock %}
{% if branding_css != '' %}<link rel="stylesheet" type="text/css" href="{{ MEDIA_URL }}{{ branding_css }}" />{% endif %}
</head>

<body>
    <div id="wrapper" class="{{ LANGUAGE_CODE }}">
        {% block info_bar_message %}
        {% if request.user.is_authenticated and request.cur_note %}
        <div id="info-bar">
            <p id="info-bar-info">{{ request.cur_note.message|urlize|url_target_blank }}</p>
            <img src="{{ MEDIA_URL }}img/close-16.png" class="close" data="{{ request.cur_note.id }}" />
        </div>
        {% endif %}
        {% endblock info_bar_message %}

        <div id="top-bar">
            <div class="top-bar-inner">
                <div class="top-bar-con">
                    {% if request.user.is_staff %}
                    <div class="manage fleft">
                        {% block sys_admin %}<a href="{{ SITE_ROOT }}sys/useradmin/" class="top-link"><span class="icon-wrench"></span>{% trans "System Admin" %}</a>{% endblock %}
                    </div>
                    {% endif %}

                    <div class="account">
                        {% if request.user.is_authenticated %}
                        {% avatar request.user 16 %} <a href="#" data-url="{% url 'space_and_traffic' %}" class="top-link" id="my-info">{{ request.user }} <span class="icon-caret-down"></span></a>
                        <div id="user-info-popup" class="hide">
                            <img src="{{MEDIA_URL}}img/loading-icon.gif" alt="" class="loading-tip" />
                        </div>
                        <span class="spliter"></span>
                        <button class="btn" data-cturl="{% url 'unseen_notices_count' %}" data-pgurl="{% url 'user_notification_list' %}" id="msg-count" title="{% trans "unread notices" %}">0</button>
                        {% else %}
                        <a href="{{ SITE_ROOT }}accounts/login/" class="top-link">{% trans "Log In" %}</a>
                            {% if enable_signup %}
                        <a href="{{ SITE_ROOT }}accounts/register/" class="top-link">{% trans "Signup" %}</a>
                            {% endif %}
                        {% endif %}
                        <a href="#" id="lang-context" data-lang="{{ LANGUAGE_CODE }}" class="top-link">{{ LANGUAGE_CODE|language_name_local }} <span class="icon-caret-down"></span></a>
                        <ul class="hide" id="lang-context-selector">
                            {% for LANG in LANGUAGES %}
                            <li><a href="{% url 'i18n' %}?lang={{ LANG.0 }}">{{ LANG.1 }}</a></li>
                            {% endfor %}
                        </ul>
                        {% if request.user.is_authenticated %}
                        <a href="{{ SITE_ROOT }}accounts/logout/" class="icon-signout top-link" title="{% trans "Log out" %}" id="logout"></a>
                        {% endif %}
                    </div>
                </div>
            </div>
        </div>

        <div id="header">
            <div id="header-inner">
                {% block notice_panel %}{% endblock %}
                <a href="{{ SITE_ROOT }}" id="logo" class="fleft">
                    {% if seacloud_mode %}
                    <img src="{{ MEDIA_URL }}img/seacloud_logo.png" title="Seacloud" alt="logo" width="192" height="39" />
                    {% else %}
                    <img src="{{ MEDIA_URL }}{{ logo_path }}" title="Seafile" alt="logo" width="{{logo_width}}" height="{{logo_height}}" />
                    {% endif %}
                </a>
                {% block nav %}{% endblock %}

                {% if has_file_search and request.user.is_authenticated %}
                    {% include 'snippets/search_form.html' %}
                {% endif %}
            </div>
        </div>

        <div id="main" class="clear">
            <div id="title-panel" class="w100 ovhd">
                {% block title_panel %}{% endblock %}
            </div>
            <div id="left-panel">
                {% block left_panel %}{% endblock %}
            </div>
            <div id="right-panel">
                {% block right_panel %}{% endblock %}
            </div>
            <div id="main-panel" class="clear w100 ovhd">
                {% if messages %}
                {% autoescape off %}
                <ul class="messages hide">
                    {% for message in messages %}
                    <li class="{{ message.tags }}">{{ message }}</li>
                    {% endfor %}
                </ul>
                {% endautoescape %}
                {% endif %}

                {% block main_panel %} {% endblock %}
            </div>
            <div id="confirm-popup" class="hide">
                <div id="confirm-con"></div>
                <button id="confirm-yes" class="btn">{% trans "Yes"%}</button>
                <button class="simplemodal-close btn">{% trans "No"%}</button>
            </div>
        </div>

        <div id="footer" class="ovhd">           
            <div class="items fleft">
                {% include 'footer.html' %}
            </div>
            <div class="other-info fright">
                <p>{% trans "Server Version: " %}{{ seafile_version }}</p>
                <p>© 2013 {% trans "Seafile" %}</p>
                <p><a href="http://seafile.com/{% if LANGUAGE_CODE != 'zh-cn' %}en/{% endif %}contact/" target="_blank">{% trans "Contact Us" %}</a></p>
            </div>
        </div>
</div><!-- wrapper -->

<script type="text/javascript" src="{{ MEDIA_URL }}js/jq.min.js?t=1388825460"></script>
<script type="text/javascript" src="{{ MEDIA_URL }}jstree_pre1.0_stable/jquery.jstree.js"></script>
<script type="text/javascript" src="{{ MEDIA_URL }}js/base.js?t=1388825460"></script>
<script type="text/javascript" src="{{ MEDIA_URL }}js/select2.min.js?t=1388825460"></script>
<script type="text/javascript">
function ajaxErrorHandler(xhr, textStatus, errorThrown) {
    if (xhr.responseText) {
        feedback(jQuery.parseJSON(xhr.responseText).error, 'error');
    } else {
        feedback("{% trans "Failed. Please check the network." %}", 'error');
    }    
}
{% if request.user.is_authenticated %}
{% if request.cur_note %}
$('#info-bar .close').click(function() {
    $('#info-bar').addClass('hide');
    if (navigator.cookieEnabled) {
        var date = new Date(),
            cookies = document.cookie.split('; '),
            info_id_exist = false,
            new_info_id = $(this).attr('data') + '_';
        date.setTime(date.getTime() + 14*24*60*60*1000);
        new_info_id += '; expires=' + date.toGMTString() + '; path=' + '{{ SITE_ROOT }}';
        for (var i = 0, len = cookies.length; i < len; i++) {
            if (cookies[i].split('=')[0] == 'info_id') {
                info_id_exist = true;
                document.cookie = 'info_id=' + cookies[i].split('=')[1] + new_info_id;
                break;
            }
        }
        if (!info_id_exist) {
            document.cookie = 'info_id=' + new_info_id;
        }
    }
});
{% endif %}

{% if has_file_search %}
    {% include 'snippets/search_js.html' %}
{% endif %}

{% endif %}
</script>
{% block extra_script %}{% endblock %}
<script type="text/javascript">
//font icons: for browsers that don't support ':before'
    var sf_icons = [
        {'name':'share', 'con':'e001'},
        {'name':'removeformat', 'con':'f1e7'}
    ];
    var sf2_icons = [
        {'name':'archive', 'con':'e600'}
    ];
    var fa_icons = [ 
        {'name':'trash', 'con':'f014'},
        {'name':'cog', 'con':'f013'},
        {'name':'cloud-download', 'con':'f0ed'},
        {'name':'search', 'con':'f002'},
        {'name':'minus', 'con':'f068'},
        {'name':'plus', 'con':'f067'},
        {'name':'pencil', 'con':'f040'},
        {'name':'globe', 'con':'f0ac'},
        {'name':'comment-alt', 'con':'f0e5'},
        {'name':'double-angle-right', 'con':'f101'},
        {'name':'font', 'con':'f031'},
        {'name':'text-height', 'con':'f034'},
        {'name':'tint', 'con':'f043'},
        {'name':'bold', 'con':'f032'},
        {'name':'italic', 'con':'f033'},
        {'name':'strikethrough', 'con':'f0cc'},
        {'name':'underline', 'con':'f0cd'},
        {'name':'list-ul', 'con':'f0ca'},
        {'name':'list-ol', 'con':'f0cb'},
        {'name':'indent-left', 'con':'f03b'},
        {'name':'indent-right', 'con':'f03c'},
        {'name':'align-left', 'con':'f036'},
        {'name':'align-center', 'con':'f037'},
        {'name':'align-right', 'con':'f038'},
        {'name':'align-justify', 'con':'f039'},
        {'name':'link', 'con':'f0c1'},
        {'name':'cut', 'con':'f0c4'},
        {'name':'picture', 'con':'f03e'},
        {'name':'undo', 'con':'f0e2'},
        {'name':'repeat', 'con':'f01e'},
        {'name':'envelope', 'con':'f003'},
        {'name':'star', 'con':'f005'},
        {'name':'star-empty', 'con':'f006'},
        {'name':'caret-down', 'con':'f0d7'},
        {'name':'caret-up', 'con':'f0d8'},
        {'name':'caret-right', 'con':'f0da'},
        {'name':'ok', 'con':'f00c'},
        {'name':'double-angle-left', 'con':'f100'},
        {'name':'double-angle-right', 'con':'f101'},
        {'name':'double-angle-up', 'con':'f102'},
        {'name':'double-angle-down', 'con':'f103'},
        {'name':'zoom-in', 'con':'f00e'},
        {'name':'zoom-out', 'con':'f010'},
        {'name':'signout', 'con':'f08b'},
        {'name':'plus-sign-alt', 'con':'f0fe'},
        {'name':'upload', 'con':'f01b'},
        {'name':'ban-circle', 'con':'f05e'},
        {'name':'move', 'con':'f047'},
        {'name':'copy', 'con':'f0c5'},
        {'name':'th', 'con':'f00a'},
        {'name':'folder-close', 'con':'f07b'},
        {'name':'rss', 'con':'f09e'},
        {'name':'desktop', 'con':'f108'},
        {'name':'user', 'con':'f007'},
        {'name':'book', 'con':'f02d'},
        {'name':'comment', 'con':'f075'},
        {'name':'file', 'con':'f15b'},
        {'name':'wrench', 'con':'f0ad'},
        {'name':'group', 'con':'f0c0'},
        {'name':'lightbulb', 'con':'f0eb'},
        {'name':'upload-alt', 'con':'f093'},
        {'name':'download', 'con':'f01a'},
        {'name':'archive', 'con':'f187'}
    ];  
    function setCon(icon, icon_class_prefix, icon_list) {
            for (var i = 0, len = icon_list.length; i < len; i++) {
                if (icon.hasClass(icon_class_prefix + icon_list[i].name)) {
                    icon.html('&#x' + icon_list[i].con + ';');
                    break;
                }
            }
    }
    var pseudo_support = true;
    var pseudo_test = $('body').append('<span class="sf-icon-share pseudo-test" style="color:#fff;position:fixed;left:0;bottom:0;"></span>').children('.pseudo-test');
    if (pseudo_test.width() == 0) {
        pseudo_support = false;
        $('[class^="sf-icon-"]').each(function() {
            setCon($(this), 'sf-icon-', sf_icons);
        }); 
        $('[class^="sf2-icon-"]').each(function() {
            setCon($(this), 'sf2-icon-', sf2_icons);
        }); 
        $('[class^="icon-"], [class$=" icon-"]').each(function() {
            setCon($(this), 'icon-', fa_icons);
        }); 
    }
    pseudo_test.remove();
</script>
</body>
</html>
