{% load staticfiles %}
{% load app_tags %}
{% load cache %}

{% load sekizai_tags %}
{% load hijack_tags %}

<!DOCTYPE html>
<html>
<head>
    {% render_block "css" %}

    <title>{% block title %}Code for Life{% endblock %}</title>
    <meta name="msapplication-config" content="none"/>
    <meta name="viewport" content="width=device-width, initial-scale=1"/>

    {% block head %}
    {% endblock head %}

    {% block css %}
    <link href="{% static 'portal/css/common.css' %}" rel="stylesheet">
    {% cache 3600 fragment-base-css-old %}
    <link href="{% static 'portal/css/jquery-ui.css' %}" rel="stylesheet">
    <link href="{% static 'portal/css/jquery-ui.structure.css' %}" rel="stylesheet">
    <link href="{% static 'portal/css/jquery-ui.theme.css' %}" rel="stylesheet">
    <link rel="stylesheet" type="text/css" href="{% static 'portal/css/styles.css' %}">
    <link rel="stylesheet" type="text/css" href="{% static 'portal/css/list.css' %}">
    <link rel="stylesheet" type="text/css" href="{% static 'portal/css/tables.css' %}">
    <link rel="stylesheet" type="text/css" href="{% static 'base.css' %}">
    <link href="https://fonts.googleapis.com/css?family=Baloo" rel="stylesheet">
    <link href="https://fonts.googleapis.com/css?family=Source+Sans+Pro" rel="stylesheet">
    <link rel="shortcut icon" href="{% static 'portal/img/favicon.ico' %}" type="image/x-icon">
    <link rel="icon" href="{% static 'portal/img/favicon.ico' %}" type="image/x-icon">
    <link rel="stylesheet" type="text/css" href="{% static 'hijack/hijack-styles.css' %}" />
    {% endcache %}
    {% endblock css %}

    {% include "portal/tag_manager/tag_manager_head.html" %}

    {% cache 3600 fragment-base_old-javascript %}
    <script type="text/javascript" src="{% static 'portal/js/lib/jquery.js' %}"></script>
    <script type="text/javascript" src="{% static 'portal/js/lib/jquery-ui.js' %}"></script>
    <script type="text/javascript" src="{% static 'portal/js/bootstrap.js' %}"></script>
    <script type="text/javascript" src="{% static 'portal/js/lib/modernizr.custom.79639.js' %}"></script>
    <script type="text/javascript" src="{% static 'portal/js/common.js' %}"></script>
    <script type="text/javascript" src="{% static 'portal/js/deleteWorkspaces.js' %}"></script>
    {% endcache %}
    <script type="text/javascript" src="{% static 'portal/js/jquery.placeholder.js' %}"></script>
    <script type="text/javascript" src="{% static 'portal/js/lib/jquery.colorbox.js' %}"></script>
    <script type="text/javascript" src="{% static 'portal/js/sticky_subnav.js' %}"></script>
    {% block check_user_status %}
    <script>
        // Set to 'TEACHER', 'SCHOOL_STUDENT', 'INDEPENDENT_STUDENT', or 'UNTRACKED'
        USER_STATUS = '{{ user|get_user_status }}';
        DEVELOPER = '{{ user|is_developer }}' === 'True';
        BETA = '{{ request|has_beta_access }}' === 'True';
    </script>
    {% endblock check_user_status %}

    <script src="https://www.google.com/recaptcha/api.js" async defer></script>

    {% block google_analytics %}
    <script>
        (function(i,s,o,g,r,a,m){i['GoogleAnalyticsObject']=r;i[r]=i[r]||function(){
                    (i[r].q=i[r].q||[]).push(arguments)},i[r].l=1*new Date();a=s.createElement(o),
                m=s.getElementsByTagName(o)[0];a.async=1;a.src=g;m.parentNode.insertBefore(a,m)
        })(window,document,'script','//www.google-analytics.com/analytics.js','ga');


        ga('create', 'UA-49883146-1', 'auto');
        ga('send', 'pageview');

        function send_event(name_of_file, action){
            ga('send', {
                hitType: 'event',
                eventCategory: 'PDFs',
                eventAction: action,
                eventLabel: name_of_file
            });
        }
    </script>

    <script src="/static/portal/js/riveted.min.js"></script>
    <script>riveted.init();</script>
    {% endblock google_analytics %}
</head>

<body id="top">
{% include "portal/tag_manager/tag_manager_body.html" %}
{% hijack_notification %}
{% render_block "js" %}
{% include 'portal/mouseflow.html' %}

