{% extends "layouts/base.html" %}

{% block custom_css %}
{{ super() }}
<!-- VENDOR CSS -->
<link rel="stylesheet" href="{{ url_for('jsondash._static', filename='css/vendor/font-awesome.css') }}">

<!-- CHART SPECIFIC CSS -->
{% for label, chart_group in charts_config.items() %}
    {% if chart_group.enabled and chart_group.css_url %}
        <!-- Chart CSS: {{ label }} -->
        {% for url in chart_group.css_url %}
            <link rel="stylesheet" href="//{{ url }}">
        {% endfor %}
    {% endif %}
{% endfor %}

<!-- APP CSS -->
<link rel="stylesheet" href="{{ url_for('jsondash._static', filename='css/examples.css') }}">
<link rel="stylesheet" href="{{ url_for('jsondash._static', filename='css/app.css') }}">
<link rel="stylesheet" href="{{ url_for('jsondash._static', filename='css/overrides.css') }}">

{% endblock %}

{% block body %}
{{ super() }}
<div id="charts-builder">
    {% block chart_body %}{% endblock %}
</div>
{% endblock %}

{% block custom_scripts %}
{{ super() }}
<!-- CORE VENDOR JS -->
<script src="{{ url_for('jsondash._static', filename='js/vendor/freewall.js') }}"></script>
<script src="{{ url_for('jsondash._static', filename='js/vendor/jRespond.min.js') }}"></script>

<!-- CHART SPECIFIC SCRIPTS -->
{% for label, chart_group in charts_config.items() %}
    {% if chart_group.enabled and chart_group.js_url %}
        <!-- Chart JS: {{ label }} -->
        {% for url in chart_group.js_url %}
            <script src="//{{ url }}"></script>
        {% endfor %}
    {% endif %}
{% endfor %}

<!-- APP JS -->
<script src="{{ url_for('jsondash._static', filename='js/app.js') }}"></script>
<script src="{{ url_for('jsondash._static', filename='js/handlers.js') }}"></script>
<script src="{{ url_for('jsondash._static', filename='js/utils.js') }}"></script>
<script>
    $(document).ready(function(){
        jsondash.addDomEvents();
        {% if view %}
        jsondash.loadDashboard({{ view|jsonstring|safe }});
        {% endif %}
    });
</script>
{% endblock %}