{% extends 'portal/base.html' %}
{% load staticfiles %}
{% load app_tags %}
{% load banner_tags %}
{% load table_tags %}
{% load cache %}

{% block materials %}
<a href="{% url 'teaching_resources' %}" class="button--menu button--menu--secondary button--menu--enabled button--menu--teacher--active">Teaching Resources</a>
{% endblock materials %}

{% block css %}
{{ block.super }}
{% endblock css %}

{% block scripts %}
{{ block.super }}
{% endblock scripts %}

{% block pageID %}id="homeWrapper"{% endblock %}

{% block subNav %}
{{ block.super }}
{% banner banner_name="BANNER" %}
<div class="sticky-subnav sub-nav sub-nav--teacher">
    <a href="#user_guide" class="button button--regular button--secondary button--secondary--light">User guide</a>
    <a href="#ks1" class="button button--regular button--secondary button--secondary--light">Key Stage 1</a>
    <a href="#ks2" class="button button--regular button--secondary button--secondary--light">Key Stage 2</a>
    <a href="#ks3" class="button button--regular button--secondary button--secondary--light">Key Stage 3</a>
</div>
{% endblock subNav %}

{% block content %}
{{ block.super }}

{% cache 3600 fragment-materials-page %}
<div id="materials_page"></div>

<div id="user_guide">
    <div class="background background--primary">
        <div class="col-sm-6 col-center">
            <section>
                <h2>User Guide</h2>
            </section>
            <div class="row">
                <div class="col-sm-6">
                    <h4>Key Stage 1, and Key Stage 2</h4>
                    <p><a href="{% url 'materials_viewer' pdf_name='introduction_to_coding' %}" onclick='send_event("introduction_to_coding.pdf","Downloaded");'>Introduction to Coding Guide</a></p>
                    <p><a href="{% url 'materials_viewer' pdf_name='levels_guide_1-28' %}" onclick='send_event("levels_guide_1-28.pdf","Downloaded");'>Levels Guide (1–28)</a></p>
                    <p><a href="{% url 'materials_viewer' pdf_name='glossary' %}" onclick='send_event("glossary.pdf","Downloaded");'>Glossary</a></p>
                </div>
                <div class="col-sm-6">
                    <h4>Key Stage 3</h4>
                    <p><a href="{% url 'materials_viewer' pdf_name='introduction_to_python' %}" onclick='send_event("introduction_to_python.pdf","Downloaded");'>Introduction to Python in Rapid Router</a></p>
                    <p><a href="{% url 'materials_viewer' pdf_name='levels_guide_29-109' %}" onclick='send_event("levels_guide_29-109.pdf","Downloaded");'>Levels Guide (29–109)</a></p>
                    <p><a href="{% url 'materials_viewer' pdf_name='blockly_python_phrasebook' %}" onclick='send_event("blockly_python_phrasebook.pdf","Downloaded");'>Blockly - Python Phrasebook</a></p>
                </div>
            </div>
        </div>
    </div>
</div>

