Fix create, delete and drop orphan tags

controller/notecontroller.php

@@ -145,6 +145,7 @@ class NoteController extends Controller {
 	 * @param int $id
 	 * @param string $title
 	 * @param string $content
+	 * @param array $tags
 	 * @param string $color
 	 */
 	public function update($id, $title, $content, $tags, $color = "#F7EB96") {
@@ -166,24 +167,31 @@ class NoteController extends Controller {
 		}
 
 		// Delete old tag relations
-		$noteTags = $this->tagmapper->getTagsForNote($this->userId, $id);
-		foreach ($noteTags as $tag) {
-			if (!in_array($tag->getName(), $tags)) {
-				$hnotetag = $this->notetagmapper->findNoteTag($this->userId, $id, $tag->getId());
+		$dbTags = $this->tagmapper->getTagsForNote($this->userId, $id);
+		foreach ($dbTags as $dbTag) {
+			$delete = true;
+			foreach ($tags as $tag) {
+				if ($dbTag->getId() == $tag['id']) {
+					$delete = false;
+					break;
+				}
+			}
+			if ($delete) {
+				$hnotetag = $this->notetagmapper->findNoteTag($this->userId, $id, $dbTag->getId());
 				$this->notetagmapper->delete($hnotetag);
 			}
 		}
 
 		// Add new tags and update relations.
-		foreach ($tags as $name) {
-			if (!$this->tagmapper->tagExists($this->userId, $name)) {
+		foreach ($tags as $tag) {
+			if (!$this->tagmapper->tagExists($this->userId, $tag['name'])) {
 				$htag = new Tag();
-				$htag->setName($name);
+				$htag->setName($tag['name']);
 				$htag->setUserId($this->userId);
 				$htag = $this->tagmapper->insert($htag);
 			}
 			else {
-				$htag = $this->tagmapper->getTag($this->userId, $name);
+				$htag = $this->tagmapper->getTag($this->userId, $tag['name']);
 			}
 
 			if (!$this->notetagmapper->noteTagExists($this->userId, $id, $htag->getId())) {
@@ -195,6 +203,9 @@ class NoteController extends Controller {
 			}
 		}
 
+		// Purge orphan tags.
+		$this->tagmapper->dropOld();
+
 		// Set new info on Note
 		$note->setTitle($title);
 		$note->setContent($content);

css/style.css

@@ -240,6 +240,10 @@ div[contenteditable="true"] {
     display: block !important;
 }
 
+.select2-results .select2-selected {
+    display: none !important;
+}
+
 .select2-container {
     min-width: 200px;
 }

db/tagmapper.php

@@ -43,4 +43,9 @@ class TagMapper extends Mapper {
 		return true;
 	}
 
+	public function dropOld () {
+		$sql = 'DELETE FROM *PREFIX*quicknotes_tags WHERE ';
+		$sql.= 'id NOT IN (SELECT tag_id FROM *PREFIX*quicknotes_note_tags)';
+		return $this->execute($sql, []);
+	}
 }

js/qn-dialogs.js

@@ -46,12 +46,19 @@ const QnDialogs = {
 			input.select2({
 				placeholder: t('quicknotes', 'Enter tag name'),
 				tokenSeparators: ',',
-				tags: currentTags.map(function (value) { return value.name; }),
+				multiple: false,
 				allowClear: true,
-				toggleSelect: true
+				toggleSelect: true,
+				tags : function () {
+					var data = [];
+					currentTags.forEach(function (item, index) {
+						data.push({id: item.id, text: item.name});
+					});
+					return data;
+				}
 			});
 
-			input.val(selectedTags.map(function (value) { return value.name; }));
+			input.val(selectedTags.map(function (value) { return value.id; }));
 			input.trigger("change");
 
 			// wrap callback in _.once():
@@ -66,7 +73,7 @@ const QnDialogs = {
 				click: function () {
 					input.select2('close');
 					if (callback !== undefined) {
-						callback(false, input.select2("val"));
+						callback(false, input.select2("data"));
 					}
 					$(dialogId).ocdialog('close');
 				}
@@ -75,7 +82,7 @@ const QnDialogs = {
 				click: function () {
 					input.select2('close');
 					if (callback !== undefined) {
-						callback(true, input.select2("val"));
+						callback(true, input.select2("data"));
 					}
 					$(dialogId).ocdialog('close');
 				},

js/script.js

@@ -330,7 +330,10 @@ View.prototype = {
         var content = $('#modal-note-div #content-editable').html().trim();
         var color = this.colorToHex($("#modal-note-div .quicknote").css("background-color"));
         var tags = $("#modal-note-div .slim-tag").toArray().map(function (value) {
-            return value.textContent.trim();
+            return {
+                id: value.getAttribute('data-id'),
+                name: value.textContent.trim()
+            };
         });
 
         /*
@@ -352,6 +355,7 @@ View.prototype = {
             var modalnote = $("#modal-note-div .quicknote");
             var modaltitle = $('#modal-note-div #title-editable');
             var modalcontent = $('#modal-note-div #content-editable');
+            var modaltags = $('#modal-note-div .note-tags');
 
             self._notes.unsetActive();
 
@@ -361,6 +365,7 @@ View.prototype = {
             modalnote.data('id', -1);
             modaltitle.html("");
             modalcontent.html("");
+            modaltags.html("");
 
             self.render();
         }).fail(function () {
@@ -632,7 +637,8 @@ View.prototype = {
                         var modalTags = $('#modal-note-div .note-tags');
                         modalTags.html('');
                         newTags.forEach(function (item, index) {
-                            var tag = $('<div class="slim-tag" data-id="-1">' + item + '</div>');
+                            var noteId = parseInt(item.id) || -1;
+                            var tag = $('<div class="slim-tag" data-id="' + noteId + '">' + item.text + '</div>');
                             modalTags.append(tag);
                         });
                     }