{% block contentWrapper %}
<div {% block pageID %}id="contentWrapper"{% endblock %}>
    {% block topBar %}
    <div class="header">
        <a class="hidden-xs" href="{% url 'home' %}">
            <img class="logo col-sm-offset-1" src="{% static 'portal/img/logo_c4l_hexa.png' %}">
        </a>
        <div class="menu">
            <div class="menu__brand">
                <a class="visible-xs" href="{% url 'home' %}">
                    <img class="logo" src="{% static 'portal/img/logo_c4l_hexa.png' %}">
                </a>
                <a target="_blank" href="https://www.ocadogroup.com/technology/technology-pioneers">
                    <img title="Proudly developed by Ocado Technology" alt="Proudly developed by Ocado Technology"
                    class="hidden-xs" src="{% static 'portal/img/logo_ocado_tech_tagline.svg' %}">
                    <img title="Proudly developed by Ocado Technology" alt="Proudly developed by Ocado Technology"
                    class="header__ot-logo--no-tagline visible-xs" src="{% static 'portal/img/logo_ocado_tech_no_tagline.svg' %}">
                </a>
                <span class="glyphicon glyphicon-menu-hamburger header__hamburger visible-xs"
                      data-toggle="collapse" data-target="#menu-items"></span>
            </div>
            {% block leftMenuButtons %}
                {% if user|is_logged_in %}
                <div class="menu__left-side col-sm-7">
                    {% if user|is_logged_in_as_teacher %}
                        <a href="{% url 'teach' %}" class="button--menu button--menu--primary"><b>Teacher</b></a>
                        {% block secondaryButtons %}
                        {% if user|has_teacher_finished_onboarding %}
                            {% block dashboard %}<a href="{% url 'dashboard' %}" class="button--menu button--menu--secondary button--menu--enabled">School / Club</a>{% endblock dashboard %}
                            {% block rapidrouter %}<a href="{% url 'levels' %}" class="button--menu button--menu--secondary button--menu--enabled">Rapid Router</a>{% endblock rapidrouter %}
                            {% block aimmo %}
                                <a href="{% url 'play_aimmo' %}" id="aimmo_home_button" class="button--menu button--menu--secondary button--menu--enabled">Kurono</a>
                            {% endblock aimmo %}
                            {% block materials %}<a id="resources_button" href="{% url 'teaching_resources' %}" class="button--menu button--menu--secondary button--menu--enabled">Teaching Resources</a>{% endblock materials %}
                        {% else %}
                            <a href="{% url 'onboarding-organisation' %}" class="button--menu button--menu--secondary button--menu--enabled">School / Club</a>
                            <a class="button--menu button--menu--secondary button--menu--disabled">Rapid Router</a>
                            <a class="button--menu button--menu--secondary button--menu--disabled">Kurono</a>
                            <a class="button--menu button--menu--secondary button--menu--disabled">Teaching Resources</a>
                        {% endif %}
                        {% endblock secondaryButtons %}
                    {% else %}
                        <a href="{% url 'play' %}" class="button--menu button--menu--primary"><b>Student</b></a>
                        {% block studentButtons %}
                        <div class="dropdown">
                            {% block myGames %}<a href="{% url 'student_details' %}" id="student_dashboard_button"
                               class="button--menu button--menu--secondary button--menu--enabled">My Games</a>{% endblock myGames %}
                            <div class="dropdown-content">
                                <a href="{% url 'levels' %}"><small>Rapid Router</small></a>
                                {% if not user|is_independent_student %}
                                    <a href="{% url 'play_aimmo' %}"><small>Kurono</small></a>
                                {% endif %}
                            </div>
                        </div>
                        {% if user|is_logged_in_as_school_user %}
                        <div class="dropdown">
                            <a href="{% url 'scoreboard' %}" id="student_scoreboards_button"
                               class="button--menu button--menu--secondary button--menu--enabled">View Scoreboards</a>
                            <div class="dropdown-content">
                                <a href="{% url 'scoreboard' %}"><small>Rapid Router</small></a>
                            </div>
                        </div>
                        {% endif %}
                        {% if not user.new_student.class_field %}
                            <a href="{% url 'student_join_organisation' %}" id="student_join_school_button"
                               class="button--menu button--menu--secondary button--menu--enabled">Join a school</a>
                        {% endif %}
                        {% endblock studentButtons %}
                    {% endif %}
                {% else %}
                    <div class="menu__left-side col-sm-5">
                        {% block nav_teach %}<a href="{% url 'teach' %}" class="button--menu button--menu--primary button--menu--enabled">Teachers</a>{% endblock nav_teach %}
                        {% block nav_play %}<a href="{% url 'play' %}" class="button--menu button--menu--primary  button--menu--enabled">Students</a>{% endblock nav_play %}
                {% endif %}
                </div>
            {% endblock leftMenuButtons %}
            {% block rightMenuButtons %}
                {% if user|is_logged_in %}
                <div class="menu__right-side col-sm-4">
                    <div class="dropdown header__account-details-dropdown">
                        <button id="logout_menu" class="button--regular button--secondary button--dropdown header__account-details-dropdown"
                                data-toggle="dropdown">
                            <div class="dropdown__text">{{ user|make_into_username }}</div>
                        </button>
                        <ul class="dropdown-menu header__account-details-dropdown-menu">
                            {% if not request|is_hijacked %}
                            <li class="dropdown-menu__option">
                                <a class="button--regular button--primary--navigation" id="logout_button" aria-labelledby="Log out"
                                   href="{% url 'logout_view' %}" onclick="deleteAllLocalStorageWorkspaces();">
                                    <small class="dropdown-menu__option__text">Log out</small>
                                    <div class="glyphicon glyphicon-log-out"></div></a>
                            </li>
                            {% endif %}
                            {% if user|is_logged_in_as_teacher %}
                                <li class="dropdown-menu__option">
                                    <a class="button--regular button--primary--navigation" aria-labelledby="Change password"
                                       href="{% url 'dashboard' %}#edit_account_details_password">
                                        <small class="dropdown-menu__option__text">Change password</small>
                                        <div class="glyphicon glyphicon-lock"></div></a>
                                </li>
                                <li class="dropdown-menu__option">
                                    <a class="button--regular button--primary--navigation" aria-labelledby="Update my details"
                                       href="{% url 'dashboard' %}#account">
                                        <small class="dropdown-menu__option__text">Update my details</small>
                                        <div class="glyphicon glyphicon-user"></div></a>
                                </li>
                            {% else %}
                                <li class="dropdown-menu__option">
                                    <a class="button--regular button--primary--navigation" aria-labelledby="Change password"
                                       href="{% url 'student_edit_account' %}" id="student_edit_account_button">
                                        <small class="dropdown-menu__option__text">Change password</small>
                                        <div class="glyphicon glyphicon-lock"></div></a>
                                </li>
                            {% endif %}
                        </ul>
                    </div>
                    {% else %}
                    <div class="menu__right-side col-sm-5">
                        <a href="{% url 'register' %}" id="signup_button" class="button button--regular button--primary--general-play register">Register now</a>
                        <div class="dropdown">
                            <button id="login_dropdown" class="button--regular button--secondary login button--dropdown"
                                    data-toggle="dropdown">
                                <div class="dropdown__text">Log in</div>
                            </button>
                            <ul class="dropdown-menu header__login-options-dropdown-menu">
                                <li class="dropdown-menu__option">
                                    <a id="teacher_login_button" class="button--regular button--primary--general-play" aria-labelledby="Teacher" href="{% url 'teacher_login' %}">
                                        <small class="dropdown-menu__option__text">Teacher</small></a>
                                </li>
                                <li class="dropdown-menu__option">
                                    <a class="button--regular button--primary--general-educate" aria-labelledby="Student" href="{% url 'student_login' %}">
                                        <small class="dropdown-menu__option__text">Student</small></a>
                                </li>
                                <li class="dropdown-menu__option">
                                    <a class="button--regular button--primary--negative" aria-labelledby="Independent" href="{% url 'independent_student_login' %}">
                                        <small class="dropdown-menu__option__text">Independent</small></a>
                                </li>
                            </ul>
                        </div>
                    {% endif %}
                </div>
            {% endblock rightMenuButtons %}
        </div>
        <div id="menu-items" class="collapse">
            {% if user|is_logged_in %}
                <div class="menu__item">
                    <h1>{{ user|make_into_username }}</h1>
                </div>
                {% if user|is_logged_in_as_teacher %}
                    <button class="button--menu__item button--menu__item--sub-header"
                            data-toggle="collapse" data-target="#teacher-tabs">Teacher</button>
                    <div id="teacher-tabs" class="collapse">
                        <a class="button button--menu__item button--menu__item--teacher button--menu__item__sub"
                           href="{% url 'dashboard' %}">School / Club<div class="glyphicon glyphicon-chevron-right"></div></a>
                        <a class="button button--menu__item button--menu__item--teacher button--menu__item__sub"
                           href="{% url 'levels' %}">Rapid Router<div class="glyphicon glyphicon-chevron-right"></div></a>
                        <a class="button button--menu__item button--menu__item--teacher button--menu__item__sub"
                           href="{% url 'teaching_resources' %}">Teaching Resources<div class="glyphicon glyphicon-chevron-right"></div></a>
                    </div>
                {% else %}
                    <button class="button--menu__item button--menu__item--sub-header"
                            data-toggle="collapse" data-target="#student-tabs">Student</button>
                    <div id="student-tabs" class="collapse">
                        <button class="button--menu__item button--menu__item--student button--menu__item--sub-header"
                                data-toggle="collapse" data-target="#games-tabs">My Games</button>
                        <div id="games-tabs" class="collapse">
                            <a class="button button--menu__item button--menu__item--student button--menu__item__sub"
                               href="{% url 'levels' %}">Rapid Router<div class="glyphicon glyphicon-chevron-right"></div></a>
                            {% if not user|is_independent_student %}
                                <a class="button button--menu__item button--menu__item--student button--menu__item__sub"
                                   href="{% url 'play_aimmo' %}">Kurono<div class="glyphicon glyphicon-chevron-right"></div></a>
                            {% endif %}
                        </div>
                        <button class="button--menu__item button--menu__item--student button--menu__item--sub-header"
                                data-toggle="collapse" data-target="#scoreboards-tabs">View Scoreboards</button>
                        <div id="scoreboards-tabs" class="collapse">
                            <a class="button button--menu__item button--menu__item--student button--menu__item__sub"
                               href="{% url 'scoreboard' %}">Rapid Router<div class="glyphicon glyphicon-chevron-right"></div></a>
                        </div>
                    {% if not user.new_student.class_field %}
                        <a class="button button--menu__item button--menu__item--student"
                           href="{% url 'student_join_organisation' %}">Join a school<div class="glyphicon glyphicon-chevron-right"></div></a>
                    {% endif %}
                    </div>
                {% endif %}
            {% else %}
                <a class="button button--menu__item button--menu__item--teacher"
                   href="{% url 'register' %}">Register now<div class="glyphicon glyphicon-chevron-right"></div></a>
                <button class="button--menu__item button--menu__item--navigation button--menu__item--sub-header"
                        data-toggle="collapse" data-target="#login-tabs">Log in</button>
                <div id="login-tabs" class="collapse">
                    <a class="button button--menu__item button--menu__item--teacher button--menu__item__sub"
                       href="{% url 'teacher_login' %}">Teacher<div class="glyphicon glyphicon-chevron-right"></div></a>
                    <a class="button button--menu__item button--menu__item--student button--menu__item__sub"
                       href="{% url 'student_login' %}">Student<div class="glyphicon glyphicon-chevron-right"></div></a>
                    <a class="button button--menu__item button--menu__item--independent button--menu__item__sub"
                       href="{% url 'independent_student_login' %}">Independent<div class="glyphicon glyphicon-chevron-right"></div></a>
                </div>
                <a class="button button--menu__item" href="{% url 'teach' %}">Teacher
                    <div class="glyphicon glyphicon-chevron-right"></div></a>
                <a class="button button--menu__item" href="{% url 'play' %}">Student
                    <div class="glyphicon glyphicon-chevron-right"></div></a>
            {% endif %}
            <a class="button button--menu__item" href="{% url 'about' %}">About
                <div class="glyphicon glyphicon-chevron-right"></div></a>
            <a class="button button--menu__item" href="{% url 'help' %}">Help and support
                <div class="glyphicon glyphicon-chevron-right"></div></a>
            <a class="button button--menu__item" href="{% url 'terms' %}">Terms of use
                <div class="glyphicon glyphicon-chevron-right"></div></a>
            <a class="button button--menu__item" href="{% url 'privacy_policy' %}">Privacy policy
                <div class="glyphicon glyphicon-chevron-right"></div></a>
            {% if user|is_logged_in %}
                {% if user|is_logged_in_as_teacher %}
                    <a class="button button--menu__item" href="{% url 'dashboard' %}#account">Change password
                        <div class="glyphicon glyphicon-chevron-right"></div></a>
                    <a class="button button--menu__item" href="{% url 'dashboard' %}#password">Update my details
                        <div class="glyphicon glyphicon-chevron-right"></div></a>
                {% endif %}
                <a class="button button--menu__item" href="{% url 'logout_view' %}">Logout
                    <div class="glyphicon glyphicon-chevron-right"></div></a>
            {% endif %}
        </div>
    </div>
