Add Prinipal Parts for words

src/constants.js

@@ -37,6 +37,7 @@ export const DEFAULT_DICTIONARY = {
       details: '',
       etymology: [],
       related: [],
+      principalParts: [],
       wordId: 0
     }, */
   ],

src/js/render/words.js

@@ -64,6 +64,8 @@ export function renderWords() {
           : originalWord.etymology.map(root => getWordReferenceMarkdown(removeTags(root))).join(', '),
         related: typeof originalWord.related === 'undefined' || originalWord.related.length < 1 ? null
           : originalWord.related.map(relatedWord => getWordReferenceMarkdown(removeTags(relatedWord))).join(', '),
+        principalParts: typeof originalWord.principalParts === 'undefined' || originalWord.principalParts.length < 1 ? null
+          : originalWord.principalParts.join(', '),
         wordId: originalWord.wordId,
       });
       const homonymnNumber = getHomonymnNumber(originalWord);
@@ -76,6 +78,7 @@ export function renderWords() {
       wordsHTML += `<article class="entry" id="${word.wordId}">
         <header>
           <h4 class="word"><span class="orthographic-translation">${wordNameDisplay}</span>${homonymnNumber > 0 ? ' <sub>' + homonymnNumber.toString() + '</sub>' : ''}</h4>
+          ${word.principalParts === null ? '' : `<span class="principalParts">(${word.principalParts})</span>`}
           <span class="pronunciation">${word.pronunciation}</span>
           <span class="part-of-speech">${word.partOfSpeech}</span>
           ${isPublic ? `<a class="small button share-link" href="${shareLink}" target="_blank" title="Public Link to Word">&#10150;</a>` : ''}
@@ -183,6 +186,9 @@ export function renderEditForm(wordId = false) {
         <label>Related Words<br>
           <input id="wordRelated_${wordId}" maxlength="2500" placeholder="comma,separated,related,words" value="${word.hasOwnProperty('related') ? word.related : ''}">
         </label>
+        <label>Principal Parts<a href="https://en.wikipedia.org/wiki/Principal_parts" target="_blank" class="label-button">What's This?</a><br>
+          <input id="wordPrincipalParts_${wordId}" maxlength="2500" placeholder="comma,separated,principal,parts" value="${word.hasOwnProperty('principalParts') ? word.principalParts : ''}">
+        </label>
       </div>
       <div id="wordErrorMessage_${wordId}"></div>
       <a class="button edit-save-changes" id="editWordButton_${wordId}">Save Changes</a>

src/js/wordManagement.js

@@ -183,7 +183,8 @@ export function submitWordForm() {
     definition = document.getElementById('wordDefinition').value,
     details = document.getElementById('wordDetails').value,
     etymology = document.getElementById('wordEtymology').value,
-    related = document.getElementById('wordRelated').value;
+    related = document.getElementById('wordRelated').value,
+    principalParts = document.getElementById('wordPrincipalParts').value;
 
   const word = {
     name: removeTags(name).trim(),
@@ -202,6 +203,10 @@ export function submitWordForm() {
     word.related = removeTags(related).split(',').map(w => w.trim()).filter(w => w.length > 0);
   }
 
+  if (removeTags(principalParts).trim() !== '') {
+    word.principalParts = removeTags(principalParts).split(',').map(w => w.trim()).filter(w => w.length > 0);
+  }
+
   if (validateWord(word)) {
     addWord(word);
     sortWords(true);
@@ -286,7 +291,8 @@ export function confirmEditWord(id) {
     definition = document.getElementById('wordDefinition_' + wordId).value,
     details = document.getElementById('wordDetails_' + wordId).value,
     etymology = document.getElementById('wordEtymology_' + wordId).value,
-    related = document.getElementById('wordRelated_' + wordId).value;
+    related = document.getElementById('wordRelated_' + wordId).value,
+    principalParts = document.getElementById('wordPrincipalParts_' + wordId).value;
 
   const word = {
     name: removeTags(name).trim(),
@@ -305,6 +311,10 @@ export function confirmEditWord(id) {
     word.related = removeTags(related).split(',').map(w => w.trim()).filter(w => w.length > 0);
   }
 
+  if (removeTags(principalParts).trim() !== '') {
+    word.principalParts = removeTags(principalParts).split(',').map(w => w.trim()).filter(w => w.length > 0);
+  }
+
   if (validateWord(word, wordId)) {
     if (confirm(`Are you sure you want to save changes to "${word.name}"?`)) {
       document.getElementById('editForm_' + wordId).classList.add('done');

src/php/api/Dictionary.php

@@ -215,8 +215,8 @@ WHERE dictionary=$dictionary";
   }
 
   public function getWords ($user, $dictionary) {
-    $query = "SELECT words.*, words_advanced.etymology, words_advanced.related FROM words
+    $query = "SELECT words.*, wa.etymology, wa.related, wa.principal_parts FROM words
-LEFT JOIN words_advanced ON words_advanced.dictionary = words.dictionary AND words_advanced.word_id = words.word_id
+LEFT JOIN words_advanced wa ON wa.dictionary = words.dictionary AND wa.word_id = words.word_id
 JOIN dictionaries ON dictionaries.id = words.dictionary
 WHERE words.dictionary=$dictionary AND dictionaries.user=$user";
     $results = $this->db->query($query)->fetchAll();
@@ -241,6 +241,10 @@ WHERE words.dictionary=$dictionary AND dictionaries.user=$user";
           $word['related'] = explode(',', $row['related']);
         }
 
+        if (!is_null($row['principal_parts']) && $row['principal_parts'] !== '') {
+          $word['principalParts'] = explode(',', $row['principal_parts']);
+        }
+
         return $word;
       }, $results);
     }
@@ -267,7 +271,7 @@ WHERE words.dictionary=$dictionary AND dictionaries.user=$user";
     }
 
     $query1 = 'INSERT INTO words (dictionary, word_id, name, pronunciation, part_of_speech, definition, details, last_updated, created_on) VALUES ';
-    $query2 = 'INSERT INTO words_advanced (dictionary, word_id, etymology, related) VALUES ';
+    $query2 = 'INSERT INTO words_advanced (dictionary, word_id, etymology, related, principal_parts) VALUES ';
     $params1 = array();
     $params2 = array();
     $word_ids = array();
@@ -289,11 +293,12 @@ WHERE words.dictionary=$dictionary AND dictionaries.user=$user";
       $params1[] = $last_updated;
       $params1[] = $word['createdOn'];
 
-      $query2 .= "(?, ?, ?, ?), ";
+      $query2 .= "(?, ?, ?, ?, ?), ";
       $params2[] = $dictionary;
       $params2[] = $word['wordId'];
       $params2[] = isset($word['etymology']) ? implode(',', $word['etymology']) : '';
       $params2[] = isset($word['related']) ? implode(',', $word['related']) : '';
+      $params2[] = isset($word['principalParts']) ? implode(',', $word['principalParts']) : '';
     }
     $query1 = trim($query1, ', ') . ' ON DUPLICATE KEY UPDATE
 name=VALUES(name),
@@ -305,7 +310,8 @@ last_updated=VALUES(last_updated),
 created_on=VALUES(created_on)';
     $query2 = trim($query2, ', ') . ' ON DUPLICATE KEY UPDATE
 etymology=VALUES(etymology),
-related=VALUES(related)';
+related=VALUES(related),
+principal_parts=VALUES(principal_parts)';
     
     $results1 = $this->db->execute($query1, $params1);
 

src/structure.sql

@@ -100,5 +100,6 @@ CREATE TABLE IF NOT EXISTS `words_advanced` (
   `word_id` int(11) NOT NULL,
   `etymology` text NOT NULL COMMENT 'Comma-separated',
   `related` text NOT NULL COMMENT 'Comma-separated',
+  `principal_parts` text NOT NULL COMMENT 'Comma-separated',
   UNIQUE KEY `dictionary_word_id` (`dictionary`,`word_id`)
 ) ENGINE=MyISAM DEFAULT CHARSET=utf8;

template-index.html

@@ -149,6 +149,9 @@
           <label>Related Words<br>
             <input id="wordRelated" maxlength="2500" placeholder="comma,separated,related,words">
           </label>
+          <label>Principal Parts<a href="https://en.wikipedia.org/wiki/Principal_parts" target="_blank" class="label-button">What's This?</a><br>
+            <input id="wordPrincipalParts" maxlength="2500" placeholder="comma,separated,principal,parts">
+          </label>
         </div>
         <div id="wordErrorMessage"></div>
         <a class="button" id="addWordButton">Add Word</a>