<div id="ks1">
    <div class="background col-sm-8 col-center">
        <section>
            <h2>Key Stage 1</h2>
            <img title="KS1" alt="KS1 icon" src="{% static 'portal/img/stage_icon_ks1.svg' %}">
            <h4>Students will learn the basics of coding by programming a delivery van to drive around simple routes.</h4>
            <a href="{{ 'KS1_v1.zip'|cloud_storage }}" onclick='send_event("KS1_v1.zip","Downloaded");' class="button button--regular button--primary--positive">Download all KS1 resources</a>
            <img title="ZIP" alt="ZIP icon" src="{% static 'portal/img/icon_zip.png' %}">
        </section>
        <h3>Sessions <span class="ks-tag">KS1</span></h3>
        <p>Complete lesson plans for each session, including learning objectives, a list of useful resources, pupil activities, and guidance on share and
            review following the session.</p>
        <div class="grid-sessions">
            {% for ks1_session in ks1_sessions %}
                <p><strong>Session {{ ks1_session.session_number }}</strong></p>
                <p><a href="{% url 'materials_viewer' pdf_name=ks1_session.url_name %}" onclick='send_event("ks1_session.pdf","Downloaded");'>
                        {{ ks1_session.description }}</a></p>
                <p><i>{{ ks1_session.levels_covered }}</i></p>
                <div>
                    {% if ks1_session.video %}
                        <img class="grid-icon" title="Video" alt="Video icon" src="{% static 'portal/img/icon_video.png' %}">
                    {% endif %}
                </div>
                <div><img class="grid-icon" title="PDF" alt="PDF icon" src="{% static 'portal/img/icon_pdf.png' %}"></div>
            {% endfor %}
        </div>
        <h3>Resource Sheets <span class="ks-tag">KS1</span></h3>
        <p>Resource sheets help you teach coding concepts offline in the classroom.
            You can <a href="{{ 'KS1_v1/resource_sheets.zip'|cloud_storage }}" onclick='send_event("KS1_v1/resource_sheets.zip","Downloaded");'>download the whole set</a> (zip file), or view and download
            them individually below.</p>
        <div class="grid-resources grid-resources--ks1">
            {% resource_sheets_table ks1_sheets %}
        </div>
    </div>

    <div class="background background--quaternary">
        <div class="col-sm-8 col-center">
            <div class="row row--under">
                <div class="col-sm-6">
                    <h3>Program Solutions <span class="ks-tag">KS1</span></h3>
                    <p>This sheet gives you the confidence and the understanding needed to teach the lessons and the solutions to each level.</p>
                    <p><a href="{% url 'materials_viewer' pdf_name='program_solutions_1-16' %}" onclick='send_event("program_solutions_1-16.pdf","Downloaded");'>View program solutions</a></p>
                </div>
                <div class="col-sm-6">
                    <h3>Activity Set <span class="ks-tag">KS1</span></h3>
                    <p>This activity set gives you an overview of the Key Stage 1 module. It covers the resources that will be useful, learning
                        expectations and teacher preparation.</p>
                    <p><a href="{% url 'materials_viewer' pdf_name='KS1_activity_set' %}" onclick='send_event("ks1_activity_set.pdf","Downloaded");'>View activity set</a></p>
                </div>
            </div>
            <div class="row row--under">
                <div class="col-sm-6">
                    <h3>Assets <span class="ks-tag">KS1</span></h3>
                    <p>Printable sheets with all the game assets from direction arrows to scenery for offline activity activities.</p>
                    <p><a href="{% url 'materials_viewer' pdf_name='KS1_assets' %}" onclick='send_event("KS1_assets.pdf","Downloaded");'>Assets</a></p>
                    <p><a href="{% url 'materials_viewer' pdf_name='KS1_code_wall_cards' %}" onclick='send_event("KS1_code_wall_cards.pdf","Downloaded");'>Code wall cards</a></p>
                </div>
                <div class="col-sm-6">
                    <h3>Assessments <span class="ks-tag">KS1</span></h3>
                    <p>Assessment guidance sheets for teachers explain techniques and key questions, pupil-led self-assessment sheets, along with
                        a record sheet for pupils. You can <a href="{{ 'KS1_v1/assessment.zip'|cloud_storage }}" onclick='send_event("KS1_v1/assessment.zip","Downloaded");'> download the
                        whole set</a> (zip file), or view and download them individually below.</p>
                    <p><a href="{% url 'materials_viewer' pdf_name='KS1_assessment_guide' %}" onclick='send_event("ks1_assessment_guide.PDF","Downloaded");'>Assessment Sheet</a></p>
                    <p><a href="{% url 'materials_viewer' pdf_name='KS1_self_assessment_sheet' %}" onclick='send_event("ks1_self_assessment_sheet.PDF","Downloaded");'>Self Assessment Sheet</a></p>
                    <p><a href="{% url 'materials_viewer' pdf_name='KS1_teacher_record_sheet' %}" onclick='send_event("ks1_teacher_record_sheet.pdf","Downloaded");'>Teacher Record Sheet</a></p>
                </div>
            </div>
        </div>
    </div>
</div>