</div>
{% endblock topBar %}
    {% block subNav %}
    {% endblock subNav %}
    <div id="messages">
        {% if messages %}
        <div class="sub-nav--message">
            {% for message in messages %}
            <div class="sub-nav {{ message.tags }}">
                <img title="Information" alt="Information sign" src="{% static 'portal/img/icon_info.png' %}">
                <p>
                    {% if 'safe' in message.tags %}{{ message|safe }}{% else %}{{ message }}{% endif %}</p>
                <a class="x-icon"><img title="Close" alt="Close sign" src="{% static 'portal/img/icon_close.png' %}"></a>
            </div>
            {% endfor %}
        </div>
        {% endif %}
    </div>

    <!--[if lt IE 10]>
    <ul class="messages">
        <li class="error">You appear to be using an old version of Internet Explorer. You will be unable to play Rapid Router, unless you upgrade to Internet Explorer 10, or consider using another browser. See <a href="{% url 'help' %}">Help and Support</a> for more details.</li>
    </ul>
    <![endif]-->

    {% block contentDiv %}
    <div class="content">

        {% block content %}
        {% block base_new_content %}{% endblock %}
        {% endblock content %}

    </div>
    {% endblock contentDiv %}

    <div class="push"></div>
</div>
{% endblock contentWrapper %}

