alert(`An error occurred. Return code: ${xhr.status}`);
reject();
} else {
- formElement.remove();
+ formElement.closest('.edit-link-container').remove();
resolve();
}
};
alert(`An error occurred. Return code: ${xhr.status}`);
reject();
} else {
- formElement.remove();
+ formElement.closest('.edit-link-container').remove();
resolve();
}
};
saveAllButton.addEventListener('click', (e) => {
e.preventDefault();
+ const forms = [...getForms()];
+ const nbForm = forms.length;
+ let current = 0;
+ const progressBar = document.querySelector('.progressbar > div');
+ const progressBarCurrent = document.querySelector('.progressbar-current');
+
+ document.querySelector('.dark-layer').style.display = 'block';
+ document.querySelector('.progressbar-max').innerHTML = nbForm;
+ progressBarCurrent.innerHTML = current;
+
const promises = [];
- [...getForms()].forEach((formElement) => {
- promises.push(sendBookmarkForm(basePath, formElement));
+ forms.forEach((formElement) => {
+ promises.push(sendBookmarkForm(basePath, formElement).then(() => {
+ current += 1;
+ progressBar.style.width = `${(current * 100) / nbForm}%`;
+ progressBarCurrent.innerHTML = current;
+ }));
});
Promise.all(promises).then(() => {
}
}
+.dark-layer {
+ display: none;
+ position: fixed;
+ height: 100%;
+ width: 100%;
+ z-index: 998;
+ background-color: rgba(0, 0, 0, .75);
+ color: #fff;
+
+ .screen-center {
+ display: flex;
+ flex-direction: column;
+ justify-content: center;
+ align-items: center;
+ text-align: center;
+ min-height: 100vh;
+ }
+
+ .progressbar {
+ width: 33%;
+ }
+}
+
.addlink-batch-form-block {
.pure-alert {
margin: 25px 0 0 0;
{include="includes"}
</head>
<body>
+<div class="dark-layer">
+ <div class="screen-center">
+ <div><span class="progressbar-current"></span> / <span class="progressbar-max"></span></div>
+ <div class="progressbar">
+ <div></div>
+ </div>
+ </div>
+</div>
+
{include="page.header"}
<div class="center">
projects / github / shaarli / Shaarli.git / commitdiff
