Clean up code
This commit is contained in:
Neil Brommer
parent
f61b8110c3
commit
38c94b07bd
|
|
@ -1,23 +1,40 @@
|
|||
$(document).ready(function () {
|
||||
$("#newBookmarkModal").on("shown.bs.modal", function () {
|
||||
$("#newBookmarkModal").on("shown.bs.modal", populateGroupList);
|
||||
$("#addBookmarkForm").submit(addNewBookmark);
|
||||
$("#newBookmarkGroup").on("change", selectGroupChanged);
|
||||
});
|
||||
|
||||
function populateGroupList() {
|
||||
var combo = $("#newBookmarkGroup");
|
||||
combo.empty();
|
||||
combo.append($("<option>").attr({ "value": "--" })
|
||||
.text("New Group"));
|
||||
|
||||
for (let group of bookmarkList) {
|
||||
if (group != null)
|
||||
combo.append($("<option>").attr({ "value": group.groupIndex })
|
||||
var openDBRequest = window.indexedDB.open("bookmarks");
|
||||
|
||||
openDBRequest.onsuccess = function (openEvt) {
|
||||
var db = openEvt.target.result;
|
||||
var groupsStore = db.transaction("Groups", "readwrite").objectStore("Groups");
|
||||
|
||||
groupsStore.getAll().onsuccess = function (getAllEvt) {
|
||||
var groups = getAllEvt.target.result;
|
||||
|
||||
for (let group of groups) {
|
||||
combo.append($("<option>")
|
||||
.attr({ "value": group.groupIndex })
|
||||
.text(group.title));
|
||||
}
|
||||
|
||||
$("#createGroup").prop("required", true);
|
||||
});
|
||||
db.close();
|
||||
}
|
||||
}
|
||||
|
||||
$("#addBookmarkForm").submit(addNewBookmark);
|
||||
|
||||
$("#newBookmarkGroup").on("change", selectGroupChanged);
|
||||
});
|
||||
openDBRequest.onerror = function (err) {
|
||||
console.error(err);
|
||||
window.alert("Error building groups list");
|
||||
}
|
||||
}
|
||||
|
||||
function addNewBookmark(e) {
|
||||
e.preventDefault();
|
||||
|
|
@ -31,42 +48,35 @@ function addNewBookmark(e) {
|
|||
var newGroupName = $("#newBookMarkGroupNew").val();
|
||||
|
||||
var openDBRequest = window.indexedDB.open("bookmarks");
|
||||
openDBRequest.onsuccess = function (e) {
|
||||
var db = e.target.result;
|
||||
openDBRequest.onsuccess = function (openEvt) {
|
||||
var db = openEvt.target.result;
|
||||
var groupsStore = db.transaction("Groups", "readwrite").objectStore("Groups");
|
||||
|
||||
groupsStore.getAll().onsuccess = function (evt) {
|
||||
// find the largest index and use that +1
|
||||
var groups = evt.target.result;
|
||||
|
||||
var largest = -1;
|
||||
for (var group of groups) {
|
||||
if (group.groupIndex > largest)
|
||||
largest = group.groupIndex;
|
||||
}
|
||||
groupsStore.count().onsuccess = function (countEvt) {
|
||||
var numGroups = countEvt.target.result;
|
||||
|
||||
var newGroup = {
|
||||
groupIndex: largest + 1,
|
||||
groupIndex: numGroups,
|
||||
title: newGroupName,
|
||||
bookmarks: [ { name: bkmkName, address: bkmkAddress } ]
|
||||
};
|
||||
|
||||
groupsStore.add(newGroup);
|
||||
// don't need to add to bookmarkList because loadBookmarks is
|
||||
// being called
|
||||
|
||||
db.close();
|
||||
loadBookmarks();
|
||||
$(".modal").modal("hide");
|
||||
$("#newBookmarkModal").modal("hide");
|
||||
}
|
||||
}
|
||||
|
||||
openDBRequest.onerror = function (e) { console.log(e); }
|
||||
openDBRequest.onerror = function (err) {
|
||||
console.log(err);
|
||||
window.alert("There was an error creating the bookmark");
|
||||
}
|
||||
} else { // add to existing group
|
||||
var openDBRequest = window.indexedDB.open("bookmarks");
|
||||
openDBRequest.onsuccess = function (e) {
|
||||
var db = e.target.result;
|
||||
|
||||
openDBRequest.onsuccess = function (openEvt) {
|
||||
var db = openEvt.target.result;
|
||||
var groupsStore = db.transaction("Groups", "readwrite").objectStore("Groups");
|
||||
|
||||
var groupReq = groupsStore.get(parseInt(bkmkGroup));
|
||||
|
|
@ -83,7 +93,10 @@ function addNewBookmark(e) {
|
|||
}
|
||||
}
|
||||
|
||||
openDBRequest.onerror = function (e) { console.log(e); }
|
||||
openDBRequest.onerror = function (err) {
|
||||
console.log(err);
|
||||
window.alert("There was an error creating the bookmark");
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
|
|
|
|||
|
|
@ -2,7 +2,7 @@ $(document).ready(function () {
|
|||
$("#btnEdit").click(toggleEditing);
|
||||
});
|
||||
|
||||
function toggleEditing (e) {
|
||||
function toggleEditing () {
|
||||
if ($("#btnEdit").hasClass("btn-warning"))
|
||||
disableEditing();
|
||||
else
|
||||
|
|
@ -15,17 +15,16 @@ function groupMoved(dropEvt) {
|
|||
|
||||
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;
|
||||
openDBRequest.onsuccess = function (openEvt) {
|
||||
var db = openEvt.target.result;
|
||||
|
||||
var groupsStore = db.transaction("Groups", "readwrite").objectStore("Groups");
|
||||
groupsStore.getAll().onsuccess = function (evt) {
|
||||
var groups = evt.target.result;
|
||||
groupsStore.getAll().onsuccess = function (getAllEvt) {
|
||||
var groups = getAllEvt.target.result;
|
||||
|
||||
if (newIndex > oldIndex) {
|
||||
for (let g of groups) {
|
||||
|
|
@ -34,11 +33,11 @@ function groupMoved(dropEvt) {
|
|||
groupsStore.put(g);
|
||||
|
||||
// modify the group's card
|
||||
var cardContainer = $("#group-" + (g.groupIndex + 1));
|
||||
cardContainer.attr("id", "group" + g.groupIndex);
|
||||
var cardContainer = $("#group-" + (g.groupIndex + 1))
|
||||
.attr("id", "group" + g.groupIndex);
|
||||
|
||||
var card = $(cardContainer.children()[0]);
|
||||
card.attr("data-group-index", g.groupIndex);
|
||||
var card = $(cardContainer.children()[0])
|
||||
.attr("data-group-index", g.groupIndex);
|
||||
}
|
||||
}
|
||||
} else { // oldIndex > newIndex
|
||||
|
|
@ -57,23 +56,23 @@ function groupMoved(dropEvt) {
|
|||
}
|
||||
}
|
||||
|
||||
// update the moved group's data
|
||||
var movedGroupData = groups[oldIndex];
|
||||
|
||||
movedGroupData.groupIndex = newIndex;
|
||||
groupsStore.put(movedGroupData);
|
||||
|
||||
// modify the group's card
|
||||
var cardContainer = $("#group-" + oldIndex);
|
||||
cardContainer.attr("id", "group" + newIndex);
|
||||
|
||||
var card = $(cardContainer.children()[0]);
|
||||
card.attr("data-group-index", newIndex);
|
||||
// update the group's card
|
||||
$(dropEvt.item).attr("id", "group" + newIndex);
|
||||
movedCard.attr("data-group-index", newIndex);
|
||||
|
||||
db.close();
|
||||
}
|
||||
}
|
||||
|
||||
openDBRequest.onerror = function (err) { console.log(err); }
|
||||
openDBRequest.onerror = function (err) {
|
||||
console.log(err);
|
||||
window.alert("Error moving group");
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
|
|
@ -89,12 +88,13 @@ function bookmarkMoved(dropEvt) {
|
|||
var itemData = {name: item.data("name"), address: item.data("address")};
|
||||
|
||||
var openDBRequest = window.indexedDB.open("bookmarks");
|
||||
openDBRequest.onsuccess = function (dbe) {
|
||||
var db = dbe.target.result;
|
||||
|
||||
openDBRequest.onsuccess = function (openEvt) {
|
||||
var db = openEvt.target.result;
|
||||
var groupsStore = db.transaction("Groups", "readwrite").objectStore("Groups");
|
||||
|
||||
groupsStore.getAll().onsuccess = function (gete) {
|
||||
var groups = gete.target.result;
|
||||
groupsStore.getAll().onsuccess = function (getAllEvt) {
|
||||
var groups = getAllEvt.target.result;
|
||||
|
||||
var oldGroupData = groups[oldGroupIndex];
|
||||
var newGroupData = groups[newGroupIndex];
|
||||
|
|
@ -108,17 +108,22 @@ function bookmarkMoved(dropEvt) {
|
|||
db.close();
|
||||
}
|
||||
}
|
||||
openDBRequest.onerror = function (err) { console.error(err); }
|
||||
|
||||
openDBRequest.onerror = function (err) {
|
||||
console.error(err);
|
||||
window.alert("Error moving bookmark");
|
||||
}
|
||||
} else if (oldIndex != newIndex) {
|
||||
var groupIndex = $(dropEvt.from).parent().data("group-index");
|
||||
|
||||
var openDBRequest = window.indexedDB.open("bookmarks");
|
||||
openDBRequest.onsuccess = function (dbe) {
|
||||
var db = dbe.target.result;
|
||||
|
||||
openDBRequest.onsuccess = function (openEvt) {
|
||||
var db = openEvt.target.result;
|
||||
var groupsStore = db.transaction("Groups", "readwrite").objectStore("Groups");
|
||||
|
||||
groupsStore.get(groupIndex).onsuccess = function (gete) {
|
||||
var groupData = gete.target.result;
|
||||
groupsStore.get(groupIndex).onsuccess = function (getEvt) {
|
||||
var groupData = getEvt.target.result;
|
||||
|
||||
var item = groupData.bookmarks[oldIndex];
|
||||
|
||||
|
|
@ -129,7 +134,11 @@ function bookmarkMoved(dropEvt) {
|
|||
db.close();
|
||||
}
|
||||
}
|
||||
openDBRequest.onerror = function (err) { console.error(err); }
|
||||
|
||||
openDBRequest.onerror = function (err) {
|
||||
console.error(err);
|
||||
window.alert("Error moving bookmark");
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
|
|
@ -142,8 +151,8 @@ function deleteBookmark(e) {
|
|||
|
||||
var openDBRequest = window.indexedDB.open("bookmarks");
|
||||
|
||||
openDBRequest.onsuccess = function (e) {
|
||||
var db = e.target.result;
|
||||
openDBRequest.onsuccess = function (openEvt) {
|
||||
var db = openEvt.target.result;
|
||||
var groupsStore = db.transaction("Groups", "readwrite").objectStore("Groups");
|
||||
|
||||
groupsStore.get(groupIndex).onsuccess = function (getEvt) {
|
||||
|
|
@ -153,28 +162,29 @@ function deleteBookmark(e) {
|
|||
|
||||
groupsStore.put(groupData);
|
||||
bookmarkItem.hide(300, "swing", e => bookmarkItem.remove());
|
||||
|
||||
db.close();
|
||||
}
|
||||
}
|
||||
|
||||
openDBRequest.onerror = function (evt) {
|
||||
console.log("Error", evt);
|
||||
openDBRequest.onerror = function (err) {
|
||||
console.log("Error", err);
|
||||
window.alert("There was an error deleting the bookmark");
|
||||
}
|
||||
}
|
||||
|
||||
function deleteGroup(e) {
|
||||
function deleteGroup() {
|
||||
var group = $(this); // the delete group button
|
||||
var groupIndex = group.parent().parent().data("group-index");
|
||||
|
||||
var openDBRequest = window.indexedDB.open("bookmarks");
|
||||
|
||||
openDBRequest.onsuccess = function (dbe) {
|
||||
var db = dbe.target.result;
|
||||
|
||||
openDBRequest.onsuccess = function (openEvt) {
|
||||
var db = openEvt.target.result;
|
||||
var groupsStore = db.transaction("Groups", "readwrite").objectStore("Groups");
|
||||
|
||||
groupsStore.getAll().onsuccess = function (getEvt) {
|
||||
var groups = getEvt.target.result;
|
||||
groupsStore.getAll().onsuccess = function (getAllEvt) {
|
||||
var groups = getAllEvt.target.result;
|
||||
|
||||
for (let item of groups) {
|
||||
if (item.groupIndex > groupIndex) {
|
||||
|
|
@ -199,8 +209,8 @@ function deleteGroup(e) {
|
|||
}
|
||||
}
|
||||
|
||||
openDBRequest.onerror = function (e) {
|
||||
console.error(e);
|
||||
openDBRequest.onerror = function (err) {
|
||||
console.error(err);
|
||||
window.alert("There was an error deleting the group");
|
||||
}
|
||||
}
|
||||
|
|
@ -210,8 +220,8 @@ function enableEditing() {
|
|||
$("#btnImport").prop("disabled", true);
|
||||
$("#btnAdd").prop("disabled", true);
|
||||
|
||||
$(".bookmarkGroup").each(function (index) {
|
||||
var item = $(this);
|
||||
$(".bookmarkGroup").each(function (index, item) {
|
||||
var item = $(item);
|
||||
item.sortable({
|
||||
group: { name: "bookmarkLists", pull: true, put: true },
|
||||
draggable: ".bookmark",
|
||||
|
|
@ -239,8 +249,8 @@ function enableEditing() {
|
|||
}
|
||||
|
||||
function disableEditing() {
|
||||
$(".bookmarkGroup").each(function (index) {
|
||||
$(this).sortable("destroy");
|
||||
$(".bookmarkGroup").each(function (index, item) {
|
||||
$(item).sortable("destroy");
|
||||
});
|
||||
$("#cardList").sortable("destroy");
|
||||
|
||||
|
|
@ -265,26 +275,27 @@ function disableEditing() {
|
|||
|
||||
function removeFromArray(arr, index) {
|
||||
var newArr = [];
|
||||
for (var i = 0; i < arr.length; i++) {
|
||||
arr.forEach(function (item, i) {
|
||||
if (i != index)
|
||||
newArr.push(arr[i]);
|
||||
}
|
||||
newArr.push(item);
|
||||
});
|
||||
|
||||
return newArr;
|
||||
}
|
||||
|
||||
function addToArray(arr, item, index) {
|
||||
function addToArray(arr, itemToAdd, index) {
|
||||
if (index == arr.length) {
|
||||
arr.push(item);
|
||||
return arr;
|
||||
}
|
||||
|
||||
var newArr = [];
|
||||
for (var i = 0; i < arr.length; i++) {
|
||||
arr.forEach(function (item, i) {
|
||||
if (i == index)
|
||||
newArr.push(item);
|
||||
newArr.push(itemToAdd);
|
||||
|
||||
newArr.push(arr[i]);
|
||||
}
|
||||
newArr.push(item);
|
||||
});
|
||||
|
||||
return newArr;
|
||||
}
|
||||
|
|
|
|||
|
|
@ -5,7 +5,7 @@ $(document).ready(function () {
|
|||
$("#copyExport").click(copyExport);
|
||||
});
|
||||
|
||||
function showImportModal(e) {
|
||||
function showImportModal() {
|
||||
$("#copyExportTxt").removeClass("text-success text-danger").addClass("text-muted").text("Copy");
|
||||
$("#exportText").val("");
|
||||
$("#importText").val("");
|
||||
|
|
@ -14,14 +14,16 @@ function showImportModal(e) {
|
|||
function showBookmarkData() {
|
||||
var openDBRequest = window.indexedDB.open("bookmarks");
|
||||
|
||||
openDBRequest.onsuccess = function (e) {
|
||||
var db = e.target.result;
|
||||
openDBRequest.onsuccess = function (openEvt) {
|
||||
var db = openEvt.target.result;
|
||||
|
||||
db.transaction("Groups").objectStore("Groups").getAll().onsuccess = function (evt) {
|
||||
var res = evt.target.result;
|
||||
db.transaction("Groups").objectStore("Groups").getAll().onsuccess = function (getAllEvt) {
|
||||
var res = getAllEvt.target.result;
|
||||
var data = JSON.stringify(res, null, 4);
|
||||
$("#exportText").val(data);
|
||||
}
|
||||
|
||||
db.close();
|
||||
}
|
||||
}
|
||||
|
||||
|
|
@ -29,7 +31,7 @@ function importBookmarks() {
|
|||
try {
|
||||
var newData = $.parseJSON($("#importText").val());
|
||||
} catch (err) {
|
||||
console.error("Import failed: " + err.message);
|
||||
console.error(err);
|
||||
window.alert("Invalid Format");
|
||||
return;
|
||||
}
|
||||
|
|
@ -53,7 +55,7 @@ function setList(data) {
|
|||
groupStore.clear();
|
||||
|
||||
// create the object stores
|
||||
for (group of data) {
|
||||
for (let group of data) {
|
||||
groupStore.add(group);
|
||||
}
|
||||
|
||||
|
|
@ -108,7 +110,7 @@ function validateBookmarks(bookmarks) {
|
|||
}
|
||||
|
||||
function arrayContains(array, searchFor) {
|
||||
for (item of array) {
|
||||
for (let item of array) {
|
||||
if (item == searchFor)
|
||||
return true;
|
||||
}
|
||||
|
|
|
|||
|
|
@ -6,46 +6,36 @@ function loadBookmarks() {
|
|||
$("#cardList").empty();
|
||||
var openDBRequest = window.indexedDB.open("bookmarks");
|
||||
|
||||
openDBRequest.onsuccess = function (dbEvt) {
|
||||
db = dbEvt.target.result;
|
||||
dbVersion = db.version;
|
||||
openDBRequest.onsuccess = function (openEvt) {
|
||||
db = openEvt.target.result;
|
||||
|
||||
db.transaction(["Groups"], "readonly").objectStore("Groups").getAll().onsuccess = function (groupsEvt) {
|
||||
db.transaction("Groups", "readonly").objectStore("Groups").getAll().onsuccess = function (groupsEvt) {
|
||||
var groups = groupsEvt.target.result;
|
||||
groups.sort(function (a, b) {
|
||||
return a.groupIndex - b.groupIndex;
|
||||
});
|
||||
|
||||
// use a placholder
|
||||
// use a placholder to prevent problems with sortable
|
||||
var cardList = $("#cardList");
|
||||
for (let groupData of groups) {
|
||||
$("<div>").attr("id", "group-" + groupData.groupIndex)
|
||||
var placeholder = $("<div>").attr("id", "group-" + groupData.groupIndex)
|
||||
.addClass("bookmarkGroupContainer")
|
||||
.appendTo(cardList);
|
||||
}
|
||||
|
||||
bookmarkList = [];
|
||||
|
||||
for (let groupData of groups) {
|
||||
buildGroup(groupData, $("#group-" + groupData.groupIndex));
|
||||
bookmarkList.push(groupData);
|
||||
buildCard(groupData.title, groupData.groupIndex, groupData.bookmarks)
|
||||
.appendTo(placeholder);
|
||||
}
|
||||
|
||||
db.close();
|
||||
};
|
||||
}
|
||||
|
||||
openDBRequest.onerror = function (e) { console.log(e); }
|
||||
openDBRequest.onupgradeneeded = function (openEvt) {
|
||||
db = openEvt.target.result;
|
||||
|
||||
openDBRequest.onupgradeneeded = function (e) {
|
||||
// the database doesn't exist
|
||||
console.log("Creating database");
|
||||
db = e.target.result;
|
||||
|
||||
var groupStore = db.createObjectStore("Groups", {keyPath: "groupIndex"});
|
||||
groupStore.createIndex("groupIndex", "groupIndex", {unique: true});
|
||||
groupStore.createIndex("title", "title", {unique: false});
|
||||
groupStore.createIndex("bookmarks", "bookmarks", {unique: false});
|
||||
var groupStore = db.createObjectStore("Groups", { keyPath: "groupIndex" });
|
||||
groupStore.createIndex("groupIndex", "groupIndex", { unique: true });
|
||||
groupStore.createIndex("title", "title", { unique: false });
|
||||
groupStore.createIndex("bookmarks", "bookmarks", { unique: false });
|
||||
|
||||
var groupData = {
|
||||
groupIndex: 0,
|
||||
|
|
@ -63,13 +53,15 @@ function loadBookmarks() {
|
|||
};
|
||||
|
||||
groupStore.add(groupData);
|
||||
db.close();
|
||||
|
||||
$("#aboutModal").modal("show");
|
||||
}
|
||||
}
|
||||
|
||||
function buildGroup(groupInfo, placeholder) {
|
||||
buildCard(groupInfo.title, groupInfo.groupIndex, groupInfo.bookmarks).appendTo(placeholder);
|
||||
openDBRequest.onerror = function (err) {
|
||||
console.log(err);
|
||||
window.alert("Error loading bookmarks");
|
||||
}
|
||||
}
|
||||
|
||||
function buildCard(title, groupIndex, itemList) {
|
||||
|
|
@ -81,26 +73,22 @@ function buildCard(title, groupIndex, itemList) {
|
|||
"data-group-index": groupIndex
|
||||
});
|
||||
|
||||
var cardHead = $("<div>");
|
||||
cardHead.addClass("card-header");
|
||||
cardHead.text(title);
|
||||
var btnDrag = $("<span>").addClass("mr-2 start-hidden dragGroupHandle")
|
||||
.append($("<span>").addClass("fas fa-bars"));
|
||||
var btnDel = $("<span>")
|
||||
.addClass("btnDelGroup far fa-trash-alt float-right mt-1 start-hidden text-danger clickable");
|
||||
btnDel.appendTo(cardHead);
|
||||
btnDrag.prependTo(cardHead);
|
||||
card.append(cardHead);
|
||||
var cardHead = $("<div>").addClass("card-header").text(title).appendTo(card);
|
||||
$("<span>") // use wrapper, sortable has issues with <svg> dragHandle
|
||||
.addClass("mr-2 start-hidden dragGroupHandle")
|
||||
.append($("<span>").addClass("fas fa-bars")) // move group icon
|
||||
.prependTo(cardHead);
|
||||
$("<span>") // delete group button
|
||||
.addClass("btnDelGroup far fa-trash-alt float-right mt-1 start-hidden text-danger clickable")
|
||||
.appendTo(cardHead);
|
||||
|
||||
var cardList = $("<div>");
|
||||
cardList.addClass("list-group list-group-flush bookmarkGroup");
|
||||
card.append(cardList);
|
||||
var cardList = $("<div>")
|
||||
.addClass("list-group list-group-flush bookmarkGroup")
|
||||
.appendTo(card);
|
||||
|
||||
for (var i = 0; i < itemList.length; i++) {
|
||||
var item = itemList[i];
|
||||
// the fa span gets replaced with an svg element, which causes problems
|
||||
// with using it as a drag handle, so wrap it in the drag element
|
||||
var handle = $("<span>").addClass("mr-2 start-hidden dragHandle")
|
||||
itemList.forEach(function (item, i) {
|
||||
var handle = $("<span>") // use wrapper, sortable has issues with <svg> dragHandle
|
||||
.addClass("mr-2 start-hidden dragHandle")
|
||||
.append($("<span>").addClass("fas fa-bars"));
|
||||
|
||||
var del = $("<span>")
|
||||
|
|
@ -119,7 +107,7 @@ function buildCard(title, groupIndex, itemList) {
|
|||
.prepend(handle)
|
||||
.append(del)
|
||||
.appendTo(cardList);
|
||||
}
|
||||
});
|
||||
|
||||
return card;
|
||||
}
|
||||
|
|
|
|||
Loading…
Reference in a new issue