NeilBrommer/NewTabPage
1
0
Fork 0
Code Issues Pull requests Packages Projects Releases Wiki Activity

Clean up code

Browse source
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
Show stats Download patch file Download diff file Expand all files Collapse all files

85
js/addBookmarks.js
View file

@ -1,24 +1,41 @@
$(document).ready(function () { $(document).ready(function () {
$("#newBookmarkModal").on("shown.bs.modal", function () { $("#newBookmarkModal").on("shown.bs.modal", 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 })
.text(group.title));
}
$("#createGroup").prop("required", true);
});
$("#addBookmarkForm").submit(addNewBookmark); $("#addBookmarkForm").submit(addNewBookmark);
$("#newBookmarkGroup").on("change", selectGroupChanged); $("#newBookmarkGroup").on("change", selectGroupChanged);
}); });
function populateGroupList() {
var combo = $("#newBookmarkGroup");
combo.empty();
combo.append($("<option>").attr({ "value": "--" })
.text("New Group"));
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();
}
}
openDBRequest.onerror = function (err) {
console.error(err);
window.alert("Error building groups list");
}
}
function addNewBookmark(e) { function addNewBookmark(e) {
e.preventDefault(); e.preventDefault();
@ -31,42 +48,35 @@ function addNewBookmark(e) {
var newGroupName = $("#newBookMarkGroupNew").val(); var newGroupName = $("#newBookMarkGroupNew").val();
var openDBRequest = window.indexedDB.open("bookmarks"); var openDBRequest = window.indexedDB.open("bookmarks");
openDBRequest.onsuccess = function (e) { openDBRequest.onsuccess = function (openEvt) {
var db = e.target.result; var db = openEvt.target.result;
var groupsStore = db.transaction("Groups", "readwrite").objectStore("Groups"); var groupsStore = db.transaction("Groups", "readwrite").objectStore("Groups");
groupsStore.getAll().onsuccess = function (evt) { groupsStore.count().onsuccess = function (countEvt) {
// find the largest index and use that +1 var numGroups = countEvt.target.result;
var groups = evt.target.result;
var largest = -1;
for (var group of groups) {
if (group.groupIndex > largest)
largest = group.groupIndex;
}
var newGroup = { var newGroup = {
groupIndex: largest + 1, groupIndex: numGroups,
title: newGroupName, title: newGroupName,
bookmarks: [ { name: bkmkName, address: bkmkAddress } ] bookmarks: [ { name: bkmkName, address: bkmkAddress } ]
}; };
groupsStore.add(newGroup); groupsStore.add(newGroup);
// don't need to add to bookmarkList because loadBookmarks is
// being called
db.close(); db.close();
loadBookmarks(); 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 } else { // add to existing group
var openDBRequest = window.indexedDB.open("bookmarks"); var openDBRequest = window.indexedDB.open("bookmarks");
openDBRequest.onsuccess = function (e) { openDBRequest.onsuccess = function (openEvt) {
var db = e.target.result; var db = openEvt.target.result;
var groupsStore = db.transaction("Groups", "readwrite").objectStore("Groups"); var groupsStore = db.transaction("Groups", "readwrite").objectStore("Groups");
var groupReq = groupsStore.get(parseInt(bkmkGroup)); 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");
}
} }
} }

115
js/editBookmarks.js
View file

@ -2,7 +2,7 @@ $(document).ready(function () {
$("#btnEdit").click(toggleEditing); $("#btnEdit").click(toggleEditing);
}); });
function toggleEditing (e) { function toggleEditing () {
if ($("#btnEdit").hasClass("btn-warning")) if ($("#btnEdit").hasClass("btn-warning"))
disableEditing(); disableEditing();
else else
@ -15,17 +15,16 @@ function groupMoved(dropEvt) {
var movedCard = $($(dropEvt.item).children()[0]); var movedCard = $($(dropEvt.item).children()[0]);
var groupName = movedCard.data("group-name"); var groupName = movedCard.data("group-name");
var groupIndex = movedCard.data("group-index");
if (oldIndex != newIndex) { if (oldIndex != newIndex) {
var openDBRequest = window.indexedDB.open("bookmarks"); var openDBRequest = window.indexedDB.open("bookmarks");
openDBRequest.onsuccess = function (e) { openDBRequest.onsuccess = function (openEvt) {
var db = e.target.result; var db = openEvt.target.result;
var groupsStore = db.transaction("Groups", "readwrite").objectStore("Groups"); var groupsStore = db.transaction("Groups", "readwrite").objectStore("Groups");
groupsStore.getAll().onsuccess = function (evt) { groupsStore.getAll().onsuccess = function (getAllEvt) {
var groups = evt.target.result; var groups = getAllEvt.target.result;
if (newIndex > oldIndex) { if (newIndex > oldIndex) {
for (let g of groups) { for (let g of groups) {
@ -34,11 +33,11 @@ function groupMoved(dropEvt) {
groupsStore.put(g); groupsStore.put(g);
// modify the group's card // modify the group's card
var cardContainer = $("#group-" + (g.groupIndex + 1)); var cardContainer = $("#group-" + (g.groupIndex + 1))
cardContainer.attr("id", "group" + g.groupIndex); .attr("id", "group" + g.groupIndex);
var card = $(cardContainer.children()[0]); var card = $(cardContainer.children()[0])
card.attr("data-group-index", g.groupIndex); .attr("data-group-index", g.groupIndex);
} }
} }
} else { // oldIndex > newIndex } else { // oldIndex > newIndex
@ -57,23 +56,23 @@ function groupMoved(dropEvt) {
} }
} }
// update the moved group's data
var movedGroupData = groups[oldIndex]; var movedGroupData = groups[oldIndex];
movedGroupData.groupIndex = newIndex; movedGroupData.groupIndex = newIndex;
groupsStore.put(movedGroupData); groupsStore.put(movedGroupData);
// modify the group's card // update the group's card
var cardContainer = $("#group-" + oldIndex); $(dropEvt.item).attr("id", "group" + newIndex);
cardContainer.attr("id", "group" + newIndex); movedCard.attr("data-group-index", newIndex);
var card = $(cardContainer.children()[0]);
card.attr("data-group-index", newIndex);
db.close(); 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 itemData = {name: item.data("name"), address: item.data("address")};
var openDBRequest = window.indexedDB.open("bookmarks"); 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"); var groupsStore = db.transaction("Groups", "readwrite").objectStore("Groups");
groupsStore.getAll().onsuccess = function (gete) { groupsStore.getAll().onsuccess = function (getAllEvt) {
var groups = gete.target.result; var groups = getAllEvt.target.result;
var oldGroupData = groups[oldGroupIndex]; var oldGroupData = groups[oldGroupIndex];
var newGroupData = groups[newGroupIndex]; var newGroupData = groups[newGroupIndex];
@ -108,17 +108,22 @@ function bookmarkMoved(dropEvt) {
db.close(); 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) { } else if (oldIndex != newIndex) {
var groupIndex = $(dropEvt.from).parent().data("group-index"); var groupIndex = $(dropEvt.from).parent().data("group-index");
var openDBRequest = window.indexedDB.open("bookmarks"); 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"); var groupsStore = db.transaction("Groups", "readwrite").objectStore("Groups");
groupsStore.get(groupIndex).onsuccess = function (gete) { groupsStore.get(groupIndex).onsuccess = function (getEvt) {
var groupData = gete.target.result; var groupData = getEvt.target.result;
var item = groupData.bookmarks[oldIndex]; var item = groupData.bookmarks[oldIndex];
@ -129,7 +134,11 @@ function bookmarkMoved(dropEvt) {
db.close(); 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"); var openDBRequest = window.indexedDB.open("bookmarks");
openDBRequest.onsuccess = function (e) { openDBRequest.onsuccess = function (openEvt) {
var db = e.target.result; var db = openEvt.target.result;
var groupsStore = db.transaction("Groups", "readwrite").objectStore("Groups"); var groupsStore = db.transaction("Groups", "readwrite").objectStore("Groups");
groupsStore.get(groupIndex).onsuccess = function (getEvt) { groupsStore.get(groupIndex).onsuccess = function (getEvt) {
@ -153,28 +162,29 @@ function deleteBookmark(e) {
groupsStore.put(groupData); groupsStore.put(groupData);
bookmarkItem.hide(300, "swing", e => bookmarkItem.remove()); bookmarkItem.hide(300, "swing", e => bookmarkItem.remove());
db.close();
} }
} }
openDBRequest.onerror = function (evt) { openDBRequest.onerror = function (err) {
console.log("Error", evt); console.log("Error", err);
window.alert("There was an error deleting the bookmark"); window.alert("There was an error deleting the bookmark");
} }
} }
function deleteGroup(e) { function deleteGroup() {
var group = $(this); // the delete group button var group = $(this); // the delete group button
var groupIndex = group.parent().parent().data("group-index"); var groupIndex = group.parent().parent().data("group-index");
var openDBRequest = window.indexedDB.open("bookmarks"); var openDBRequest = window.indexedDB.open("bookmarks");
openDBRequest.onsuccess = function (dbe) { openDBRequest.onsuccess = function (openEvt) {
var db = dbe.target.result; var db = openEvt.target.result;
var groupsStore = db.transaction("Groups", "readwrite").objectStore("Groups"); var groupsStore = db.transaction("Groups", "readwrite").objectStore("Groups");
groupsStore.getAll().onsuccess = function (getEvt) { groupsStore.getAll().onsuccess = function (getAllEvt) {
var groups = getEvt.target.result; var groups = getAllEvt.target.result;
for (let item of groups) { for (let item of groups) {
if (item.groupIndex > groupIndex) { if (item.groupIndex > groupIndex) {
@ -199,8 +209,8 @@ function deleteGroup(e) {
} }
} }
openDBRequest.onerror = function (e) { openDBRequest.onerror = function (err) {
console.error(e); console.error(err);
window.alert("There was an error deleting the group"); window.alert("There was an error deleting the group");
} }
} }
@ -210,8 +220,8 @@ function enableEditing() {
$("#btnImport").prop("disabled", true); $("#btnImport").prop("disabled", true);
$("#btnAdd").prop("disabled", true); $("#btnAdd").prop("disabled", true);
$(".bookmarkGroup").each(function (index) { $(".bookmarkGroup").each(function (index, item) {
var item = $(this); var item = $(item);
item.sortable({ item.sortable({
group: { name: "bookmarkLists", pull: true, put: true }, group: { name: "bookmarkLists", pull: true, put: true },
draggable: ".bookmark", draggable: ".bookmark",
@ -239,8 +249,8 @@ function enableEditing() {
} }
function disableEditing() { function disableEditing() {
$(".bookmarkGroup").each(function (index) { $(".bookmarkGroup").each(function (index, item) {
$(this).sortable("destroy"); $(item).sortable("destroy");
}); });
$("#cardList").sortable("destroy"); $("#cardList").sortable("destroy");
@ -265,26 +275,27 @@ function disableEditing() {
function removeFromArray(arr, index) { function removeFromArray(arr, index) {
var newArr = []; var newArr = [];
for (var i = 0; i < arr.length; i++) { arr.forEach(function (item, i) {
if (i != index) if (i != index)
newArr.push(arr[i]); newArr.push(item);
} });
return newArr; return newArr;
} }
function addToArray(arr, item, index) { function addToArray(arr, itemToAdd, index) {
if (index == arr.length) { if (index == arr.length) {
arr.push(item); arr.push(item);
return arr; return arr;
} }
var newArr = []; var newArr = [];
for (var i = 0; i < arr.length; i++) { arr.forEach(function (item, i) {
if (i == index) if (i == index)
newArr.push(item); newArr.push(itemToAdd);
newArr.push(arr[i]); newArr.push(item);
} });
return newArr; return newArr;
} }

18
js/importExport.js
View file

@ -5,7 +5,7 @@ $(document).ready(function () {
$("#copyExport").click(copyExport); $("#copyExport").click(copyExport);
}); });
function showImportModal(e) { function showImportModal() {
$("#copyExportTxt").removeClass("text-success text-danger").addClass("text-muted").text("Copy"); $("#copyExportTxt").removeClass("text-success text-danger").addClass("text-muted").text("Copy");
$("#exportText").val(""); $("#exportText").val("");
$("#importText").val(""); $("#importText").val("");
@ -14,14 +14,16 @@ function showImportModal(e) {
function showBookmarkData() { function showBookmarkData() {
var openDBRequest = window.indexedDB.open("bookmarks"); var openDBRequest = window.indexedDB.open("bookmarks");
openDBRequest.onsuccess = function (e) { openDBRequest.onsuccess = function (openEvt) {
var db = e.target.result; var db = openEvt.target.result;
db.transaction("Groups").objectStore("Groups").getAll().onsuccess = function (evt) { db.transaction("Groups").objectStore("Groups").getAll().onsuccess = function (getAllEvt) {
var res = evt.target.result; var res = getAllEvt.target.result;
var data = JSON.stringify(res, null, 4); var data = JSON.stringify(res, null, 4);
$("#exportText").val(data); $("#exportText").val(data);
} }
db.close();
} }
} }
@ -29,7 +31,7 @@ function importBookmarks() {
try { try {
var newData = $.parseJSON($("#importText").val()); var newData = $.parseJSON($("#importText").val());
} catch (err) { } catch (err) {
console.error("Import failed: " + err.message); console.error(err);
window.alert("Invalid Format"); window.alert("Invalid Format");
return; return;
} }
@ -53,7 +55,7 @@ function setList(data) {
groupStore.clear(); groupStore.clear();
// create the object stores // create the object stores
for (group of data) { for (let group of data) {
groupStore.add(group); groupStore.add(group);
} }
@ -108,7 +110,7 @@ function validateBookmarks(bookmarks) {
} }
function arrayContains(array, searchFor) { function arrayContains(array, searchFor) {
for (item of array) { for (let item of array) {
if (item == searchFor) if (item == searchFor)
return true; return true;
} }

78
js/loadBookmarks.js
View file

@ -6,46 +6,36 @@ function loadBookmarks() {
$("#cardList").empty(); $("#cardList").empty();
var openDBRequest = window.indexedDB.open("bookmarks"); var openDBRequest = window.indexedDB.open("bookmarks");
openDBRequest.onsuccess = function (dbEvt) { openDBRequest.onsuccess = function (openEvt) {
db = dbEvt.target.result; db = openEvt.target.result;
dbVersion = db.version;
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; var groups = groupsEvt.target.result;
groups.sort(function (a, b) { groups.sort(function (a, b) {
return a.groupIndex - b.groupIndex; return a.groupIndex - b.groupIndex;
}); });
// use a placholder // use a placholder to prevent problems with sortable
var cardList = $("#cardList"); var cardList = $("#cardList");
for (let groupData of groups) { for (let groupData of groups) {
$("<div>").attr("id", "group-" + groupData.groupIndex) var placeholder = $("<div>").attr("id", "group-" + groupData.groupIndex)
.addClass("bookmarkGroupContainer") .addClass("bookmarkGroupContainer")
.appendTo(cardList); .appendTo(cardList);
} buildCard(groupData.title, groupData.groupIndex, groupData.bookmarks)
.appendTo(placeholder);
bookmarkList = [];
for (let groupData of groups) {
buildGroup(groupData, $("#group-" + groupData.groupIndex));
bookmarkList.push(groupData);
} }
db.close(); db.close();
}; };
} }
openDBRequest.onerror = function (e) { console.log(e); } openDBRequest.onupgradeneeded = function (openEvt) {
db = openEvt.target.result;
openDBRequest.onupgradeneeded = function (e) { var groupStore = db.createObjectStore("Groups", { keyPath: "groupIndex" });
// the database doesn't exist groupStore.createIndex("groupIndex", "groupIndex", { unique: true });
console.log("Creating database"); groupStore.createIndex("title", "title", { unique: false });
db = e.target.result; 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 = { var groupData = {
groupIndex: 0, groupIndex: 0,
@ -63,13 +53,15 @@ function loadBookmarks() {
}; };
groupStore.add(groupData); groupStore.add(groupData);
db.close();
$("#aboutModal").modal("show"); $("#aboutModal").modal("show");
} }
}
function buildGroup(groupInfo, placeholder) { openDBRequest.onerror = function (err) {
buildCard(groupInfo.title, groupInfo.groupIndex, groupInfo.bookmarks).appendTo(placeholder); console.log(err);
window.alert("Error loading bookmarks");
}
} }
function buildCard(title, groupIndex, itemList) { function buildCard(title, groupIndex, itemList) {
@ -81,26 +73,22 @@ function buildCard(title, groupIndex, itemList) {
"data-group-index": groupIndex "data-group-index": groupIndex
}); });
var cardHead = $("<div>"); var cardHead = $("<div>").addClass("card-header").text(title).appendTo(card);
cardHead.addClass("card-header"); $("<span>") // use wrapper, sortable has issues with <svg> dragHandle
cardHead.text(title); .addClass("mr-2 start-hidden dragGroupHandle")
var btnDrag = $("<span>").addClass("mr-2 start-hidden dragGroupHandle") .append($("<span>").addClass("fas fa-bars")) // move group icon
.append($("<span>").addClass("fas fa-bars")); .prependTo(cardHead);
var btnDel = $("<span>") $("<span>") // delete group button
.addClass("btnDelGroup far fa-trash-alt float-right mt-1 start-hidden text-danger clickable"); .addClass("btnDelGroup far fa-trash-alt float-right mt-1 start-hidden text-danger clickable")
btnDel.appendTo(cardHead); .appendTo(cardHead);
btnDrag.prependTo(cardHead);
card.append(cardHead);
var cardList = $("<div>"); var cardList = $("<div>")
cardList.addClass("list-group list-group-flush bookmarkGroup"); .addClass("list-group list-group-flush bookmarkGroup")
card.append(cardList); .appendTo(card);
for (var i = 0; i < itemList.length; i++) { itemList.forEach(function (item, i) {
var item = itemList[i]; var handle = $("<span>") // use wrapper, sortable has issues with <svg> dragHandle
// the fa span gets replaced with an svg element, which causes problems .addClass("mr-2 start-hidden dragHandle")
// with using it as a drag handle, so wrap it in the drag element
var handle = $("<span>").addClass("mr-2 start-hidden dragHandle")
.append($("<span>").addClass("fas fa-bars")); .append($("<span>").addClass("fas fa-bars"));
var del = $("<span>") var del = $("<span>")
@ -119,7 +107,7 @@ function buildCard(title, groupIndex, itemList) {
.prepend(handle) .prepend(handle)
.append(del) .append(del)
.appendTo(cardList); .appendTo(cardList);
} });
return card; return card;
} }