<div id="ks2">
    <div class="background col-sm-8 col-center">
        <section>
            <h2>Key Stage 2</h2>
            <img title="KS2" alt="KS2 icon" src="{% static 'portal/img/stage_icon_ks2.svg' %}">
            <h4>Students will develop their understanding of programming principles by learning how to use repeat loops,
                in a visual programming language.</h4>
            <a href="{{ 'KS2_v1.zip'|cloud_storage }}"  onclick='send_event("KS2_v1.zip","Downloaded");'class="button button--regular button--primary--setup">Download all KS2 resources</a>
            <img title="ZIP" alt="ZIP icon" src="{% static 'portal/img/icon_zip.png' %}">
        </section>
        <h3>Sessions <span class="ks-tag">KS2</span></h3>
        <p>Complete lesson plans for each session, including learning objectives, a list of useful resources, pupil activities, and guidance on share and
            review following the session.</p>
        <div class="grid-sessions">
            {% for ks2_session in ks2_sessions %}
                <p><strong>Session {{ ks2_session.session_number }}</strong></p>
                <p><a href="{% url 'materials_viewer' pdf_name=ks2_session.url_name %}" onclick='send_event("ks2_session.pdf","Downloaded");'>
                    {{ ks2_session.description }}</a></p>
                <p><i>{{ ks2_session.levels_covered }}</i></p>
                <div>
                    {% if ks2_session.video %}
                        <img class="grid-icon" title="Video" alt="Video icon" src="{% static 'portal/img/icon_video.png' %}">
                    {% endif %}
                </div>
                <div><img class="grid-icon" title="PDF" alt="PDF icon" src="{% static 'portal/img/icon_pdf.png' %}"></div>
            {% endfor %}
        </div>
        <h3>Resource Sheets <span class="ks-tag">KS2</span></h3>
        <p>Resource sheets help you teach coding concepts offline in the classroom.
            You can <a href="{{ 'KS2_v1/resource_sheets.zip'|cloud_storage }}" onclick='send_event("KS2_v1/resource_sheets.zip","Downloaded");'>download the whole set</a> (zip file), or view and download
            them individually below.</p>
        <div class="grid-resources grid-resources--ks2">
            {% resource_sheets_table ks2_sheets %}
        </div>
    </div>

    <div class="background background--secondary">
        <div class="col-sm-8 col-center">
            <div class="row row--under">
                <div class="col-sm-6">
                    <h3>Program Solutions <span class="ks-tag">KS2</span></h3>
                    <p>This sheet gives you the confidence and the understanding needed to teach the lessons and the solutions to each level.</p>
                    <p><a href="{% url 'materials_viewer' pdf_name='program_solutions_17-28' %}" onclick='send_event("program_solutions_17-28","Downloaded");'>View program solutions</a></p>
                </div>
                <div class="col-sm-6">
                    <h3>Activity Set <span class="ks-tag">KS2</span></h3>
                    <p>This activity set gives you an overview of the Key Stage 2 module. It covers the resources that will be useful, learning
                        expectations and teacher preparation.</p>
                    <p><a href="{% url 'materials_viewer' pdf_name='KS2_activity_set' %}" onclick='send_event("ks2_activity_set","Downloaded");'>View activity set</a></p>
                </div>
            </div>
            <div class="row row--under">
                <div class="col-sm-6">
                    <h3>Assets <span class="ks-tag">KS2</span></h3>
                    <p>Printable sheets with all the game assets from direction arrows to scenery for offline activity activities.</p>
                    <p><a href="{% url 'materials_viewer' pdf_name='KS2_assets' %}" onclick='send_event("KS2_assets.pdf","Downloaded");'>Assets</a></p>
                    <p><a href="{% url 'materials_viewer' pdf_name='KS2_code_wall_cards' %}" onclick='send_event("KS2_code_wall_card.pdf","Downloaded");'>Code wall cards</a></p>
                </div>
                <div class="col-sm-6">
                    <h3>Assessments <span class="ks-tag">KS2</span></h3>
                    <p>Assessment guidance sheets for teachers explain techniques and key questions, pupil-led self-assessment sheets, along with
                        a record sheet for pupils. You can <a href="{{ 'KS2_v1/assessment.zip'|cloud_storage }}" onclick='send_event("KS2_v1/assessment.zip","Downloaded");'> download the
                        whole set</a> (zip file), or view and download them individually below.</p>
                    <p><a href="{% url 'materials_viewer' pdf_name='KS2_assessment_guide' %}" onclick='send_event("ks2_assessment_guide.pdf","Downloaded");'>Assessment Sheet</a></p>
                    <p><a href="{% url 'materials_viewer' pdf_name='KS2_self_assessment_sheet' %}" onclick='send_event("ks2_self_assessment_sheet.PDF","Downloaded");'>Self Assessment Sheet</a></p>
                    <p><a href="{% url 'materials_viewer' pdf_name='KS2_teacher_record_sheet' %}" onclick='send_event("ks2_teacher_record_sheet","Downloaded");'>Teacher Record Sheet</a></p>
                </div>
            </div>
        </div>
    </div>
