Add render funciton fo populate parts of speech

This commit is contained in:
Robbie Antenesse 2019-05-03 11:45:26 -06:00
parent 7b54e473e4
commit e4369f0ffd
2 changed files with 13 additions and 3 deletions

View File

@ -23,13 +23,13 @@
<input id="wordPronunciation"> <input id="wordPronunciation">
</label> </label>
<label>Part of Speech<br> <label>Part of Speech<br>
<select id="wordPartOfSpeech"></select> <select id="wordPartOfSpeech" class="part-of-speech-select"></select>
</label> </label>
<label>Definition<br> <label>Definition<br>
<input id="wordDefinition"> <input id="wordDefinition" placeholder="Equivalent words">
</label> </label>
<label>Details<a class="label-button">Maximize</a><br> <label>Details<a class="label-button">Maximize</a><br>
<textarea id="wordDetails"></textarea> <textarea id="wordDetails" placeholder="Markdown formatting allowed"></textarea>
</label> </label>
</form> </form>
</aside> </aside>

View File

@ -5,6 +5,7 @@ import { showSection } from './displayToggles';
export function renderAll() { export function renderAll() {
renderDictionaryDetails(); renderDictionaryDetails();
renderPartsOfSpeechSelect();
renderWords(); renderWords();
} }
@ -81,6 +82,15 @@ export function renderStats() {
detailsPanel.innerHTML = numberOfWordsHTML + wordLengthHTML + letterDistributionHTML + totalLettersHTML; detailsPanel.innerHTML = numberOfWordsHTML + wordLengthHTML + letterDistributionHTML + totalLettersHTML;
} }
export function renderPartsOfSpeechSelect() {
let optionsHTML = '<option value=""></option>';
window.currentDictionary.partsOfSpeech.forEach(partOfSpeech => {
partOfSpeech = removeTags(partOfSpeech);
optionsHTML += `<option value="${partOfSpeech}">${partOfSpeech}</option>`;
});
Array.from(document.getElementsByClassName('part-of-speech-select')).forEach(select => select.innerHTML = optionsHTML);
}
export function renderWords() { export function renderWords() {
const { words } = window.currentDictionary; const { words } = window.currentDictionary;
let wordsHTML = ''; let wordsHTML = '';