diff --git a/index.html b/index.html index b93d398..cfdb6b1 100644 --- a/index.html +++ b/index.html @@ -49,8 +49,8 @@
diff --git a/src/helpers.js b/src/helpers.js index b2d7e72..f3416c6 100644 --- a/src/helpers.js +++ b/src/helpers.js @@ -3,24 +3,26 @@ export function cloneObject(object) { } export function removeTags(html) { -var tagBody = '(?:[^"\'>]|"[^"]*"|\'[^\']*\')*'; - -var tagOrComment = new RegExp( - '<(?:' - // Comment body. - + '!--(?:(?:-*[^->])*--+|-?)' - // Special "raw text" elements whose content should be elided. - + '|script\\b' + tagBody + '>[\\s\\S]*?[\\s\\S]*?', - 'gi'); - var oldHtml; - do { - oldHtml = html; - html = html.replace(tagOrComment, ''); - } while (html !== oldHtml); - return html.replace(/]|"[^"]*"|\'[^\']*\')*'; + var tagOrComment = new RegExp( + '<(?:' + // Comment body. + + '!--(?:(?:-*[^->])*--+|-?)' + // Special "raw text" elements whose content should be elided. + + '|script\\b' + tagBody + '>[\\s\\S]*?[\\s\\S]*?', + 'gi'); + var oldHtml; + do { + oldHtml = html; + html = html.replace(tagOrComment, ''); + } while (html !== oldHtml); + return html.replace(/ { document.getElementById('searchModal').style.display = 'block'; }); +} + +function setupWordForm() { + const wordForm = document.getElementById('wordForm'), + addWordButton = document.getElementById('addWordButton'); + wordForm.addEventListener('submit', event => { + // Allow semantic form and prevent it from getting submitted + event.preventDefault(); + return false; + }); + addWordButton.addEventListener('click', () => { + const name = document.getElementById('wordName').value, + pronunciation = document.getElementById('wordPronunciation').value, + partOfSpeech = document.getElementById('wordPartOfSpeech').value, + definition = document.getElementById('wordDefinition').value, + details = document.getElementById('wordDetails').value; + + const word = { + name: removeTags(name).trim(), + pronunciation: removeTags(pronunciation).trim(), + partOfSpeech: removeTags(partOfSpeech).trim(), + simpleDefinition: removeTags(definition).trim(), + longDefinition: removeTags(details).trim(), + wordId: getNextId(), + }; + + if (validateWord(word)) { + addWord(word); + } + }); } \ No newline at end of file diff --git a/src/js/utilities.js b/src/js/utilities.js index 7ae88c6..2069806 100644 --- a/src/js/utilities.js +++ b/src/js/utilities.js @@ -1,5 +1,12 @@ import { cloneObject } from '../helpers'; +export function getNextId() { + const lastId = window.currentDictionary.words.reduce((highestId, word) => { + return (word.wordId && word.wordId) > highestId ? word.wordId : highestId; + }, 0); + return lastId + 1; +} + export function getWordsStats() { const {words, partsOfSpeech} = window.currentDictionary; const {caseSensitive} = window.currentDictionary.settings; diff --git a/src/js/wordManagement.js b/src/js/wordManagement.js new file mode 100644 index 0000000..2139c4a --- /dev/null +++ b/src/js/wordManagement.js @@ -0,0 +1,39 @@ +import { renderWords } from "./render"; +import { wordExists } from "./utilities"; + +export function validateWord(word, wordId = false) { + const errorElementId = wordId === false ? 'wordErrorMessage' : 'wordErrorMessage_' + wordId, + errorElement = document.getElementById(errorElementId); + let errorMessage = ''; + + if (word.name === '') { + errorMessage += '

Word field must not be blank.

'; + } + if (word.simpleDefinition === '' && word.longDefinition === '') { + errorMessage += '

You must enter Definition or Details.

'; + } + + const { allowDuplicates, caseSensitive } = window.currentDictionary.settings; + if (!allowDuplicates) { + const foundDuplicate = wordExists(word.name, true); + if (foundDuplicate !== false) { + errorMessage += `

"${word.name}" already exists, and "Allow Duplicates" is turned off.${!caseSensitive ? ' (Case sensitivity is turned also off)' : ''}

`; + } + } + + errorElement.innerHTML = errorMessage; + return errorMessage === ''; +} + +export function addWord(word) { + const { sortByDefinition } = window.currentDictionary.settings; + const sortBy = sortByDefinition ? 'simpleDefinition' : 'name'; + + window.currentDictionary.words.push(word); + window.currentDictionary.words.sort((wordA, wordB) => { + if (wordA[sortBy] === wordB[sortBy]) return 0; + return wordA[sortBy] > wordB[sortBy] ? 1 : -1; + }); + + renderWords(); +} diff --git a/src/styles/_elements.scss b/src/styles/_elements.scss index 7399bb9..f5e451d 100644 --- a/src/styles/_elements.scss +++ b/src/styles/_elements.scss @@ -1,3 +1,13 @@ +p, span { + &.red { + color: $red; + } + + &.bold { + font-weight: bold; + } +} + .tag { padding: 3px 9px; border: $border; diff --git a/src/styles/_structure.scss b/src/styles/_structure.scss index 954ea68..8bc4531 100644 --- a/src/styles/_structure.scss +++ b/src/styles/_structure.scss @@ -51,6 +51,8 @@ background-color: $light; border: $border; border-radius: 5px; + max-height: 80%; + overflow-y: auto; label { display: block;