Skip to content

Commit

Permalink
WebClient: improve readability of upload progress
Browse files Browse the repository at this point in the history 
Fixes #1773

Signed-off-by: Nicola Murino <[email protected]>
  • Loading branch information
@drakkan
drakkan committed Oct 3, 2024
1 parent e1008c3 commit 32a4a75
Show file tree
Hide file tree
Showing 17 changed files with 64 additions and 58 deletions.
8 changes: 4 additions & 4 deletions static/locales/en/translation.json
View file
Original file line number Diff line number Diff line change
Expand Up @@ -291,10 +291,10 @@
"no_files_folders": "No files or folders",
"invalid_name": "File or folder names cannot contain \"/\"",
"folder_name_required": "Folder name is required",
"deleting": "Delete {{idx}}/{{total}}: {{- name}}",
"copying": "Copy {{idx}}/{{total}}: {{- name}}",
"moving": "Move {{idx}}/{{total}}: {{- name}}",
"uploading": "Upload {{idx}}/{{total}}: {{- name}}",
"deleting": "Delete {{idx}}/{{total}}",
"copying": "Copy {{idx}}/{{total}}",
"moving": "Move {{idx}}/{{total}}",
"uploading": "Upload {{idx}}/{{total}}",
"err_403": "Permission denied",
"err_429": "Too many concurrent requests",
"err_generic": "Unable to access the requested resource",
Expand Down
8 changes: 4 additions & 4 deletions static/locales/it/translation.json
View file
Original file line number Diff line number Diff line change
Expand Up @@ -291,10 +291,10 @@
"no_files_folders": "Nessun file o cartella",
"invalid_name": "I nomi di file o cartelle non possono contenere \"/\"",
"folder_name_required": "Il nome della cartella è obbligatorio",
"deleting": "Eliminazione {{idx}}/{{total}}: {{- name}}",
"copying": "Copia {{idx}}/{{total}}: {{- name}}",
"moving": "Spostamento {{idx}}/{{total}}: {{- name}}",
"uploading": "Caricamento {{idx}}/{{total}}: {{- name}}",
"deleting": "Eliminazione {{idx}}/{{total}}",
"copying": "Copia {{idx}}/{{total}}",
"moving": "Spostamento {{idx}}/{{total}}",
"uploading": "Caricamento {{idx}}/{{total}}",
"err_403": "Non si dispone delle autorizzazioni richieste",
"err_429": "Troppe richieste contemporanee",
"err_generic": "Impossibile accedere alla risorsa richiesta",
Expand Down
13 changes: 12 additions & 1 deletion templates/common/base.html
View file
Original file line number Diff line number Diff line change
Expand Up @@ -311,6 +311,16 @@
}
}

function clearLoading() {
$('#loading_info').text("");
$('#loading_message').text("");
}

function setLoadingText(info, message) {
$('#loading_info').text(info);
$('#loading_message').text(message);
}