{% block footer %}
{% cache 3600 fragment-base_old-footer %}
<div class="footer">
    <a id="back_to_top_button" class="back-to-top" href="#top"><img class="no-padding" src="{% static 'portal/img/footer_arrow.png' %}"></a>
    <p><a href="#top"><small>BACK TO TOP</small></a></p>
    <img class="col-sm-3" src="{% static 'portal/img/logo_c4l_horizontal.png' %}">
    <div class="row">
        <p><a href="{% url 'about' %}">About us</a></p>
        <p><a href="{% url 'teach' %}">Teachers</a></p>
        <p><a href="{% url 'play' %}">Students</a></p>
        <p><a id="help_and_support_button" href="{% url 'help' %}">Help and support</a></p>
        <p><a class="freshdesk__contact-us">Contact us</a></p>
        <p><a href="{% url 'terms' %}">Terms of use</a></p>
        <p><a href="{% url 'privacy_policy' %}">Privacy policy</a></p>
    </div>
    <div class="row social-media"><br>
        <a target="_blank" href="https://twitter.com/codeforlifeuk"><img src="{% static 'portal/img/twitter.png' %}"></a>
        <a target="_blank" href="https://www.facebook.com/codeforlifeuk/"><img src="{% static 'portal/img/facebook.png' %}"></a>
    </div>
    <a target="_blank" href="https://www.ocadogroup.com/technology/technology-pioneers"><img src="{% static "portal/img/logo_ocado.png" %}"></a>
    <p><small>&copy; Ocado Technology 2019</small></p>
