Progress.html

<script>
require(['jquery', 'EasyWebApp'],  function ($, EWA) {

    EWA.component(function (data) {

        data.percent = function () {

            var data = this.valueOf();

            data.done = + data.done,  data.toDo = + data.toDo;

            return (
                data.done / (data.toDo + data.done)
            ).toFixed(4) * 100;
        };

        data.barState = function () {

            var expired = new Date( data.expired ),  state = 'progress-bar-striped ';

            if (Date.now() > expired)
                return  state + 'progress-bar-danger';

            return  (this.percent() < 100)  ?
                (state + 'active')  :
                'progress-bar-success';
        };
    });
});
</script>
<div class="progress">
    <div class="progress-bar ${view.barState()}"
         role="progressbar" aria-valuemin="0" aria-valuemax="100"
         aria-valuenow="${view.percent()}"
         style="width: ${view.percent()}%">
        ${view.percent()}%
    </div>
</div>