{% extends "public/base.html" %}
{% load staticfiles %}

{% block head %}
    <link rel="stylesheet" type="text/css" href="{% static 'styles/screen.css' %}" />
    <script type="text/javascript" src="https://code.jquery.com/jquery-2.2.2.min.js"></script>
    <script type="text/javascript" src="{% static 'scripts/falling-pieces.js' %}"></script>
    <script type="text/javascript" src="{% static 'scripts/app.js' %}"></script>
    <script>
        var staticFiles = {
            notrack: '{% static 'images/no_music_makes_me_sick_by_sakgaa.jpg' %}',
            spectrumAnalyzer: '{% static 'images/spectrum-analyzer.gif' %}'
        };
    </script>
{% endblock %}

{% block body %}
    <div id="spinner"><img src="{% static 'images/spinner.gif' %}"/></div>
    <div id="container">
        <div id="content">
            <div id="player"></div>
            <div id="now_playing"></div>
            <div id="last_track"></div>
        </div>
    </div>
    <div id="gameContainer">
        <div id="brickContainer"></div>
    </div>
{% endblock %}