NewTabPage/js/editBookmarks.js

$(document).ready(function () {
	$("#btnEdit").click(toggleEditing);
});

function toggleEditing (e) {
	var btnEdit = $("#btnEdit");
	if (btnEdit.hasClass("btn-warning")) {
		$("#cardList").sortable("destroy");
		btnEdit.removeClass("btn-warning");
		$("#btnImport").prop("disabled", false);
		$("#btnAdd").prop("disabled", false);

		if ($("#btnAbout").hasClass("btn-light")) {
			btnEdit.addClass("btn-light");
		} else {
			btnEdit.addClass("btn-dark");
		}

		$(".btnDel").hide(200);
		$(".btnDelGroup").hide(200);
		$(".dragGroupHandle").hide(200);
		$(".bookmark").off("click", disableLink);
		$(".btnDel").off("click", deleteBookmark);
		$(".btnDelGroup").off("click", deleteGroup);
	} else {
		btnEdit.removeClass("btn-light btn-dark").addClass("btn-warning");
		$("#btnImport").prop("disabled", true);
		$("#btnAdd").prop("disabled", true);

		$("#cardList").sortable({
			group: { name: "bookmarksGroups" },
			draggable: ".bookmarkGroupContainer",
			handle: ".dragGroupHandle",
			animation: 100,
			onEnd: groupMoved
		});

		$(".btnDel").show(200);
		$(".btnDelGroup").show(200);
		$(".dragGroupHandle").show(200);
		$(".bookmark").click(disableLink);
		$(".btnDel").click(deleteBookmark);
		$(".btnDelGroup").click(deleteGroup);
	}
}

function groupMoved(dropEvt) {
	var newIndex = dropEvt.newIndex;
	var oldIndex = dropEvt.oldIndex;

	var movedCard = $($(dropEvt.item).children()[0]);
	var groupName = movedCard.data("group-name");
	var groupIndex = movedCard.data("group-index");

	if (oldIndex != newIndex) {
		var openDBRequest = window.indexedDB.open("bookmarks");

		openDBRequest.onsuccess = function (e) {
			var db = e.target.result;

			var groupsStore = db.transaction("Groups", "readwrite").objectStore("Groups");
			groupsStore.getAll().onsuccess = function (evt) {
				var groups = evt.target.result;

				for (let g of groups) {
					if (g.groupIndex > oldIndex && g.groupIndex <= newIndex) {
						g.groupIndex--;
						groupsStore.put(g);
					}
				}

				groups[oldIndex].groupIndex = newIndex;
				groupsStore.put(groups[oldIndex]);

				db.close();
			}
		}

		openDBRequest.onerror = function (err) { console.log(err); }
	}
}

function deleteBookmark(e) {
	var item = $(this);
	var group = item.data("group");
	var key = item.data("key");
	var groupIndex = item.data("group-index");

	var bookmarkItem = $("#" + group + "-" + key);

	var openDBRequest = window.indexedDB.open("bookmarks");

	openDBRequest.onsuccess = function (e) {
		var db = e.target.result;
		var groupsStore = db.transaction("Groups", "readwrite").objectStore("Groups");

		groupsStore.get(groupIndex).onsuccess = function (getEvt) {
			var groupData = getEvt.target.result;

			// remove the bookmark from the group object
			var bookmarkData = {name: bookmarkItem.data("name"), address: bookmarkItem.data("address")};
			groupData.bookmarks = groupData.bookmarks.filter(function (item) {
				if (item.name != bookmarkData.name && item.address != bookmarkData.address)
					return true;
				return false;
			});

			// no need to provide key since keyPath is set
			groupsStore.put(groupData);
			bookmarkItem.remove();
		}
	}

	openDBRequest.onerror = function (evt) {
		console.log("Error", evt);
		window.alert("There was an error deleting the bookmark");
	}
}

function deleteGroup(e) {
	var group = $(this); // the delete group button
	var groupIndex = group.data("group");

	var openDBRequest = window.indexedDB.open("bookmarks");

	openDBRequest.onsuccess = function (dbe) {
		var db = dbe.target.result;

		var groupsStore = db.transaction("Groups", "readwrite").objectStore("Groups");

		groupsStore.getAll().onsuccess = function (getEvt) {
			var groups = getEvt.target.result;

			var lastIndex = -1;
			for (let item of groups) {
				if (item.groupIndex > groupIndex) {
					lastIndex = item.groupIndex;
					item.groupIndex--;
					groupsStore.put(item);
				}
			}

			groupsStore.delete(lastIndex);
			loadBookmarks();
		}
	}

	openDBRequest.onerror = function (e) {
		console.error(e);
		window.alert("There was an error deleting the group");
	}
}

function disableLink(e) {
	e.preventDefault();
}