Clean up code

This commit is contained in:
Neil Brommer 2018-01-01 16:55:44 -08:00
parent f61b8110c3
commit 38c94b07bd
4 changed files with 155 additions and 141 deletions

View file

@ -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");
}
}
}

View file

@ -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;
}

View file

@ -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;
}

View file

@ -6,41 +6,31 @@ 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 (e) {
// the database doesn't exist
console.log("Creating database");
db = e.target.result;
openDBRequest.onupgradeneeded = function (openEvt) {
db = openEvt.target.result;
var groupStore = db.createObjectStore("Groups", { keyPath: "groupIndex" });
groupStore.createIndex("groupIndex", "groupIndex", { unique: true });
@ -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;
}