nav_handler.js 7.7 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197198199200201202203204205206207208209210211212213214215216217218219220221222223224225226227228229230231232233234235236237238239240241242243244245246247248249250251252253
  1. class NavHandler {
  2. setFocusToSearchInput(event) {
  3. event.preventDefault();
  4. event.stopPropagation();
  5. let toggleSwitchElement = document.querySelector(".search-toggle-switch");
  6. if (toggleSwitchElement) {
  7. toggleSwitchElement.style.display = "none";
  8. }
  9. let searchFormElement = document.querySelector(".search-form");
  10. if (searchFormElement) {
  11. searchFormElement.style.display = "block";
  12. }
  13. let searchInputElement = document.getElementById("search-input");
  14. if (searchInputElement) {
  15. searchInputElement.focus();
  16. searchInputElement.value = "";
  17. }
  18. }
  19. showKeyboardShortcuts() {
  20. let template = document.getElementById("keyboard-shortcuts");
  21. if (template !== null) {
  22. ModalHandler.open(template.content);
  23. }
  24. }
  25. markPageAsRead(showOnlyUnread) {
  26. let items = DomHelper.getVisibleElements(".items .item");
  27. let entryIDs = [];
  28. items.forEach((element) => {
  29. element.classList.add("item-status-read");
  30. entryIDs.push(parseInt(element.dataset.id, 10));
  31. });
  32. if (entryIDs.length > 0) {
  33. EntryHandler.updateEntriesStatus(entryIDs, "read", () => {
  34. // This callback make sure the Ajax request reach the server before we reload the page.
  35. if (showOnlyUnread) {
  36. window.location.reload();
  37. } else {
  38. this.goToPage("next", true);
  39. }
  40. });
  41. }
  42. }
  43. saveEntry() {
  44. if (this.isListView()) {
  45. let currentItem = document.querySelector(".current-item");
  46. if (currentItem !== null) {
  47. let saveLink = currentItem.querySelector("a[data-save-entry]");
  48. if (saveLink) {
  49. EntryHandler.saveEntry(saveLink);
  50. }
  51. }
  52. } else {
  53. let saveLink = document.querySelector("a[data-save-entry]");
  54. if (saveLink) {
  55. EntryHandler.saveEntry(saveLink);
  56. }
  57. }
  58. }
  59. fetchOriginalContent() {
  60. if (! this.isListView()){
  61. let link = document.querySelector("a[data-fetch-content-entry]");
  62. if (link) {
  63. EntryHandler.fetchOriginalContent(link);
  64. }
  65. }
  66. }
  67. toggleEntryStatus() {
  68. if (! this.isListView()) {
  69. EntryHandler.toggleEntryStatus(document.querySelector(".entry"));
  70. return;
  71. }
  72. let currentItem = document.querySelector(".current-item");
  73. if (currentItem !== null) {
  74. // The order is important here,
  75. // On the unread page, the read item will be hidden.
  76. this.goToNextListItem();
  77. EntryHandler.toggleEntryStatus(currentItem);
  78. }
  79. }
  80. toggleBookmark() {
  81. if (! this.isListView()) {
  82. this.toggleBookmarkLink(document.querySelector(".entry"));
  83. return;
  84. }
  85. let currentItem = document.querySelector(".current-item");
  86. if (currentItem !== null) {
  87. this.toggleBookmarkLink(currentItem);
  88. }
  89. }
  90. toggleBookmarkLink(parent) {
  91. let bookmarkLink = parent.querySelector("a[data-toggle-bookmark]");
  92. if (bookmarkLink) {
  93. EntryHandler.toggleBookmark(bookmarkLink);
  94. }
  95. }
  96. openOriginalLink() {
  97. let entryLink = document.querySelector(".entry h1 a");
  98. if (entryLink !== null) {
  99. DomHelper.openNewTab(entryLink.getAttribute("href"));
  100. return;
  101. }
  102. let currentItemOriginalLink = document.querySelector(".current-item a[data-original-link]");
  103. if (currentItemOriginalLink !== null) {
  104. DomHelper.openNewTab(currentItemOriginalLink.getAttribute("href"));
  105. // Move to the next item and if we are on the unread page mark this item as read.
  106. let currentItem = document.querySelector(".current-item");
  107. this.goToNextListItem();
  108. EntryHandler.markEntryAsRead(currentItem);
  109. }
  110. }
  111. openSelectedItem() {
  112. let currentItemLink = document.querySelector(".current-item .item-title a");
  113. if (currentItemLink !== null) {
  114. window.location.href = currentItemLink.getAttribute("href");
  115. }
  116. }
  117. unsubscribeFromFeed() {
  118. let unsubscribeLinks = document.querySelectorAll("[data-action=remove-feed]");
  119. if (unsubscribeLinks.length === 1) {
  120. let unsubscribeLink = unsubscribeLinks[0];
  121. FeedHandler.unsubscribe(unsubscribeLink.dataset.url, () => {
  122. if (unsubscribeLink.dataset.redirectUrl) {
  123. window.location.href = unsubscribeLink.dataset.redirectUrl;
  124. } else {
  125. window.location.reload();
  126. }
  127. });
  128. }
  129. }
  130. /**
  131. * @param {string} page Page to redirect to.
  132. * @param {boolean} fallbackSelf Refresh actual page if the page is not found.
  133. */
  134. goToPage(page, fallbackSelf) {
  135. let element = document.querySelector("a[data-page=" + page + "]");
  136. if (element) {
  137. document.location.href = element.href;
  138. } else if (fallbackSelf) {
  139. window.location.reload();
  140. }
  141. }
  142. goToPrevious() {
  143. if (this.isListView()) {
  144. this.goToPreviousListItem();
  145. } else {
  146. this.goToPage("previous");
  147. }
  148. }
  149. goToNext() {
  150. if (this.isListView()) {
  151. this.goToNextListItem();
  152. } else {
  153. this.goToPage("next");
  154. }
  155. }
  156. goToFeedOrFeeds() {
  157. if (this.isEntry()) {
  158. let feedAnchor = document.querySelector("span.entry-website a");
  159. if (feedAnchor !== null) {
  160. window.location.href = feedAnchor.href;
  161. }
  162. } else {
  163. this.goToPage('feeds');
  164. }
  165. }
  166. goToPreviousListItem() {
  167. let items = DomHelper.getVisibleElements(".items .item");
  168. if (items.length === 0) {
  169. return;
  170. }
  171. if (document.querySelector(".current-item") === null) {
  172. items[0].classList.add("current-item");
  173. items[0].querySelector('.item-header a').focus();
  174. return;
  175. }
  176. for (let i = 0; i < items.length; i++) {
  177. if (items[i].classList.contains("current-item")) {
  178. items[i].classList.remove("current-item");
  179. if (i - 1 >= 0) {
  180. items[i - 1].classList.add("current-item");
  181. DomHelper.scrollPageTo(items[i - 1]);
  182. items[i - 1].querySelector('.item-header a').focus();
  183. }
  184. break;
  185. }
  186. }
  187. }
  188. goToNextListItem() {
  189. let currentItem = document.querySelector(".current-item");
  190. let items = DomHelper.getVisibleElements(".items .item");
  191. if (items.length === 0) {
  192. return;
  193. }
  194. if (currentItem === null) {
  195. items[0].classList.add("current-item");
  196. items[0].querySelector('.item-header a').focus();
  197. return;
  198. }
  199. for (let i = 0; i < items.length; i++) {
  200. if (items[i].classList.contains("current-item")) {
  201. items[i].classList.remove("current-item");
  202. if (i + 1 < items.length) {
  203. items[i + 1].classList.add("current-item");
  204. DomHelper.scrollPageTo(items[i + 1]);
  205. items[i + 1].querySelector('.item-header a').focus();
  206. }
  207. break;
  208. }
  209. }
  210. }
  211. isEntry() {
  212. return document.querySelector("section.entry") !== null;
  213. }
  214. isListView() {
  215. return document.querySelector(".items") !== null;
  216. }
  217. }