aboutsummaryrefslogtreecommitdiffstats
path: root/view
diff options
context:
space:
mode:
Diffstat (limited to 'view')
-rw-r--r--view/js/mod_import_progress.js64
-rw-r--r--view/tpl/import_progress.tpl42
2 files changed, 106 insertions, 0 deletions
diff --git a/view/js/mod_import_progress.js b/view/js/mod_import_progress.js
new file mode 100644
index 000000000..69e4c5242
--- /dev/null
+++ b/view/js/mod_import_progress.js
@@ -0,0 +1,64 @@
+$(document).ready(function() {
+
+ console.log('import_progress');
+
+ setInterval(get_progress, 5000);
+
+
+ function get_progress(){
+ console.log('get');
+
+ $.get('import_progress', function(data) {
+ update_progress(data);
+ });
+ }
+
+ function update_progress(data){
+ console.log('update');
+ console.log(data);
+ console.log(data.cprogress);
+ console.log(data.fprogress);
+
+
+ if (typeof data.cprogress == 'number') {
+ $('#cprogress-label').html(data.cprogress + '%');
+ $('#cprogress-bar').css('width', data.cprogress + '%');
+
+ if (data.cprogress == 100) {
+ $('#cprogress-resume').addClass('d-none');
+ $('#cprogress-complete').removeClass('d-none');
+ $('#cprogress-bar').removeClass('progress-bar-animated');
+ }
+ else if (data.cprogress < 100) {
+ $('#cprogress-resume').removeClass('d-none');
+ $('#cprogress-complete').addClass('d-none');
+ $('#cprogress-bar').addClass('progress-bar-animated');
+ }
+ }
+ else {
+ $('#cprogress-label').html(data.cprogress);
+ $('#cprogress-bar').css('width', '0%');
+
+ }
+
+ if (typeof data.fprogress == 'number') {
+ $('#fprogress-label').html(data.fprogress + '%');
+ $('#fprogress-bar').css('width', data.fprogress + '%');
+
+ if (data.fprogress == 100) {
+ $('#fprogress-resume').addClass('d-none');
+ $('#fprogress-complete').removeClass('d-none');
+ $('#fprogress-bar').removeClass('progress-bar-animated');
+ }
+ else if (data.fprogress < 100) {
+ $('#fprogress-resume').removeClass('d-none');
+ $('#fprogress-complete').addClass('d-none');
+ $('#fprogress-bar').addClass('progress-bar-animated');
+ }
+ }
+ else {
+ $('#fprogress-label').html(data.fprogress);
+ $('#fprogress-bar').css('width', '0%');
+ }
+ }
+});
diff --git a/view/tpl/import_progress.tpl b/view/tpl/import_progress.tpl
new file mode 100644
index 000000000..34a93e7c8
--- /dev/null
+++ b/view/tpl/import_progress.tpl
@@ -0,0 +1,42 @@
+<h3>Channel clone status: 100%</h3>
+
+<div>
+ <div class="progress mb-2">
+ <div class="progress-bar progress-bar-striped bg-primary" role="progressbar" style="width: 100%" aria-valuenow="100" aria-valuemin="0" aria-valuemax="100"></div>
+ </div>
+ <div>
+ <span class="text-muted">Channel cloning completed!</span>
+ </div>
+</div>
+
+<hr>
+
+<h3>Item sync status: <span id="cprogress-label">{{$cprogress_str}}</span></h3>
+
+<div id="cprogress">
+ <div class="progress mb-2">
+ <div id="cprogress-bar" class="progress-bar progress-bar-striped bg-warning{{if $fprogress < 100}} progress-bar-animated{{/if}}" role="progressbar" style="width: {{$cprogress}}%" aria-valuenow="{{$cprogress}}" aria-valuemin="0" aria-valuemax="100"></div>
+ </div>
+ <div id="cprogress-resume" class="">
+ <a href="/import_progress/restart_itemsync">[ RESUME ]</a> <span class="text-muted">Only resume if sync stalled!</span>
+ </div>
+ <div id="cprogress-complete" class="d-none">
+ <span class="text-muted">Item sync completed!</span>
+ </div>
+</div>
+
+<hr>
+
+<h3>File sync status: <span id="fprogress-label">{{$fprogress_str}}</span></h3>
+
+<div id="fprogress">
+ <div class="progress mb-2">
+ <div id="fprogress-bar" class="progress-bar progress-bar-striped bg-info{{if $fprogress < 100}} progress-bar-animated{{/if}}" role="progressbar" style="width: {{$fprogress}}%" aria-valuenow="{{$fprogress}}" aria-valuemin="0" aria-valuemax="100"></div>
+ </div>
+ <div id="fprogress-resume" class="{{if $fprogress == 100}}d-none{{/if}}">
+ <a href="/import_progress/restart_filesync">[ RESUME ]</a> <span class="text-muted">Only resume if sync stalled!</span>
+ </div>
+ <div id="fprogress-complete" class="{{if $fprogress < 100}}d-none{{/if}}">
+ <span class="text-muted">File sync completed!</span>
+ </div>
+</div>