diff --git a/android-client/web/app.html b/android-client/web/app.html
index 6abb619..4aa0152 100644
--- a/android-client/web/app.html
+++ b/android-client/web/app.html
@@ -172,6 +172,11 @@
.btn.ico-btn svg { width: 22px; height: 22px; }
/* Le retour d'appui ne peut plus venir du fond : il vient du trait. */
.btn.ico-btn:active { opacity: .45; }
+ @keyframes spin { to { transform: rotate(360deg); } }
+ /* L'ENREGISTREMENT DURE UNE A DEUX SECONDES, et le bouton doit le dire. Le
+ mot "Saving..." le disait ; une coche immobile ne dirait rien, et c'est
+ precisement pendant cette attente qu'on appuie une seconde fois. */
+ .btn.spin svg { animation: spin .9s linear infinite; }
.empty { text-align: center; color: var(--muted); padding: 48px 16px; }
@@ -625,6 +630,10 @@ var ICONS = {
edit: '',
eye: ''
+ '',
+ check: '',
+ close: '',
+ // Un arc, pas un cercle : c'est l'ouverture qui rend la rotation visible.
+ loader: '',
eyeOff: ''
+ ''
+ ''
@@ -735,7 +744,7 @@ document.getElementById('fields').addEventListener('click', function (ev) {
var iv = document.getElementById('editval');
var hid = iv.type === 'password';
iv.type = hid ? 'text' : 'password';
- t.textContent = hid ? 'Hide' : 'Show';
+ t.innerHTML = ico(hid ? 'eyeOff' : 'eye', hid ? 'Hide' : 'Show');
return;
}
if (t.getAttribute('data-editcancel') !== null) { renderDetail(lastDetail); return; }
@@ -749,10 +758,12 @@ document.getElementById('fields').addEventListener('click', function (ev) {
toast('An empty password is not saved');
return;
}
- // DIRE QUE CA TRAVAILLE. L'enregistrement tire, dechiffre, rechiffre et
- // publie : plusieurs secondes pendant lesquelles rien ne bougeait, et le
- // bouton semblait n'avoir pas pris l'appui.
- t.textContent = 'Saving...';
+ // DIRE QUE CA TRAVAILLE. L'enregistrement dechiffre, rechiffre et publie :
+ // une a deux secondes pendant lesquelles rien ne bougeait, et le bouton
+ // semblait n'avoir pas pris l'appui. La coche cede la place a un arc qui
+ // tourne - immobile, elle laisserait croire que c'est fini.
+ t.innerHTML = ico('loader', 'Saving');
+ t.classList.add('spin');
t.disabled = true;
var cancel = document.querySelector('[data-editcancel]');
if (cancel) cancel.disabled = true;
@@ -839,9 +850,16 @@ function openEditor(k) {
line.innerHTML = editorControl(k)
// Show n'a de sens que sur un champ masque. Sur un site en clair il
// n'aurait rien a reveler - et l'inverse : il le CACHERAIT.
- + (detailRows[k].s ? '' : '')
- + ''
- + '';
+ //
+ // LES TROIS EN ICONES, comme les lignes au-dessus : ils partageaient la
+ // rangee avec le champ de saisie, et trois mots y laissaient a peine de
+ // quoi lire ce qu'on tape. La croix et la coche se lisent sans traduction.
+ + (detailRows[k].s ? '' : '')
+ + ''
+ + '';
var input = document.getElementById('editval');
input.value = detailRows[k].v;
input.focus();