</div>
{% endcache %}
{% endblock footer %}

<div id="confirmation-dialog" title=""></div>

{% block scripts %}
<script>
    $(function() {
        $('input, textarea').placeholder();
    });

    function animateScroll() {
        $('a[href*=#]').click(function() {
            if (location.pathname.replace(/^\//,'') == this.pathname.replace(/^\//,'') && location.hostname == this.hostname) {
                history.pushState({}, "", this.href);
                var $target = getTarget(this);
                if ($target.length) {
                    animate($target.offset().top - 50);
                    return false;
                }
            }
        });
    }

    function getTarget(clickTarget) {
        var $target = $(clickTarget.hash);
        $target = $target.length && $target || $('[name=' + clickTarget.hash.slice(1) +']');
        return $target;
    }

    function animate(targetOffset) {
        $('html,body').animate({scrollTop: targetOffset}, 1000);
    }

    function invokeColorbox() {
        $(".youtube").colorbox({
            iframe:true,
            innerWidth:640,
            innerHeight:390,
            transition: 'fade',
            closeButton: false
        });
    }

    $(document).ready(function() {
        animateScroll();
    })
</script>
<script>
    window.fwSettings={
        'widget_id':77000000397
    };
    !function(){if("function"!=typeof window.FreshworksWidget){var n=function(){n.q.push(arguments)};n.q=[],window.FreshworksWidget=n}}()
</script>
<script type='text/javascript' src='https://euc-widget.freshworks.com/widgets/77000000397.js' async defer></script>
<script>
    FreshworksWidget('hide');
    $('.freshdesk__contact-us').click(function() {
        FreshworksWidget('open');
    });
</script>
{% endblock scripts %}

</body>
</html>
