{% extends "base.html" %}
{% from 'bootstrap/form.html' import render_form %}

{% block scripts %}
{{super()}}
<script lang="text/javascript">
    let prog=0;
    function setPrograb(selector,value) {
        let rv=Math.round(prog*100,2)/100;
        $(selector).attr('style','width: '+rv+"%;");
        $(selector).attr('aria-valuenow',rv);
        $(selector).text(rv+' %');
    }
    setInterval(() => {
        for (var i=0;i<100;++i) {
            prog=Math.random()*100;
            setPrograb("#prog_test_bar_"+i,prog);
        }
    },1000)
</script>
{% endblock %}


{% block app_content__ %}
    <div class="row">
        {{render_form(form)}}
    </div>
{% endblock %}



{% block app_content %}
    {% for i in range(100) %}
        <div class="row">
            <div id="prog_test_{{i}}" class="progress" style="width: 100%;">
                <div id="prog_test_bar_{{i}}" class="progress-bar progress-bar-striped progress-bar-animated"
                    style="width: 0%;" role="progressbar"
                    aria-valuenow="" aria-valuemin="0" aria-valuemax="100">
                </div>
            </div>
        </div>
    {% endfor %}
{% endblock %}