</div>

<div id="ks3">
    <div class="background col-sm-8 col-center">
        <section>
            <h2>Key Stage 3</h2>
            <img title="KS3" alt="KS3 icon" src="{% static 'portal/img/stage_icon_ks3_blockly.svg' %}">
            <img title="KS3" alt="KS3 icon" src="{% static 'portal/img/stage_icon_ks3_python.svg' %}">
            <h4>Students will continue to develop their understanding of programming principles by learning how to use
            repeat loops, if statements and respond to changes in variables in a visual programming language. They will
            also learn the basics of the text-based language: Python. Throughout, they will be designing, creating and
            debugging their own programs.</h4>
            <a href="{{ 'KS3_v1.zip'|cloud_storage }}" class="button button--regular button--primary--negative">Download all KS3 resources</a>
            <img title="ZIP" alt="ZIP icon" src="{% static 'portal/img/icon_zip.png' %}">
        </section>
        <h3>Sessions <span class="ks-tag">KS3</span></h3>
        <p>Complete lesson plans for each session, including learning objectives, a list of useful resources, pupil activities, and guideance on share and
            review following the session.</p>
        <section class="resource">
            <h4 class="resource__title"><strong>Lower KS3:</strong> Year 7 students (11&ndash;12 year olds)</h4>
            <p><strong>You may wish to recap on <a href="#ks2">earlier levels</a> if your pupils haven&rsquo;t
                already completed levels 17 &mdash; 28.</strong></p>
            <div class="grid-sessions">
                {% for lower_ks3_session in lower_ks3_sessions %}
                    <p><strong>Session {{ lower_ks3_session.session_number }}</strong></p>
                    <p><a href="{% url 'materials_viewer' pdf_name=lower_ks3_session.url_name %}" onclick='send_event("lower_ks3_session.pdf","Downloaded");'>
                        {{ lower_ks3_session.description }}</a></p>
                    <p><i>{{ lower_ks3_session.levels_covered }}</i></p>
                    <div>
                        {% if lower_ks3_session.video %}
                            <img class="grid-icon" title="Video" alt="Video icon" src="{% static 'portal/img/icon_video.png' %}">
                        {% endif %}
                    </div>
                    <div><img class="grid-icon" title="PDF" alt="PDF icon" src="{% static 'portal/img/icon_pdf.png' %}"></div>
                {% endfor %}
            </div>
            <h4 class="resource__title"><strong>Intermediate KS3:</strong> Year 8 students (12&ndash;13 year olds)</h4>
            <div class="grid-sessions">
                {% for intermediate_ks3_session in intermediate_ks3_sessions %}
                    <p><strong>Session {{ intermediate_ks3_session.session_number }}</strong></p>
                    <p><a href="{% url 'materials_viewer' pdf_name=intermediate_ks3_session.url_name %}" onclick='send_event("intermediate_ks3_session.pdf","Downloaded");'>
                        {{ intermediate_ks3_session.description }}</a></p>
                    <p><i>{{ intermediate_ks3_session.levels_covered }}</i></p>
                    <div>
                        {% if intermediate_ks3_session.video %}
                            <img class="grid-icon" title="Video" alt="Video icon" src="{% static 'portal/img/icon_video.png' %}">
                        {% endif %}
                    </div>
                    <div><img class="grid-icon" title="PDF" alt="PDF icon" src="{% static 'portal/img/icon_pdf.png' %}"></div>
                {% endfor %}
            </div>
            <h4 class="resource__title"><strong>Upper KS3:</strong> Year 9 students (13&ndash;14 year olds)</h4>
            <div class="grid-sessions">
                {% for upper_ks3_session in upper_ks3_sessions %}
                    <p><strong>Session {{ upper_ks3_session.session_number }}</strong></p>
                    <p><a href="{% url 'materials_viewer' pdf_name=upper_ks3_session.url_name %}" onclick='send_event("upper_ks3_session.pdf","Downloaded");'>
                        {{ upper_ks3_session.description }}</a></p>
                    <p><i>{{ upper_ks3_session.levels_covered }}</i></p>
                    <div>
                        {% if upper_ks3_session.video %}
                            <img class="grid-icon" title="Video" alt="Video icon" src="{% static 'portal/img/icon_video.png' %}">
                        {% endif %}
                    </div>
                    <div><img class="grid-icon" title="PDF" alt="PDF icon" src="{% static 'portal/img/icon_pdf.png' %}"></div>
                {% endfor %}
            </div>
        </section>
        <h3>Resource Sheets <span class="ks-tag">KS3</span></h3>
        <p>Resource sheets help you teach coding concepts offline in the classroom.
            You can <a href="{{ 'KS3_v1/resource_sheets.zip'|cloud_storage }}">download the whole set</a> (zip file), or view and download
            them individually below.</p>
        <section class="resource">
            <h4 class="resource__title"><strong>Lower KS3:</strong> Year 7 students (11&ndash;12 year olds)</h4>
            <div class="grid-resources grid-resources--lower-ks3">
                {% resource_sheets_table lower_ks3_sheets %}
            </div>
            <h4 class="resource__title"><strong>Intermediate KS3:</strong> Year 8 students (12&ndash;13 year olds)</h4>
            <div class="grid-resources grid-resources--intermediate-ks3">
                {% resource_sheets_table intermediate_ks3_sheets %}
            </div>
            <h4 class="resource__title"><strong>Upper KS3:</strong> Year 9 students (13&ndash;14 year olds)</h4>
            <div class="grid-resources grid-resources--upper-ks3">
                {% resource_sheets_table upper_ks3_sheets %}
            </div>
        </section>
    </div>

    <div class="background background--tertiary">
        <div class="col-sm-8 col-center">
            <div class="row row--under">
                <div class="col-sm-6">
                    <h3>Program Solutions <span class="ks-tag">KS3</span></h3>
                    <p>This sheet gives you the confidence and the understanding needed to teach the lessons and the solutions to each level.</p>
                    <p><a href="{% url 'materials_viewer' pdf_name='program_solutions_19-43' %}" onclick='send_event("program_solutions_19-43.pdf","Downloaded");'>Lower KS3 program solutions</a></p>
                    <p><a href="{% url 'materials_viewer' pdf_name='program_solutions_44-79' %}" onclick='send_event("program_solutions_44-79.pdf","Downloaded");'>Intermediate KS3 program solutions</a></p>
                    <p><a href="{% url 'materials_viewer' pdf_name='program_solutions_80-109' %}" onclick='send_event("program_solutions_80-109.pdf","Downloaded");'>Upper KS3 program solutions</a></p>
                </div>
                <div class="col-sm-6">
                    <h3>Activity Set <span class="ks-tag">KS3</span></h3>
                    <p>This activity set gives you an overview of the Key Stage 1 module. It covers the resources that will be useful, learning
                        expectations and teacher preparation.</p>
                    <p><a href="{% url 'materials_viewer' pdf_name='Lower_KS3_activity_set' %}" onclick='send_event("lower_ks3_activity_set.pdf","Downloaded");'>Lower KS3 activity set</a></p>
                    <p><a href="{% url 'materials_viewer' pdf_name='Intermediate_KS3_activity_set' %}" onclick='send_event("intermediate_ks3_activity_set.pdf","Downloaded");'>Intermediate KS3 activity set</a></p>
                    <p><a href="{% url 'materials_viewer' pdf_name='Upper_KS3_activity_set' %}" onclick='send_event("upper_ks3_activity_set.pdf","Downloaded");'>Upper KS3 activity set</a></p>
                </div>
            </div>
            <div class="row row--under">
                <div class="col-sm-6">
                    <h3>Assets <span class="ks-tag">KS3</span></h3>
                    <p>Printable sheets with all the game assets from direction arrows to scenery for offline activity activities.</p>
                    <p><a href="{% url 'materials_viewer' pdf_name='Lower_KS3_assets' %}" onclick='send_event("lower_ks3_assets","Downloaded");'>Lower KS3 Assets</a></p>
                    <p><a href="{% url 'materials_viewer' pdf_name='Intermediate_KS3_assets' %}" onclick='send_event("intermediate_ks3_assets.pdf","Downloaded");'>Intermediate KS3 Assets</a></p>
                    <p><a href="{% url 'materials_viewer' pdf_name='Upper_KS3_assets' %}" onclick='send_event("upper_ks3_assets.pdf","Downloaded");'>Upper KS3 Assets</a></p>
                </div>
                <div class="col-sm-6">
                    <h3>Assessments <span class="ks-tag">KS3</span></h3>
                    <p>Assessment guidance sheets for teachers to explain techniques and key questions.
                        You can <a href="{{ 'KS3_v1/assessment.zip'|cloud_storage }}" onclick='send_event("KS3_v1/assessment.zip","Downloaded");' > download the
                        whole set</a> (zip file), or view and download them individually below.</p>
                    <h4>Teacher Assessment Sheets</h4>
                    <p><a href="{% url 'materials_viewer' pdf_name='Lower_KS3_assessment_sheet' %}" onclick='send_event("lower_ks3_assessment_sheet.pdf","Downloaded");'>Lower KS3 Assessment Sheet</a></p>
                    <p><a href="{% url 'materials_viewer' pdf_name='Intermediate_KS3_assessment_sheet' %}" onclick='send_event("intermediate_ks3_assessment_sheet.pdf","Downloaded");'>Intermediate KS3 Assessment Sheet</a></p>
                    <p><a href="{% url 'materials_viewer' pdf_name='Upper_KS3_assessment_sheet' %}" onclick='send_event("upper_ks3_assessment_sheet.pdf","Downloaded");'>Upper KS3 Assessment Sheet</a></p>
                    <h4>Student Self-Assessment Sheets</h4>
                    <p><a href="{% url 'materials_viewer' pdf_name='Lower_KS3_self_assessment_sheet' %}" onclick='send_event("lower_ks3_self_assessment_sheet.pdf","Downloaded");'>Lower KS3 Self-Assessment Sheet</a></p>
                    <p><a href="{% url 'materials_viewer' pdf_name='Intermediate_KS3_self_assessment_sheet' %}" onclick='send_event("intermediate_ks3_self_assessment_sheet.pdf","Downloaded");'>Intermediate KS3 Self-Assessment Sheet</a></p>
                    <p><a href="{% url 'materials_viewer' pdf_name='Upper_KS3_self_assessment_sheet' %}" onclick='send_event("upper_ks3_assessment_sheet.pdf","Downloaded");'>Upper KS3 Self-Assessment Sheet</a></p>
                    <h4>Teacher Record Sheets</h4>
                    <p><a href="{% url 'materials_viewer' pdf_name='Lower_KS3_teacher_record_sheet' %}" onclick='send_event("lower_ks3_teacher_record_sheet.pdf","Downloaded");'>Lower KS3 Teacher Record Sheet</a></p>
                    <p><a href="{% url 'materials_viewer' pdf_name='Intermediate_KS3_teacher_record_sheet' %}" onclick='send_event("intermediate_ks3_teacher_record_sheet.pdf","Downloaded");'>Intermediate KS3 Teacher Record Sheet</a></p>
                    <p><a href="{% url 'materials_viewer' pdf_name='Upper_KS3_teacher_record_sheet' %}" onclick='send_event("upper_ks3_teacher_record_sheet.pdf","Downloaded");'>Upper KS3 Teacher Record Sheet</a></p>
                </div>
            </div>
        </div>
    </div>
</div>

<script type="text/javascript">
    $(document).ready(function(){
        if($(window).width() > 760) {
            toggleStickySubnav($('.banner').outerHeight() + $('.menu').outerHeight());
        }
    });
</script>

{% endcache %}
{% endblock content %}