KTUtil.onDOMContentLoaded(function () {
var dismissErrorBtn = $('#id_dismiss_error_msg');
if (dismissErrorBtn){
Expand Down Expand Up @@ -900,7 +910,8 @@
</div>
<div class="page-loader flex-column">
<span class="spinner-border text-primary" role="status"></span>
<span id="loading_message" class="text-muted fs-4 fw-semibold mt-5"></span>
<span id="loading_info" class="text-muted fs-4 fw-semibold mt-5"></span>
<span id="loading_message" class="text-muted fs-4 fw-semibold mt-5"></span>
</div>

<div class="modal fade" tabindex="-1" id="modal_alert">
Expand Down
4 changes: 2 additions & 2 deletions templates/webadmin/admins.html
View file
Original file line number Diff line number Diff line change
Expand Up @@ -125,7 +125,7 @@ <h3 data-i18n="admin.view_manage" class="card-title section-title">View and mana
}
}).then((result) => {
if (result.isConfirmed){
$('#loading_message').text("");
clearLoading();
KTApp.showPageLoading();
let path = '{{.AdminURL}}' + "/" + encodeURIComponent(username);

Expand Down Expand Up @@ -187,7 +187,7 @@ <h3 data-i18n="admin.view_manage" class="card-title section-title">View and mana
}
}).then((result) => {
if (result.isConfirmed){
$('#loading_message').text("");
clearLoading();
KTApp.showPageLoading();
let path = '{{.AdminURL}}' + "/" + encodeURIComponent(username)+"/2fa/disable";

Expand Down
4 changes: 2 additions & 2 deletions templates/webadmin/configs.html
View file
Original file line number Diff line number Diff line change
Expand Up @@ -402,7 +402,7 @@ <h2 class="accordion-header" id="accordion_header_smtp">
return;
}

$('#loading_message').text("");
clearLoading();
KTApp.showPageLoading();

let data = {"base_redirect_url": getCurrentURI(), "provider": parseInt($('#idSMTPOAuth2Provider').val()),
Expand Down Expand Up @@ -499,7 +499,7 @@ <h2 class="accordion-header" id="accordion_header_smtp">
}
}

$('#loading_message').text("");
clearLoading();
KTApp.showPageLoading();
let debug = 0;
if ($('#idSMTPDebug').is(':checked')){
Expand Down
2 changes: 1 addition & 1 deletion templates/webadmin/connections.html
View file
Original file line number Diff line number Diff line change
Expand Up @@ -82,7 +82,7 @@ <h3 data-i18n="connections.view_manage" class="card-title section-title">View an
}
}).then((result) => {
if (result.isConfirmed){
$('#loading_message').text("");
clearLoading();
KTApp.showPageLoading();
let path = '{{.ConnectionsURL}}' + "/" + encodeURIComponent(connectionID);
if (node) {
Expand Down
2 changes: 1 addition & 1 deletion templates/webadmin/defender.html
View file
Original file line number Diff line number Diff line change
Expand Up @@ -78,7 +78,7 @@ <h3 data-i18n="defender.view_manage" class="card-title section-title">View and m
}
}).then((result) => {
if (result.isConfirmed){
$('#loading_message').text("");
clearLoading();
KTApp.showPageLoading();
let path = '{{.DefenderHostsURL}}' + "/" + encodeURIComponent(id);

Expand Down
2 changes: 1 addition & 1 deletion templates/webadmin/eventactions.html
View file
Original file line number Diff line number Diff line change
Expand Up @@ -78,7 +78,7 @@ <h3 data-i18n="actions.view_manage" class="card-title section-title">View and ma
}
}).then((result) => {
if (result.isConfirmed){
$('#loading_message').text("");
clearLoading();
KTApp.showPageLoading();
let path = '{{.EventActionURL}}' + "/" + encodeURIComponent(name);

Expand Down
4 changes: 2 additions & 2 deletions templates/webadmin/eventrules.html
View file
Original file line number Diff line number Diff line change
Expand Up @@ -80,7 +80,7 @@ <h3 data-i18n="rules.view_manage" class="card-title section-title">View and mana
}
}).then((result) => {
if (result.isConfirmed){
$('#loading_message').text("");
clearLoading();
KTApp.showPageLoading();
let path = '{{.EventRuleURL}}' + "/" + encodeURIComponent(name);

Expand Down Expand Up @@ -135,7 +135,7 @@ <h3 data-i18n="rules.view_manage" class="card-title section-title">View and mana
}
}).then((result) => {
if (result.isConfirmed){
$('#loading_message').text("");
clearLoading();
KTApp.showPageLoading();
let path = '{{.EventRuleURL}}' + "/run/" + encodeURIComponent(name);

Expand Down
2 changes: 1 addition & 1 deletion templates/webadmin/folders.html
View file
Original file line number Diff line number Diff line change
Expand Up @@ -110,7 +110,7 @@ <h3 data-i18n="virtual_folders.view_manage" class="card-title section-title">Vie
}
}).then((result) => {
if (result.isConfirmed){
$('#loading_message').text("");
clearLoading();
KTApp.showPageLoading();
let path = '{{.FolderURL}}' + "/" + encodeURIComponent(name);

Expand Down
2 changes: 1 addition & 1 deletion templates/webadmin/groups.html
View file
Original file line number Diff line number Diff line change
Expand Up @@ -96,7 +96,7 @@ <h3 data-i18n="group.view_manage" class="card-title section-title">View and mana
}
}).then((result) => {
if (result.isConfirmed){
$('#loading_message').text("");
clearLoading();
KTApp.showPageLoading();
let path = '{{.GroupURL}}' + "/" + encodeURIComponent(name);

Expand Down
2 changes: 1 addition & 1 deletion templates/webadmin/iplists.html
View file
Original file line number Diff line number Diff line change
Expand Up @@ -210,7 +210,7 @@ <h3 data-i18n="ip_list.view_manage" class="card-title section-title">View and ma
}
}).then((result) => {
if (result.isConfirmed){
$('#loading_message').text("");
clearLoading();
KTApp.showPageLoading();
let path = '{{.IPListURL}}' + "/" + encodeURIComponent(listType)+ "/" + encodeURIComponent(ipNet);
axios.delete(path, {
Expand Down
2 changes: 1 addition & 1 deletion templates/webadmin/roles.html
View file
Original file line number Diff line number Diff line change
Expand Up @@ -97,7 +97,7 @@ <h3 data-i18n="role.view_manage" class="card-title section-title">View and manag
}
}).then((result) => {
if (result.isConfirmed){
$('#loading_message').text("");
clearLoading();
KTApp.showPageLoading();
let path = '{{.RoleURL}}' + "/" + encodeURIComponent(name);

Expand Down
6 changes: 3 additions & 3 deletions templates/webadmin/users.html
View file
Original file line number Diff line number Diff line change
Expand Up @@ -145,7 +145,7 @@ <h3 data-i18n="user.view_manage" class="card-title section-title">View and manag
}
}).then((result) => {
if (result.isConfirmed){
$('#loading_message').text("");
clearLoading();
KTApp.showPageLoading();
let path = '{{.UserURL}}' + "/" + encodeURIComponent(username);

Expand Down Expand Up @@ -200,7 +200,7 @@ <h3 data-i18n="user.view_manage" class="card-title section-title">View and manag
}
}).then((result) => {
if (result.isConfirmed){
$('#loading_message').text("");
clearLoading();
KTApp.showPageLoading();
let path = '{{.UserURL}}' + "/" + encodeURIComponent(username)+"/2fa/disable";

Expand Down Expand Up @@ -230,7 +230,7 @@ <h3 data-i18n="user.view_manage" class="card-title section-title">View and manag
}

function quotaScanAction(username) {
$('#loading_message').text("");
clearLoading();
KTApp.showPageLoading();
let path = '{{.QuotaScanURL}}' + "/" + encodeURIComponent(username);
axios.post(path, null, {
Expand Down
46 changes: 21 additions & 25 deletions templates/webclient/files.html
View file
Original file line number Diff line number Diff line change
Expand Up @@ -1168,7 +1168,7 @@ <h4 class="gslide-title"></h4>
if (selectedRowsIdx.length == 0){
return;
}
$('#loading_message').text("");
clearLoading();
KTApp.showPageLoading();

function deleteSelected() {
Expand All @@ -1190,15 +1190,14 @@ <h4 class="gslide-title"></h4>
}
path+='?path={{.CurrentDir}}'+encodeURIComponent("/"+itemName);

let deleteTxt = "";
if (selectedRowsIdx.length > 1){
deleteTxt = $.t('fs.deleting', {
let info = $.t('fs.deleting', {
idx : index + 1,
total: selectedRowsIdx.length,
name: itemName
total: selectedRowsIdx.length
});
setLoadingText(info,itemName);
}
$('#loading_message').text(deleteTxt);

axios.delete(path,{
timeout: 15000,
headers: {
Expand Down Expand Up @@ -1400,7 +1399,7 @@ <h4 class="gslide-title"></h4>
let hasError = false;
let index = 0;

$('#loading_message').text("");
clearLoading();
KTApp.showPageLoading();

function copyItem() {
Expand All @@ -1425,12 +1424,11 @@ <h4 class="gslide-title"></h4>
targetPath+=item.targetName;

if (items.length > 1) {
msgTxt = $.t('fs.copying', {
let info = $.t('fs.copying', {
idx: index + 1,
total: items.length,
name: `${sourcePath} => ${targetPath}`
total: items.length
});
$('#loading_message').text(msgTxt);
setLoadingText(info,`${sourcePath} => ${targetPath}`);
}
let path = '{{.FileActionsURL}}/copy';
path+='?path={{.CurrentDir}}'+encodeURIComponent("/"+item.sourceName)+'&target='+item.targetDir+encodeURIComponent("/"+item.targetName);
Expand Down Expand Up @@ -1550,7 +1548,7 @@ <h4 class="gslide-title"></h4>
let hasError = false;
let index = 0;

$('#loading_message').text("");
clearLoading();
KTApp.showPageLoading();

function moveItem() {
Expand All @@ -1575,12 +1573,11 @@ <h4 class="gslide-title"></h4>
targetPath+=item.targetName;

if (items.length > 1) {
msgTxt = $.t('fs.moving', {
let info = $.t('fs.moving', {
idx: index + 1,
total: items.length,
name: `${sourcePath} => ${targetPath}`
total: items.length
});
$('#loading_message').text(msgTxt);
setLoadingText(info,`${sourcePath} => ${targetPath}`);
}
let path = '{{.FileActionsURL}}/move';
path+='?path={{.CurrentDir}}'+encodeURIComponent("/"+item.sourceName)+'&target='+item.targetDir+encodeURIComponent("/"+item.targetName);
Expand Down Expand Up @@ -1690,7 +1687,7 @@ <h4 class="gslide-title"></h4>
}
}).then((result) => {
if (result.isConfirmed){
$('#loading_message').text("");
clearLoading();
KTApp.showPageLoading();
let isDir = (getTypeFromMeta(meta) == "1");
let path;
Expand Down Expand Up @@ -1822,7 +1819,7 @@ <h4 class="gslide-title"></h4>
return;
}

$('#loading_message').text("");
clearLoading();
KTApp.showPageLoading();

function executeRename() {
Expand Down Expand Up @@ -1985,7 +1982,7 @@ <h4 class="gslide-title"></h4>
let success = 0;
let checkedDirs = [];
$('#errorMsg').addClass("d-none");
$('#loading_message').text("");
clearLoading();
KTApp.showPageLoading();

function uploadFile() {
Expand Down Expand Up @@ -2024,16 +2021,15 @@ <h4 class="gslide-title"></h4>
lastModified = "";
}

let uploadTxt = f.name;
let info = "";
if (files.length > 1){
uploadTxt = $.t('fs.uploading', {
info = $.t('fs.uploading', {
idx: index + 1,
total: files.length,
name: uploadTxt
total: files.length
});
}

$('#loading_message').text(uploadTxt);
setLoadingText(info,f.name);

axios.post(uploadPath, f, {
headers: {
Expand All @@ -2046,7 +2042,7 @@ <h4 class="gslide-title"></h4>
}
const percentage = Math.round((100 * progressEvent.loaded) / progressEvent.total);
if (percentage > 0 && percentage < 100){
$('#loading_message').text(`${uploadTxt} ${percentage}%`);
setLoadingText(info,`${f.name} ${percentage}%`);
}
},
validateStatus: function (status) {
Expand Down
2 changes: 1 addition & 1 deletion templates/webclient/shares.html
View file
Original file line number Diff line number Diff line change
Expand Up @@ -176,7 +176,7 @@ <h4 data-i18n="share.link_uncompressed_title">Uncompressed file</h4>
}
}).then((result) => {
if (result.isConfirmed){
$('#loading_message').text("");
clearLoading();
KTApp.showPageLoading();
let path = '{{.ShareURL}}' + "/" + encodeURIComponent(shareID);

Expand Down
13 changes: 6 additions & 7 deletions templates/webclient/shareupload.html
View file
Original file line number Diff line number Diff line change
Expand Up @@ -60,7 +60,7 @@ <h3 data-i18n="fs.upload.message" class="fs-5 fw-bold text-gray-900 mb-1">Drop f
let success = 0;
let checkedDirs = [];
$('#errorMsg').addClass("d-none");
$('#loading_message').text("");
clearLoading();
KTApp.showPageLoading();

function uploadFile() {
Expand Down Expand Up @@ -103,16 +103,15 @@ <h3 data-i18n="fs.upload.message" class="fs-5 fw-bold text-gray-900 mb-1">Drop f
lastModified = "";
}

let uploadTxt = f.name;
let info = "";
if (files.length > 1){
uploadTxt = $.t('fs.uploading', {
info = $.t('fs.uploading', {
idx: index + 1,
total: files.length,
name: uploadTxt
total: files.length
});
}

$('#loading_message').text(uploadTxt);
setLoadingText(info,f.name);

axios.post(uploadPath, f, {
headers: {
Expand All @@ -125,7 +124,7 @@ <h3 data-i18n="fs.upload.message" class="fs-5 fw-bold text-gray-900 mb-1">Drop f
}
const percentage = Math.round((100 * progressEvent.loaded) / progressEvent.total);
if (percentage > 0 && percentage < 100){
$('#loading_message').text(`${uploadTxt} ${percentage}%`);
setLoadingText(info,`${f.name} ${percentage}%`);
}
},
validateStatus: function (status) {
Expand Down

0 comments on commit 32a4a75

Please sign in to comment.