From 246cd65bd54ee4c3abefdc6838f1ac87408a42bd Mon Sep 17 00:00:00 2001
From: chris2fr <chris@mann.fr>
Date: Mon, 26 Oct 2020 05:31:51 +0100
Subject: [PATCH] Better control of Interest Keywords

---
 components/section_interests.js | 27 ++++++++++++++++++++++++++-
 index.html                      | 13 ++++++-------
 2 files changed, 32 insertions(+), 8 deletions(-)

diff --git a/components/section_interests.js b/components/section_interests.js
index 52a63c2..061c852 100644
--- a/components/section_interests.js
+++ b/components/section_interests.js
@@ -36,7 +36,7 @@ var sectionInterestsComponent = {
 		addKeyword: function(index)
 		{
 			var item = models.newDefaultInterestKeyword();
-			//console.log("addHighlight(" + index + ")", this.$root.sections.interests[index]);
+			//console.log("addKeyword(" + index + ")", this.$root.sections.interests[index]);
 			this.$root.sections.interests[index].keywords.push(item);
 		},
 
@@ -61,6 +61,31 @@ var sectionInterestsComponent = {
 		moveDownClicked: function(index)
 		{
 			this.$root.moveArrayPosition(this.$root.sections.interests, index, index + 1);
+		},
+
+
+	deleteClickedKeyword: function(kIndex, index)
+	{
+		var response = confirm("Are you sure you want to delete this keyword?");
+
+		if (response == true)
+		{
+			this.$root.sections.interests[kIndex].keywords.splice(index, 1);
 		}
+	},
+
+	moveUpClickedKeyword: function(kIndex,index)
+	{
+		if (index > 0)
+			this.$root.moveArrayPosition(this.$root.sections.interests[kIndex].keywords, index, index - 1);
+	},
+
+
+	moveDownClickedKeyword: function(kIndex,index)
+	{
+		if (index < this.$root.sections.interests[kIndex].keywords.length)
+			this.$root.moveArrayPosition(this.$root.sections.interests[kIndex].keywords, index, index + 1);
+	}
+
 	}
 };
\ No newline at end of file
diff --git a/index.html b/index.html
index c6dfa5d..b253ce0 100644
--- a/index.html
+++ b/index.html
@@ -537,10 +537,9 @@
     
                                 <button type="button" class="w3-btn w3-white w3-border w3-border-blue w3-round w3-padding-small" v-on:click="addCourse(e_index)">+ Add Course</button>
 
-                                
                                 <form class="margin-top-32" v-for="(course, c_index) in edu.courses">
                                     <simple-list-item v-bind:modelitem="$root.sections.education[e_index].courses" v-bind:id="c_index" v-on:delete-clicked="deleteClickedCourse(e_index,c_index)" v-on:move-up-clicked="moveUpClickedCourse(e_index,c_index)" v-on:move-down-clicked="moveDownClickedCourse(e_index,c_index)"></simple-list-item>
-                                    </form>
+                                </form>
                             </div>
                         </form>
                     </div>
@@ -777,11 +776,11 @@
                                 <small id="keywordsHelp" class="form-help text-muted">Keywords relating to the interest.</small>
     
                                 <button type="button" class="w3-btn w3-white w3-border w3-border-blue w3-round w3-padding-small" v-on:click="addKeyword(i_index)">+ Add Keyword</button>
-                                <ol>
-                                    <li v-for="(keyword, k_index) in interest.keywords">
-                                        <input id="keywords[0]" class="w3-input w3-border" type="text" v-model="$root.sections.interests[i_index].keywords[k_index]">
-                                    </li>
-                                </ol>
+                                
+                                <form class="margin-top-32" v-for="(keyword, k_index) in interest.keywords">
+                                    <simple-list-item v-bind:modelitem="$root.sections.interests[i_index].keywords" v-bind:id="k_index" v-on:delete-clicked="deleteClickedKeyword(i_index,k_index)" v-on:move-up-clicked="moveUpClickedKeyword(i_index,k_index)" v-on:move-down-clicked="moveDownClickedKeyword(i_index,k_index)"></simple-list-item>
+                                </form>
+                                
                             </div>
                         </form>
                     </div>