From e4369f0ffd36871625928544f2d945cbb8e59d0a Mon Sep 17 00:00:00 2001
From: Robbie Antenesse <dev@alamantus.com>
Date: Fri, 3 May 2019 11:45:26 -0600
Subject: [PATCH] Add render funciton fo populate parts of speech

---
 index.html       |  6 +++---
 src/js/render.js | 10 ++++++++++
 2 files changed, 13 insertions(+), 3 deletions(-)

diff --git a/index.html b/index.html
index b36a7e4..4019a06 100644
--- a/index.html
+++ b/index.html
@@ -23,13 +23,13 @@
           <input id="wordPronunciation">
         </label>
         <label>Part of Speech<br>
-          <select id="wordPartOfSpeech"></select>
+          <select id="wordPartOfSpeech" class="part-of-speech-select"></select>
         </label>
         <label>Definition<br>
-          <input id="wordDefinition">
+          <input id="wordDefinition" placeholder="Equivalent words">
         </label>
         <label>Details<a class="label-button">Maximize</a><br>
-          <textarea id="wordDetails"></textarea>
+          <textarea id="wordDetails" placeholder="Markdown formatting allowed"></textarea>
         </label>
       </form>
     </aside>
diff --git a/src/js/render.js b/src/js/render.js
index f2be93c..86563f5 100644
--- a/src/js/render.js
+++ b/src/js/render.js
@@ -5,6 +5,7 @@ import { showSection } from './displayToggles';
 
 export function renderAll() {
   renderDictionaryDetails();
+  renderPartsOfSpeechSelect();
   renderWords();
 }
 
@@ -81,6 +82,15 @@ export function renderStats() {
   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() {
   const { words } = window.currentDictionary;
   let wordsHTML = '';