{% extends 'migrator_base.html' %}
{% load static %}
{% block title %}Configs{% endblock %}

{% block content %}
    <div class='progress-wrapper'>
        <div id='progress-bar' class='progress-bar' style="background-color: #68a9ef; width: 0%;">&nbsp;</div>
    </div>
    <div id="progress-bar-message">Waiting for progress to start...</div>
    <script src="{% static 'celery_progress/celery_progress.js' %}"></script>
    <script>
        var progressUrl = "{% url 'celery_progress:task_status' task_id %}";

        function customResult(resultElement, result) {
            $(resultElement).append(
                $('<p>').text('Sum of all seconds is ' + result)
            );
        }


        CeleryProgressBar.initProgressBar(progressUrl, {
            onResult: customResult,
        })

    </script>
{% endblock %}