aboutsummaryrefslogtreecommitdiffhomepage
path: root/ui/static/js
diff options
context:
space:
mode:
Diffstat (limited to 'ui/static/js')
-rw-r--r--ui/static/js/app.js464
-rw-r--r--ui/static/js/bootstrap.js103
-rw-r--r--ui/static/js/confirm_handler.js2
-rw-r--r--ui/static/js/entry_handler.js100
-rw-r--r--ui/static/js/feed_handler.js7
-rw-r--r--ui/static/js/form_handler.js15
-rw-r--r--ui/static/js/link_state_handler.js10
-rw-r--r--ui/static/js/menu_handler.js27
-rw-r--r--ui/static/js/mouse_handler.js14
-rw-r--r--ui/static/js/nav_handler.js253
-rw-r--r--ui/static/js/touch_handler.js29
-rw-r--r--ui/static/js/unread_counter_handler.js33
12 files changed, 521 insertions, 536 deletions
diff --git a/ui/static/js/app.js b/ui/static/js/app.js
new file mode 100644
index 0000000..93fd661
--- /dev/null
+++ b/ui/static/js/app.js
@@ -0,0 +1,464 @@
+// OnClick attaches a listener to the elements that match the selector.
+function onClick(selector, callback, noPreventDefault) {
+ let elements = document.querySelectorAll(selector);
+ elements.forEach((element) => {
+ element.onclick = (event) => {
+ if (!noPreventDefault) {
+ event.preventDefault();
+ }
+
+ callback(event);
+ };
+ });
+}
+
+// Show and hide the main menu on mobile devices.
+function toggleMainMenu() {
+ let menu = document.querySelector(".header nav ul");
+ if (DomHelper.isVisible(menu)) {
+ menu.style.display = "none";
+ } else {
+ menu.style.display = "block";
+ }
+
+ let searchElement = document.querySelector(".header .search");
+ if (DomHelper.isVisible(searchElement)) {
+ searchElement.style.display = "none";
+ } else {
+ searchElement.style.display = "block";
+ }
+}
+
+// Handle click events for the main menu (<li> and <a>).
+function onClickMainMenuListItem(event) {
+ let element = event.target;
+
+ if (element.tagName === "A") {
+ window.location.href = element.getAttribute("href");
+ } else {
+ window.location.href = element.querySelector("a").getAttribute("href");
+ }
+}
+
+// Change the button label when the page is loading.
+function handleSubmitButtons() {
+ let elements = document.querySelectorAll("form");
+ elements.forEach((element) => {
+ element.onsubmit = () => {
+ let button = document.querySelector("button");
+
+ if (button) {
+ button.innerHTML = button.dataset.labelLoading;
+ button.disabled = true;
+ }
+ };
+ });
+}
+
+// Set cursor focus to the search input.
+function setFocusToSearchInput(event) {
+ event.preventDefault();
+ event.stopPropagation();
+
+ let toggleSwitchElement = document.querySelector(".search-toggle-switch");
+ if (toggleSwitchElement) {
+ toggleSwitchElement.style.display = "none";
+ }
+
+ let searchFormElement = document.querySelector(".search-form");
+ if (searchFormElement) {
+ searchFormElement.style.display = "block";
+ }
+
+ let searchInputElement = document.getElementById("search-input");
+ if (searchInputElement) {
+ searchInputElement.focus();
+ searchInputElement.value = "";
+ }
+}
+
+// Show modal dialog with the list of keyboard shortcuts.
+function showKeyboardShortcuts() {
+ let template = document.getElementById("keyboard-shortcuts");
+ if (template !== null) {
+ ModalHandler.open(template.content);
+ }
+}
+
+// Mark as read visible items of the current page.
+function markPageAsRead() {
+ let items = DomHelper.getVisibleElements(".items .item");
+ let entryIDs = [];
+
+ items.forEach((element) => {
+ element.classList.add("item-status-read");
+ entryIDs.push(parseInt(element.dataset.id, 10));
+ });
+
+ if (entryIDs.length > 0) {
+ updateEntriesStatus(entryIDs, "read", () => {
+ // Make sure the Ajax request reach the server before we reload the page.
+
+ let element = document.querySelector("a[data-mark-page-as-read]");
+ let showOnlyUnread = false;
+ if (element) {
+ showOnlyUnread = element.dataset.showOnlyUnread;
+ }
+
+ if (showOnlyUnread) {
+ window.location.reload();
+ } else {
+ goToPage("next", true);
+ }
+ });
+ }
+}
+
+// Handle entry status changes from the list view and entry view.
+function handleEntryStatus() {
+ if (isListView()) {
+ let currentItem = document.querySelector(".current-item");
+ if (currentItem !== null) {
+ // The order is important here,
+ // On the unread page, the read item will be hidden.
+ goToNextListItem();
+ toggleEntryStatus(currentItem);
+ }
+ } else {
+ toggleEntryStatus(document.querySelector(".entry"));
+ }
+}
+
+// Change the entry status to the opposite value.
+function toggleEntryStatus(element) {
+ let entryID = parseInt(element.dataset.id, 10);
+ let link = element.querySelector("a[data-toggle-status]");
+
+ let currentStatus = link.dataset.value;
+ let newStatus = currentStatus === "read" ? "unread" : "read";
+
+ updateEntriesStatus([entryID], newStatus);
+
+ if (currentStatus === "read") {
+ link.innerHTML = link.dataset.labelRead;
+ link.dataset.value = "unread";
+ } else {
+ link.innerHTML = link.dataset.labelUnread;
+ link.dataset.value = "read";
+ }
+
+ if (element.classList.contains("item-status-" + currentStatus)) {
+ element.classList.remove("item-status-" + currentStatus);
+ element.classList.add("item-status-" + newStatus);
+ }
+}
+
+// Mark a single entry as read.
+function markEntryAsRead(element) {
+ if (element.classList.contains("item-status-unread")) {
+ element.classList.remove("item-status-unread");
+ element.classList.add("item-status-read");
+
+ let entryID = parseInt(element.dataset.id, 10);
+ updateEntriesStatus([entryID], "read");
+ }
+}
+
+// Send the Ajax request to change entries statuses.
+function updateEntriesStatus(entryIDs, status, callback) {
+ let url = document.body.dataset.entriesStatusUrl;
+ let request = new RequestBuilder(url);
+ request.withBody({ entry_ids: entryIDs, status: status });
+ request.withCallback(callback);
+ request.execute();
+
+ if (status === "read") {
+ decrementUnreadCounter(1);
+ } else {
+ incrementUnreadCounter(1);
+ }
+}
+
+// Handle save entry from list view and entry view.
+function handleSaveEntry() {
+ if (isListView()) {
+ let currentItem = document.querySelector(".current-item");
+ if (currentItem !== null) {
+ saveEntry(currentItem.querySelector("a[data-save-entry]"));
+ }
+ } else {
+ saveEntry(document.querySelector("a[data-save-entry]"));
+ }
+}
+
+// Send the Ajax request to save an entry.
+function saveEntry(element) {
+ if (!element) {
+ return;
+ }
+
+ if (element.dataset.completed) {
+ return;
+ }
+
+ element.innerHTML = element.dataset.labelLoading;
+
+ let request = new RequestBuilder(element.dataset.saveUrl);
+ request.withCallback(() => {
+ element.innerHTML = element.dataset.labelDone;
+ element.dataset.completed = true;
+ });
+ request.execute();
+}
+
+// Handle bookmark from the list view and entry view.
+function handleBookmark() {
+ if (isListView()) {
+ let currentItem = document.querySelector(".current-item");
+ if (currentItem !== null) {
+ toggleBookmark(currentItem);
+ }
+ } else {
+ toggleBookmark(document.querySelector(".entry"));
+ }
+}
+
+// Send the Ajax request and change the icon when bookmarking an entry.
+function toggleBookmark(parentElement) {
+ let element = parentElement.querySelector("a[data-toggle-bookmark]");
+ if (!element) {
+ return;
+ }
+
+ element.innerHTML = element.dataset.labelLoading;
+
+ let request = new RequestBuilder(element.dataset.bookmarkUrl);
+ request.withCallback(() => {
+ if (element.dataset.value === "star") {
+ element.innerHTML = element.dataset.labelStar;
+ element.dataset.value = "unstar";
+ } else {
+ element.innerHTML = element.dataset.labelUnstar;
+ element.dataset.value = "star";
+ }
+ });
+ request.execute();
+}
+
+// Send the Ajax request to download the original web page.
+function handleFetchOriginalContent() {
+ if (isListView()) {
+ return;
+ }
+
+ let element = document.querySelector("a[data-fetch-content-entry]");
+ if (!element) {
+ return;
+ }
+
+ if (element.dataset.completed) {
+ return;
+ }
+
+ element.innerHTML = element.dataset.labelLoading;
+
+ let request = new RequestBuilder(element.dataset.fetchContentUrl);
+ request.withCallback((response) => {
+ element.innerHTML = element.dataset.labelDone;
+ element.dataset.completed = true;
+
+ response.json().then((data) => {
+ if (data.hasOwnProperty("content")) {
+ document.querySelector(".entry-content").innerHTML = data.content;
+ }
+ });
+ });
+ request.execute();
+}
+
+function openOriginalLink() {
+ let entryLink = document.querySelector(".entry h1 a");
+ if (entryLink !== null) {
+ DomHelper.openNewTab(entryLink.getAttribute("href"));
+ return;
+ }
+
+ let currentItemOriginalLink = document.querySelector(".current-item a[data-original-link]");
+ if (currentItemOriginalLink !== null) {
+ DomHelper.openNewTab(currentItemOriginalLink.getAttribute("href"));
+
+ // Move to the next item and if we are on the unread page mark this item as read.
+ let currentItem = document.querySelector(".current-item");
+ goToNextListItem();
+ markEntryAsRead(currentItem);
+ }
+}
+
+function openSelectedItem() {
+ let currentItemLink = document.querySelector(".current-item .item-title a");
+ if (currentItemLink !== null) {
+ window.location.href = currentItemLink.getAttribute("href");
+ }
+}
+
+function unsubscribeFromFeed() {
+ let unsubscribeLinks = document.querySelectorAll("[data-action=remove-feed]");
+ if (unsubscribeLinks.length === 1) {
+ let unsubscribeLink = unsubscribeLinks[0];
+
+ let request = new RequestBuilder(unsubscribeLink.dataset.url);
+ request.withCallback(() => {
+ if (unsubscribeLink.dataset.redirectUrl) {
+ window.location.href = unsubscribeLink.dataset.redirectUrl;
+ } else {
+ window.location.reload();
+ }
+ });
+ request.execute();
+ }
+}
+
+/**
+ * @param {string} page Page to redirect to.
+ * @param {boolean} fallbackSelf Refresh actual page if the page is not found.
+ */
+function goToPage(page, fallbackSelf) {
+ let element = document.querySelector("a[data-page=" + page + "]");
+
+ if (element) {
+ document.location.href = element.href;
+ } else if (fallbackSelf) {
+ window.location.reload();
+ }
+}
+
+function goToPrevious() {
+ if (isListView()) {
+ goToPreviousListItem();
+ } else {
+ goToPage("previous");
+ }
+}
+
+function goToNext() {
+ if (isListView()) {
+ goToNextListItem();
+ } else {
+ goToPage("next");
+ }
+}
+
+function goToFeedOrFeeds() {
+ if (isEntry()) {
+ let feedAnchor = document.querySelector("span.entry-website a");
+ if (feedAnchor !== null) {
+ window.location.href = feedAnchor.href;
+ }
+ } else {
+ goToPage('feeds');
+ }
+}
+
+function goToPreviousListItem() {
+ let items = DomHelper.getVisibleElements(".items .item");
+ if (items.length === 0) {
+ return;
+ }
+
+ if (document.querySelector(".current-item") === null) {
+ items[0].classList.add("current-item");
+ items[0].querySelector('.item-header a').focus();
+ return;
+ }
+
+ for (let i = 0; i < items.length; i++) {
+ if (items[i].classList.contains("current-item")) {
+ items[i].classList.remove("current-item");
+
+ if (i - 1 >= 0) {
+ items[i - 1].classList.add("current-item");
+ DomHelper.scrollPageTo(items[i - 1]);
+ items[i - 1].querySelector('.item-header a').focus();
+ }
+
+ break;
+ }
+ }
+}
+
+function goToNextListItem() {
+ let currentItem = document.querySelector(".current-item");
+ let items = DomHelper.getVisibleElements(".items .item");
+ if (items.length === 0) {
+ return;
+ }
+
+ if (currentItem === null) {
+ items[0].classList.add("current-item");
+ items[0].querySelector('.item-header a').focus();
+ return;
+ }
+
+ for (let i = 0; i < items.length; i++) {
+ if (items[i].classList.contains("current-item")) {
+ items[i].classList.remove("current-item");
+
+ if (i + 1 < items.length) {
+ items[i + 1].classList.add("current-item");
+ DomHelper.scrollPageTo(items[i + 1]);
+ items[i + 1].querySelector('.item-header a').focus();
+ }
+
+ break;
+ }
+ }
+}
+
+function decrementUnreadCounter(n) {
+ updateUnreadCounterValue((current) => {
+ return current - n;
+ });
+}
+
+function incrementUnreadCounter(n) {
+ updateUnreadCounterValue((current) => {
+ return current + n;
+ });
+}
+
+function updateUnreadCounterValue(callback) {
+ let counterElements = document.querySelectorAll("span.unread-counter");
+ counterElements.forEach((element) => {
+ let oldValue = parseInt(element.textContent, 10);
+ element.innerHTML = callback(oldValue);
+ });
+
+ if (window.location.href.endsWith('/unread')) {
+ let oldValue = parseInt(document.title.split('(')[1], 10);
+ let newValue = callback(oldValue);
+
+ document.title = document.title.replace(
+ /(.*?)\(\d+\)(.*?)/,
+ function (match, prefix, suffix, offset, string) {
+ return prefix + '(' + newValue + ')' + suffix;
+ }
+ );
+ }
+}
+
+function isEntry() {
+ return document.querySelector("section.entry") !== null;
+}
+
+function isListView() {
+ return document.querySelector(".items") !== null;
+}
+
+function flipElementState(element) {
+ let labelElement = document.createElement("span");
+ labelElement.className = "link-flipped-state";
+ labelElement.appendChild(document.createTextNode(element.dataset.labelNewState));
+
+ element.parentNode.appendChild(labelElement);
+ element.parentNode.removeChild(element);
+}
diff --git a/ui/static/js/bootstrap.js b/ui/static/js/bootstrap.js
index 4502c51..d07da56 100644
--- a/ui/static/js/bootstrap.js
+++ b/ui/static/js/bootstrap.js
@@ -1,88 +1,67 @@
-document.addEventListener("DOMContentLoaded", function() {
- FormHandler.handleSubmitButtons();
+document.addEventListener("DOMContentLoaded", function () {
+ handleSubmitButtons();
- let navHandler = new NavHandler();
-
- if (! document.querySelector("body[data-disable-keyboard-shortcuts=true]")) {
+ if (!document.querySelector("body[data-disable-keyboard-shortcuts=true]")) {
let keyboardHandler = new KeyboardHandler();
- keyboardHandler.on("g u", () => navHandler.goToPage("unread"));
- keyboardHandler.on("g b", () => navHandler.goToPage("starred"));
- keyboardHandler.on("g h", () => navHandler.goToPage("history"));
- keyboardHandler.on("g f", () => navHandler.goToFeedOrFeeds());
- keyboardHandler.on("g c", () => navHandler.goToPage("categories"));
- keyboardHandler.on("g s", () => navHandler.goToPage("settings"));
- keyboardHandler.on("ArrowLeft", () => navHandler.goToPrevious());
- keyboardHandler.on("ArrowRight", () => navHandler.goToNext());
- keyboardHandler.on("k", () => navHandler.goToPrevious());
- keyboardHandler.on("p", () => navHandler.goToPrevious());
- keyboardHandler.on("j", () => navHandler.goToNext());
- keyboardHandler.on("n", () => navHandler.goToNext());
- keyboardHandler.on("h", () => navHandler.goToPage("previous"));
- keyboardHandler.on("l", () => navHandler.goToPage("next"));
- keyboardHandler.on("o", () => navHandler.openSelectedItem());
- keyboardHandler.on("v", () => navHandler.openOriginalLink());
- keyboardHandler.on("m", () => navHandler.toggleEntryStatus());
- keyboardHandler.on("A", () => {
- let element = document.querySelector("a[data-mark-page-as-read]");
- navHandler.markPageAsRead(element.dataset.showOnlyUnread || false);
- });
- keyboardHandler.on("s", () => navHandler.saveEntry());
- keyboardHandler.on("d", () => navHandler.fetchOriginalContent());
- keyboardHandler.on("f", () => navHandler.toggleBookmark());
- keyboardHandler.on("?", () => navHandler.showKeyboardShortcuts());
- keyboardHandler.on("#", () => navHandler.unsubscribeFromFeed());
- keyboardHandler.on("/", (e) => navHandler.setFocusToSearchInput(e));
+ keyboardHandler.on("g u", () => goToPage("unread"));
+ keyboardHandler.on("g b", () => goToPage("starred"));
+ keyboardHandler.on("g h", () => goToPage("history"));
+ keyboardHandler.on("g f", () => goToFeedOrFeeds());
+ keyboardHandler.on("g c", () => goToPage("categories"));
+ keyboardHandler.on("g s", () => goToPage("settings"));
+ keyboardHandler.on("ArrowLeft", () => goToPrevious());
+ keyboardHandler.on("ArrowRight", () => goToNext());
+ keyboardHandler.on("k", () => goToPrevious());
+ keyboardHandler.on("p", () => goToPrevious());
+ keyboardHandler.on("j", () => goToNext());
+ keyboardHandler.on("n", () => goToNext());
+ keyboardHandler.on("h", () => goToPage("previous"));
+ keyboardHandler.on("l", () => goToPage("next"));
+ keyboardHandler.on("o", () => openSelectedItem());
+ keyboardHandler.on("v", () => openOriginalLink());
+ keyboardHandler.on("m", () => handleEntryStatus());
+ keyboardHandler.on("A", () => markPageAsRead());
+ keyboardHandler.on("s", () => handleSaveEntry());
+ keyboardHandler.on("d", () => handleFetchOriginalContent());
+ keyboardHandler.on("f", () => handleBookmark());
+ keyboardHandler.on("?", () => showKeyboardShortcuts());
+ keyboardHandler.on("#", () => unsubscribeFromFeed());
+ keyboardHandler.on("/", (e) => setFocusToSearchInput(e));
keyboardHandler.on("Escape", () => ModalHandler.close());
keyboardHandler.listen();
}
- let touchHandler = new TouchHandler(navHandler);
+ let touchHandler = new TouchHandler();
touchHandler.listen();
- let mouseHandler = new MouseHandler();
- mouseHandler.onClick("a[data-save-entry]", (event) => {
- EntryHandler.saveEntry(event.target);
- });
+ onClick("a[data-save-entry]", () => handleSaveEntry());
+ onClick("a[data-toggle-bookmark]", () => handleBookmark());
+ onClick("a[data-fetch-content-entry]", () => handleFetchOriginalContent());
+ onClick("a[data-action=search]", (event) => setFocusToSearchInput(event));
+ onClick("a[data-on-click=markPageAsRead]", () => markPageAsRead());
- mouseHandler.onClick("a[data-toggle-bookmark]", (event) => {
- EntryHandler.toggleBookmark(event.target);
- });
-
- mouseHandler.onClick("a[data-toggle-status]", (event) => {
+ onClick("a[data-toggle-status]", (event) => {
let currentItem = DomHelper.findParent(event.target, "entry");
- if (! currentItem) {
+ if (!currentItem) {
currentItem = DomHelper.findParent(event.target, "item");
}
if (currentItem) {
- EntryHandler.toggleEntryStatus(currentItem);
+ toggleEntryStatus(currentItem);
}
});
- mouseHandler.onClick("a[data-fetch-content-entry]", (event) => {
- EntryHandler.fetchOriginalContent(event.target);
- });
-
- mouseHandler.onClick("a[data-on-click=markPageAsRead]", (event) => {
- navHandler.markPageAsRead(event.target.dataset.showOnlyUnread || false);
- });
-
- mouseHandler.onClick("a[data-confirm]", (event) => {
+ onClick("a[data-confirm]", (event) => {
(new ConfirmHandler()).handle(event);
});
- mouseHandler.onClick("a[data-action=search]", (event) => {
- navHandler.setFocusToSearchInput(event);
- });
-
- mouseHandler.onClick("a[data-link-state=flip]", (event) => {
- LinkStateHandler.flip(event.target);
+ onClick("a[data-link-state=flip]", (event) => {
+ flipElementState(event.target);
}, true);
if (document.documentElement.clientWidth < 600) {
- let menuHandler = new MenuHandler();
- mouseHandler.onClick(".logo", () => menuHandler.toggleMainMenu());
- mouseHandler.onClick(".header nav li", (event) => menuHandler.clickMenuListItem(event));
+ onClick(".logo", () => toggleMainMenu());
+ onClick(".header nav li", (event) => onClickMainMenuListItem(event));
}
if ("serviceWorker" in navigator) {
diff --git a/ui/static/js/confirm_handler.js b/ui/static/js/confirm_handler.js
index 171654f..74ebb2d 100644
--- a/ui/static/js/confirm_handler.js
+++ b/ui/static/js/confirm_handler.js
@@ -33,7 +33,7 @@ class ConfirmHandler {
containerElement.appendChild(loadingElement);
if (linkElement.dataset.markPageAsRead) {
- (new NavHandler()).markPageAsRead(event.target.dataset.showOnlyUnread || false);
+ markPageAsRead(event.target.dataset.showOnlyUnread || false);
} else {
this.executeRequest(linkElement.dataset.url, linkElement.dataset.redirectUrl);
}
diff --git a/ui/static/js/entry_handler.js b/ui/static/js/entry_handler.js
deleted file mode 100644
index 6392aef..0000000
--- a/ui/static/js/entry_handler.js
+++ /dev/null
@@ -1,100 +0,0 @@
-class EntryHandler {
- static updateEntriesStatus(entryIDs, status, callback) {
- let url = document.body.dataset.entriesStatusUrl;
- let request = new RequestBuilder(url);
- request.withBody({entry_ids: entryIDs, status: status});
- request.withCallback(callback);
- request.execute();
-
- if (status === "read") {
- UnreadCounterHandler.decrement(1);
- } else {
- UnreadCounterHandler.increment(1);
- }
- }
-
- static toggleEntryStatus(element) {
- let entryID = parseInt(element.dataset.id, 10);
- let link = element.querySelector("a[data-toggle-status]");
-
- let currentStatus = link.dataset.value;
- let newStatus = currentStatus === "read" ? "unread" : "read";
-
- this.updateEntriesStatus([entryID], newStatus);
-
- if (currentStatus === "read") {
- link.innerHTML = link.dataset.labelRead;
- link.dataset.value = "unread";
- } else {
- link.innerHTML = link.dataset.labelUnread;
- link.dataset.value = "read";
- }
-
- if (element.classList.contains("item-status-" + currentStatus)) {
- element.classList.remove("item-status-" + currentStatus);
- element.classList.add("item-status-" + newStatus);
- }
- }
-
- static toggleBookmark(element) {
- element.innerHTML = element.dataset.labelLoading;
-
- let request = new RequestBuilder(element.dataset.bookmarkUrl);
- request.withCallback(() => {
- if (element.dataset.value === "star") {
- element.innerHTML = element.dataset.labelStar;
- element.dataset.value = "unstar";
- } else {
- element.innerHTML = element.dataset.labelUnstar;
- element.dataset.value = "star";
- }
- });
- request.execute();
- }
-
- static markEntryAsRead(element) {
- if (element.classList.contains("item-status-unread")) {
- element.classList.remove("item-status-unread");
- element.classList.add("item-status-read");
-
- let entryID = parseInt(element.dataset.id, 10);
- this.updateEntriesStatus([entryID], "read");
- }
- }
-
- static saveEntry(element) {
- if (element.dataset.completed) {
- return;
- }
-
- element.innerHTML = element.dataset.labelLoading;
-
- let request = new RequestBuilder(element.dataset.saveUrl);
- request.withCallback(() => {
- element.innerHTML = element.dataset.labelDone;
- element.dataset.completed = true;
- });
- request.execute();
- }
-
- static fetchOriginalContent(element) {
- if (element.dataset.completed) {
- return;
- }
-
- element.innerHTML = element.dataset.labelLoading;
-
- let request = new RequestBuilder(element.dataset.fetchContentUrl);
- request.withCallback((response) => {
- element.innerHTML = element.dataset.labelDone;
- element.dataset.completed = true;
-
- response.json().then((data) => {
- if (data.hasOwnProperty("content")) {
- document.querySelector(".entry-content").innerHTML = data.content;
- }
- });
- });
- request.execute();
- }
-}
diff --git a/ui/static/js/feed_handler.js b/ui/static/js/feed_handler.js
deleted file mode 100644
index 1d4190f..0000000
--- a/ui/static/js/feed_handler.js
+++ /dev/null
@@ -1,7 +0,0 @@
-class FeedHandler {
- static unsubscribe(feedUrl, callback) {
- let request = new RequestBuilder(feedUrl);
- request.withCallback(callback);
- request.execute();
- }
-}
diff --git a/ui/static/js/form_handler.js b/ui/static/js/form_handler.js
deleted file mode 100644
index de417db..0000000
--- a/ui/static/js/form_handler.js
+++ /dev/null
@@ -1,15 +0,0 @@
-class FormHandler {
- static handleSubmitButtons() {
- let elements = document.querySelectorAll("form");
- elements.forEach((element) => {
- element.onsubmit = () => {
- let button = document.querySelector("button");
-
- if (button) {
- button.innerHTML = button.dataset.labelLoading;
- button.disabled = true;
- }
- };
- });
- }
-}
diff --git a/ui/static/js/link_state_handler.js b/ui/static/js/link_state_handler.js
deleted file mode 100644
index eec6df1..0000000
--- a/ui/static/js/link_state_handler.js
+++ /dev/null
@@ -1,10 +0,0 @@
-class LinkStateHandler {
- static flip(element) {
- let labelElement = document.createElement("span");
- labelElement.className = "link-flipped-state";
- labelElement.appendChild(document.createTextNode(element.dataset.labelNewState));
-
- element.parentNode.appendChild(labelElement);
- element.parentNode.removeChild(element);
- }
-}
diff --git a/ui/static/js/menu_handler.js b/ui/static/js/menu_handler.js
deleted file mode 100644
index 0907a91..0000000
--- a/ui/static/js/menu_handler.js
+++ /dev/null
@@ -1,27 +0,0 @@
-class MenuHandler {
- clickMenuListItem(event) {
- let element = event.target;
-
- if (element.tagName === "A") {
- window.location.href = element.getAttribute("href");
- } else {
- window.location.href = element.querySelector("a").getAttribute("href");
- }
- }
-
- toggleMainMenu() {
- let menu = document.querySelector(".header nav ul");
- if (DomHelper.isVisible(menu)) {
- menu.style.display = "none";
- } else {
- menu.style.display = "block";
- }
-
- let searchElement = document.querySelector(".header .search");
- if (DomHelper.isVisible(searchElement)) {
- searchElement.style.display = "none";
- } else {
- searchElement.style.display = "block";
- }
- }
-}
diff --git a/ui/static/js/mouse_handler.js b/ui/static/js/mouse_handler.js
deleted file mode 100644
index 8b42a56..0000000
--- a/ui/static/js/mouse_handler.js
+++ /dev/null
@@ -1,14 +0,0 @@
-class MouseHandler {
- onClick(selector, callback, noPreventDefault) {
- let elements = document.querySelectorAll(selector);
- elements.forEach((element) => {
- element.onclick = (event) => {
- if (! noPreventDefault) {
- event.preventDefault();
- }
-
- callback(event);
- };
- });
- }
-} \ No newline at end of file
diff --git a/ui/static/js/nav_handler.js b/ui/static/js/nav_handler.js
deleted file mode 100644
index 9f1f861..0000000
--- a/ui/static/js/nav_handler.js
+++ /dev/null
@@ -1,253 +0,0 @@
-class NavHandler {
- setFocusToSearchInput(event) {
- event.preventDefault();
- event.stopPropagation();
-
- let toggleSwitchElement = document.querySelector(".search-toggle-switch");
- if (toggleSwitchElement) {
- toggleSwitchElement.style.display = "none";
- }
-
- let searchFormElement = document.querySelector(".search-form");
- if (searchFormElement) {
- searchFormElement.style.display = "block";
- }
-
- let searchInputElement = document.getElementById("search-input");
- if (searchInputElement) {
- searchInputElement.focus();
- searchInputElement.value = "";
- }
- }
-
- showKeyboardShortcuts() {
- let template = document.getElementById("keyboard-shortcuts");
- if (template !== null) {
- ModalHandler.open(template.content);
- }
- }
-
- markPageAsRead(showOnlyUnread) {
- let items = DomHelper.getVisibleElements(".items .item");
- let entryIDs = [];
-
- items.forEach((element) => {
- element.classList.add("item-status-read");
- entryIDs.push(parseInt(element.dataset.id, 10));
- });
-
- if (entryIDs.length > 0) {
- EntryHandler.updateEntriesStatus(entryIDs, "read", () => {
- // This callback make sure the Ajax request reach the server before we reload the page.
- if (showOnlyUnread) {
- window.location.reload();
- } else {
- this.goToPage("next", true);
- }
- });
- }
- }
-
- saveEntry() {
- if (this.isListView()) {
- let currentItem = document.querySelector(".current-item");
- if (currentItem !== null) {
- let saveLink = currentItem.querySelector("a[data-save-entry]");
- if (saveLink) {
- EntryHandler.saveEntry(saveLink);
- }
- }
- } else {
- let saveLink = document.querySelector("a[data-save-entry]");
- if (saveLink) {
- EntryHandler.saveEntry(saveLink);
- }
- }
- }
-
- fetchOriginalContent() {
- if (! this.isListView()){
- let link = document.querySelector("a[data-fetch-content-entry]");
- if (link) {
- EntryHandler.fetchOriginalContent(link);
- }
- }
- }
-
- toggleEntryStatus() {
- if (! this.isListView()) {
- EntryHandler.toggleEntryStatus(document.querySelector(".entry"));
- return;
- }
-
- let currentItem = document.querySelector(".current-item");
- if (currentItem !== null) {
- // The order is important here,
- // On the unread page, the read item will be hidden.
- this.goToNextListItem();
- EntryHandler.toggleEntryStatus(currentItem);
- }
- }
-
- toggleBookmark() {
- if (! this.isListView()) {
- this.toggleBookmarkLink(document.querySelector(".entry"));
- return;
- }
-
- let currentItem = document.querySelector(".current-item");
- if (currentItem !== null) {
- this.toggleBookmarkLink(currentItem);
- }
- }
-
- toggleBookmarkLink(parent) {
- let bookmarkLink = parent.querySelector("a[data-toggle-bookmark]");
- if (bookmarkLink) {
- EntryHandler.toggleBookmark(bookmarkLink);
- }
- }
-
- openOriginalLink() {
- let entryLink = document.querySelector(".entry h1 a");
- if (entryLink !== null) {
- DomHelper.openNewTab(entryLink.getAttribute("href"));
- return;
- }
-
- let currentItemOriginalLink = document.querySelector(".current-item a[data-original-link]");
- if (currentItemOriginalLink !== null) {
- DomHelper.openNewTab(currentItemOriginalLink.getAttribute("href"));
-
- // Move to the next item and if we are on the unread page mark this item as read.
- let currentItem = document.querySelector(".current-item");
- this.goToNextListItem();
- EntryHandler.markEntryAsRead(currentItem);
- }
- }
-
- openSelectedItem() {
- let currentItemLink = document.querySelector(".current-item .item-title a");
- if (currentItemLink !== null) {
- window.location.href = currentItemLink.getAttribute("href");
- }
- }
-
- unsubscribeFromFeed() {
- let unsubscribeLinks = document.querySelectorAll("[data-action=remove-feed]");
- if (unsubscribeLinks.length === 1) {
- let unsubscribeLink = unsubscribeLinks[0];
- FeedHandler.unsubscribe(unsubscribeLink.dataset.url, () => {
- if (unsubscribeLink.dataset.redirectUrl) {
- window.location.href = unsubscribeLink.dataset.redirectUrl;
- } else {
- window.location.reload();
- }
- });
- }
- }
-
- /**
- * @param {string} page Page to redirect to.
- * @param {boolean} fallbackSelf Refresh actual page if the page is not found.
- */
- goToPage(page, fallbackSelf) {
- let element = document.querySelector("a[data-page=" + page + "]");
-
- if (element) {
- document.location.href = element.href;
- } else if (fallbackSelf) {
- window.location.reload();
- }
- }
-
- goToPrevious() {
- if (this.isListView()) {
- this.goToPreviousListItem();
- } else {
- this.goToPage("previous");
- }
- }
-
- goToNext() {
- if (this.isListView()) {
- this.goToNextListItem();
- } else {
- this.goToPage("next");
- }
- }
-
- goToFeedOrFeeds() {
- if (this.isEntry()) {
- let feedAnchor = document.querySelector("span.entry-website a");
- if (feedAnchor !== null) {
- window.location.href = feedAnchor.href;
- }
- } else {
- this.goToPage('feeds');
- }
- }
-
- goToPreviousListItem() {
- let items = DomHelper.getVisibleElements(".items .item");
- if (items.length === 0) {
- return;
- }
-
- if (document.querySelector(".current-item") === null) {
- items[0].classList.add("current-item");
- items[0].querySelector('.item-header a').focus();
- return;
- }
-
- for (let i = 0; i < items.length; i++) {
- if (items[i].classList.contains("current-item")) {
- items[i].classList.remove("current-item");
-
- if (i - 1 >= 0) {
- items[i - 1].classList.add("current-item");
- DomHelper.scrollPageTo(items[i - 1]);
- items[i - 1].querySelector('.item-header a').focus();
- }
-
- break;
- }
- }
- }
-
- goToNextListItem() {
- let currentItem = document.querySelector(".current-item");
- let items = DomHelper.getVisibleElements(".items .item");
- if (items.length === 0) {
- return;
- }
-
- if (currentItem === null) {
- items[0].classList.add("current-item");
- items[0].querySelector('.item-header a').focus();
- return;
- }
-
- for (let i = 0; i < items.length; i++) {
- if (items[i].classList.contains("current-item")) {
- items[i].classList.remove("current-item");
-
- if (i + 1 < items.length) {
- items[i + 1].classList.add("current-item");
- DomHelper.scrollPageTo(items[i + 1]);
- items[i + 1].querySelector('.item-header a').focus();
- }
-
- break;
- }
- }
- }
-
- isEntry() {
- return document.querySelector("section.entry") !== null;
- }
-
- isListView() {
- return document.querySelector(".items") !== null;
- }
-}
diff --git a/ui/static/js/touch_handler.js b/ui/static/js/touch_handler.js
index 9e4b7bc..4f6d7ae 100644
--- a/ui/static/js/touch_handler.js
+++ b/ui/static/js/touch_handler.js
@@ -1,13 +1,12 @@
class TouchHandler {
- constructor(navHandler) {
- this.navHandler = navHandler;
+ constructor() {
this.reset();
}
reset() {
this.touch = {
- start: {x: -1, y: -1},
- move: {x: -1, y: -1},
+ start: { x: -1, y: -1 },
+ move: { x: -1, y: -1 },
element: null
};
}
@@ -75,8 +74,9 @@ class TouchHandler {
let distance = Math.abs(this.calculateDistance());
if (distance > 75) {
- EntryHandler.toggleEntryStatus(this.touch.element);
+ toggleEntryStatus(this.touch.element);
}
+
this.touch.element.style.opacity = 1;
this.touch.element.style.transform = "none";
}
@@ -101,7 +101,7 @@ class TouchHandler {
previous: null,
next: null
};
-
+
const detectDoubleTap = (doubleTapTimer, event) => {
const timer = doubleTapTimers[doubleTapTimer];
if (timer === null) {
@@ -110,17 +110,18 @@ class TouchHandler {
}, 200);
} else {
event.preventDefault();
- this.navHandler.goToPage(doubleTapTimer);
+ goToPage(doubleTapTimer);
}
};
-
+
entryContentElement.addEventListener("touchend", (e) => {
- if (e.changedTouches[0].clientX >= (entryContentElement.offsetWidth / 2)) {
- detectDoubleTap("next", e);
- } else {
- detectDoubleTap("previous", e);
- }
- }, hasPassiveOption ? { passive: false } : false);
+ if (e.changedTouches[0].clientX >= (entryContentElement.offsetWidth / 2)) {
+ detectDoubleTap("next", e);
+ } else {
+ detectDoubleTap("previous", e);
+ }
+ }, hasPassiveOption ? { passive: false } : false);
+
entryContentElement.addEventListener("touchmove", (e) => {
Object.keys(doubleTapTimers).forEach(timer => doubleTapTimers[timer] = null);
});
diff --git a/ui/static/js/unread_counter_handler.js b/ui/static/js/unread_counter_handler.js
deleted file mode 100644
index 87a1aaa..0000000
--- a/ui/static/js/unread_counter_handler.js
+++ /dev/null
@@ -1,33 +0,0 @@
-class UnreadCounterHandler {
- static decrement(n) {
- this.updateValue((current) => {
- return current - n;
- });
- }
-
- static increment(n) {
- this.updateValue((current) => {
- return current + n;
- });
- }
-
- static updateValue(callback) {
- let counterElements = document.querySelectorAll("span.unread-counter");
- counterElements.forEach((element) => {
- let oldValue = parseInt(element.textContent, 10);
- element.innerHTML = callback(oldValue);
- });
-
- if (window.location.href.endsWith('/unread')) {
- let oldValue = parseInt(document.title.split('(')[1], 10);
- let newValue = callback(oldValue);
-
- document.title = document.title.replace(
- /(.*?)\(\d+\)(.*?)/,
- function (match, prefix, suffix, offset, string) {
- return prefix + '(' + newValue + ')' + suffix;
- }
- );
- }
- }
-}
generated by cgit v1.2.3 (git 2.39.1) at 2024-06-08 09:36:44 +0000