mirror of
https://github.com/moodle/moodle.git
synced 2025-04-19 07:25:30 +02:00
Merge branch 'MDL-78341-progress-bar-style' of https://github.com/brendanheywood/moodle
This commit is contained in:
commit
af757274a1
@ -148,7 +148,7 @@ class url_finder {
|
||||
}
|
||||
|
||||
$urls = array();
|
||||
|
||||
sort($tables); // Make it easier to see progress because they are ordered.
|
||||
$numberoftables = count($tables);
|
||||
$tablenumber = 0;
|
||||
foreach ($tables as $table) {
|
||||
|
@ -5151,7 +5151,8 @@ class progress_bar implements renderable, templatable {
|
||||
|
||||
$estimatemsg = '';
|
||||
if ($estimate != 0 && is_numeric($estimate)) {
|
||||
$estimatemsg = format_time(round($estimate));
|
||||
// Err on the conservative side and also avoid showing 'now' as the estimate.
|
||||
$estimatemsg = format_time(ceil($estimate));
|
||||
}
|
||||
|
||||
$this->percent = $percent;
|
||||
|
@ -25,21 +25,29 @@
|
||||
"width": "500"
|
||||
}
|
||||
}}
|
||||
<div id="{{id}}" class="row progressbar_container">
|
||||
<div class="col-md-6 push-md-3">
|
||||
<p id="{{id}}_status" class="text-xs-center"></p>
|
||||
<progress id="{{id}}_bar" class="progress progress-striped progress-animated" value="0" max="100"></progress>
|
||||
<p id="{{id}}_estimate" class="text-xs-center"></p>
|
||||
<div id="{{id}}" class="progressbar_container mb-3">
|
||||
<div class="progress">
|
||||
<div id="{{id}}_bar" class="progress-bar progress-bar-striped progress-bar-animated" role="progressbar" aria-value="0" aria-valuemin="0" aria-valuemax="100" style="width: 0%"></div>
|
||||
</div>
|
||||
<div class="d-flex">
|
||||
<div style="flex: 1 1 0; min-width: 0;">
|
||||
<div id="{{id}}_status" class="text-truncate"> </div>
|
||||
</div>
|
||||
<div class="text-right pl-3" style="flex: 0 0 content">
|
||||
<span id="{{id}}_estimate" class=""> </span>
|
||||
<span id="{{id}}_percentage" class="d-inline-block" style="width: 3em">0%</span>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
{{! We must not use the JS helper otherwise this gets executed too late. }}
|
||||
<script type="text/javascript">
|
||||
<script>
|
||||
(function() {
|
||||
var el = document.getElementById('{{id}}'),
|
||||
progressBar = document.getElementById('{{id}}_bar'),
|
||||
statusIndicator = document.getElementById('{{id}}_status'),
|
||||
estimateIndicator = document.getElementById('{{id}}_estimate');
|
||||
percentageIndicator = document.getElementById('{{id}}_percentage');
|
||||
|
||||
el.addEventListener('update', function(e) {
|
||||
var msg = e.detail.message,
|
||||
@ -47,17 +55,18 @@
|
||||
estimate = e.detail.estimate;
|
||||
|
||||
statusIndicator.textContent = msg;
|
||||
progressBar.setAttribute('value', Math.round(percent));
|
||||
progressBar.style.width = percent.toFixed(1) + '%';
|
||||
progressBar.setAttribute('value', percent.toFixed(1));
|
||||
if (percent === 100) {
|
||||
progressBar.classList.add('progress-success');
|
||||
estimateIndicator.textContent = '100%';
|
||||
progressBar.classList.add('bg-success');
|
||||
progressBar.classList.remove('progress-bar-striped');
|
||||
progressBar.classList.remove('progress-bar-animated');
|
||||
percentageIndicator.textContent = '100%';
|
||||
estimateIndicator.textContent = '';
|
||||
} else {
|
||||
if (estimate) {
|
||||
estimateIndicator.textContent = estimate + ' - ' + percent + '%';
|
||||
} else {
|
||||
estimateIndicator.textContent = '' + percent + '%';
|
||||
}
|
||||
progressBar.classList.remove('progress-success');
|
||||
estimateIndicator.textContent = estimate;
|
||||
percentageIndicator.textContent = percent.toFixed(1) + '%';
|
||||
progressBar.classList.remove('bg-success');
|
||||
}
|
||||
});
|
||||
})();
|
||||
|
Loading…
x
Reference in New Issue
Block a user