{% extends 'core/base.html' %}

{% load i18n %}
{% load static %}

{% block content %}
    <div class="container{% if dashboard.full_screen %}-fluid{% endif %}">
        {% for row in dashboard.get_element_rows %}
            <div class="row">
                {% for element in row %}
                    <div class="col-md-{{ element.span }}">
                        <div class="widget">
                            <div class="widget-header">
                                <span class="widget-label">{{ element }}</span>
                            </div>
                            <div class="widget-content" style="height: {{ element.height }}px;">
                                <div id="widget{{ element.pk }}" style="width: 100%; height: 100%;">
                                    <p class="text-center"><i class="refresh-spinner fa fa-cog fa-spin fa-3x"></i></p>
                                </div>
                            </div>
                        </div>
                    </div>
                {% endfor %}
            </div>
        {% endfor %}
    </div>
{% endblock content %}

{% block javascript %}
    <script type="text/javascript">
         $(document).ready(function() {
            {% for element in dashboard.elements.enabled %}
                $("#widget{{ element.pk }}").load("{% url 'widgets:widget_render' element.widget.pk %}?element_pk={{ element.pk }}");
            {% endfor %}
         });
    </script>
{% endblock javascript %}