diff --git a/src/js/account/index.js b/src/js/account/index.js index 744f1ec..d27c4e0 100644 --- a/src/js/account/index.js +++ b/src/js/account/index.js @@ -26,11 +26,23 @@ export function syncImportedDictionary() { } export function uploadDetailsDirect() { - uploadDetails(); + uploadDetails().catch(err => { + console.error(err); + addMessage('Could not connect to account. Trying again in 10 seconds.', undefined, 'error'); + setTimeout(() => { + uploadDetails(); + }, 10000); + }); } export function uploadWord(word) { - uploadWords([word]); + uploadWords([word]).catch(err => { + console.error(err); + addMessage('Could not connect to account. Trying again in 10 seconds.', undefined, 'error'); + setTimeout(() => { + uploadWord(word); + }, 10000); + }); } export function syncImportedWords(words) { @@ -41,7 +53,7 @@ export function deleteWord(wordId) { deleteWords([wordId]).catch(err => { console.error(err); saveDeletedWordLocally(wordId); - addMessage('Could not connect. Trying again in 10 seconds.'); + addMessage('Could not connect to account. Trying again in 10 seconds.', undefined, 'error'); setTimeout(() => { deleteWord(wordId); }, 10000); diff --git a/src/js/account/sync.js b/src/js/account/sync.js index 762a346..d55457b 100644 --- a/src/js/account/sync.js +++ b/src/js/account/sync.js @@ -48,7 +48,7 @@ export function syncDictionary() { const detailsSynced = syncDetails(remote.details); if (detailsSynced === false) { - addMessage('Could not sync'); + addMessage('Could not sync', 10000, 'error'); } else { detailsSynced.then(success => { renderAll(); @@ -99,7 +99,7 @@ export function uploadWholeDictionary(asNew = false) { addMessage('Dictionary Uploaded Successfully'); }, errorData => { console.error(errorData); - addMessage(errorData); + addMessage(errorData, 10000, 'error'); }) .catch(err => console.error('set-whole-current-dictionary: ', err)); }) @@ -138,7 +138,7 @@ export function uploadDetails() { return successful; }, error => { console.error(error); - addMessage('Could not sync dictionary'); + addMessage('Could not sync dictionary', 10000, 'undefined'); return false; }); } @@ -220,7 +220,7 @@ export function uploadWords(words) { return successful; }, error => { console.error(error); - addMessage('Could not upload words'); + addMessage('Could not upload words', 10000, 'error'); return false; }); } @@ -234,7 +234,7 @@ export function deleteWords(wordIds) { return successful; }, error => { console.error(error); - addMessage('Could not delete words'); + addMessage('Could not delete words', 10000, 'error'); saveDeletedWordsLocally(wordIds); return false; }); diff --git a/src/js/dictionaryManagement.js b/src/js/dictionaryManagement.js index 46c7226..0c7df35 100644 --- a/src/js/dictionaryManagement.js +++ b/src/js/dictionaryManagement.js @@ -164,7 +164,7 @@ export function importDictionary() { }); } } else { - addMessage('Dictionary could not be imported', 10000); + addMessage('Dictionary could not be imported', 10000, 'error'); } }; @@ -187,7 +187,7 @@ export function importWords() { step: results => { if (results.errors.length > 0) { results.errors.forEach(err => { - addMessage('Error Importing Word: ' + err); + addMessage('Error Importing Word: ' + err, undefined, 'error'); console.error('Error Importing Word: ', err) }); } else { @@ -218,7 +218,7 @@ export function importWords() { } }, error: err => { - addMessage('Error Importing Words: ' + err); + addMessage('Error Importing Words: ' + err, undefined, 'error'); console.error('Error Importing Words: ', err); }, skipEmptyLines: true, diff --git a/src/js/hotkeys.js b/src/js/hotkeys.js index 9820277..7b92fa7 100644 --- a/src/js/hotkeys.js +++ b/src/js/hotkeys.js @@ -16,7 +16,7 @@ export function disableHotKeys() { export function hotKeyActions(event) { if (typeof event.key === 'undefined' || typeof event.ctrlKey === 'undefined' || typeof event.altKey === 'undefined') { - addMessage('Hotkeys disabled'); + addMessage('Hotkeys disabled', undefined, 'error'); console.warn('Browser does not have required event properties for hotkeys.'); window.settings.useHotkeys = false; saveSettings(); diff --git a/src/js/utilities.js b/src/js/utilities.js index bc70206..2631bb2 100644 --- a/src/js/utilities.js +++ b/src/js/utilities.js @@ -132,10 +132,13 @@ export function generateRandomWords(numberOfWords) { console.log('done'); } -export function addMessage(messageText, time = 5000) { +export function addMessage(messageText, time = 5000, extraClass = false) { const messagingSection = document.getElementById('messagingSection'); const element = document.createElement('div'); element.classList.add('message'); + if (extraClass !== false) { + element.classList.add(extraClass); + } element.innerHTML = '×︎' + messageText; messagingSection.appendChild(element); diff --git a/src/scss/_structure.scss b/src/scss/_structure.scss index 5ef75c7..bfeba50 100644 --- a/src/scss/_structure.scss +++ b/src/scss/_structure.scss @@ -328,7 +328,7 @@ $nav-font-height: 16px; position: fixed; bottom: $general-padding; right: $general-padding; - max-width: 250px; + max-width: 300px; .message { position: relative; @@ -343,6 +343,10 @@ $nav-font-height: 16px; margin-bottom: 0; } + &.error { + background-color: lighten($red, 0.75); + } + .close-button { position: absolute; top: 5px;