main.js 53 KB

12345678910111213141516171819202122232425262728293031323334353637383940414243444546474849505152535455565758596061626364656667686970717273747576777879808182838485868788899091929394959697989910010110210310410510610710810911011111211311411511611711811912012112212312412512612712812913013113213313413513613713813914014114214314414514614714814915015115215315415515615715815916016116216316416516616716816917017117217317417517617717817918018118218318418518618718818919019119219319419519619719819920020120220320420520620720820921021121221321421521621721821922022122222322422522622722822923023123223323423523623723823924024124224324424524624724824925025125225325425525625725825926026126226326426526626726826927027127227327427527627727827928028128228328428528628728828929029129229329429529629729829930030130230330430530630730830931031131231331431531631731831932032132232332432532632732832933033133233333433533633733833934034134234334434534634734834935035135235335435535635735835936036136236336436536636736836937037137237337437537637737837938038138238338438538638738838939039139239339439539639739839940040140240340440540640740840941041141241341441541641741841942042142242342442542642742842943043143243343443543643743843944044144244344444544644744844945045145245345445545645745845946046146246346446546646746846947047147247347447547647747847948048148248348448548648748848949049149249349449549649749849950050150250350450550650750850951051151251351451551651751851952052152252352452552652752852953053153253353453553653753853954054154254354454554654754854955055155255355455555655755855956056156256356456556656756856957057157257357457557657757857958058158258358458558658758858959059159259359459559659759859960060160260360460560660760860961061161261361461561661761861962062162262362462562662762862963063163263363463563663763863964064164264364464564664764864965065165265365465565665765865966066166266366466566666766866967067167267367467567667767867968068168268368468568668768868969069169269369469569669769869970070170270370470570670770870971071171271371471571671771871972072172272372472572672772872973073173273373473573673773873974074174274374474574674774874975075175275375475575675775875976076176276376476576676776876977077177277377477577677777877978078178278378478578678778878979079179279379479579679779879980080180280380480580680780880981081181281381481581681781881982082182282382482582682782882983083183283383483583683783883984084184284384484584684784884985085185285385485585685785885986086186286386486586686786886987087187287387487587687787887988088188288388488588688788888989089189289389489589689789889990090190290390490590690790890991091191291391491591691791891992092192292392492592692792892993093193293393493593693793893994094194294394494594694794894995095195295395495595695795895996096196296396496596696796896997097197297397497597697797897998098198298398498598698798898999099199299399499599699799899910001001100210031004100510061007100810091010101110121013101410151016101710181019102010211022102310241025102610271028102910301031103210331034103510361037103810391040104110421043104410451046104710481049105010511052105310541055105610571058105910601061106210631064106510661067106810691070107110721073107410751076107710781079108010811082108310841085108610871088108910901091109210931094109510961097109810991100110111021103110411051106110711081109111011111112111311141115111611171118111911201121112211231124112511261127112811291130113111321133113411351136113711381139114011411142114311441145114611471148114911501151115211531154115511561157115811591160116111621163116411651166116711681169117011711172117311741175117611771178117911801181118211831184118511861187118811891190119111921193119411951196119711981199120012011202120312041205120612071208120912101211121212131214121512161217121812191220122112221223122412251226122712281229123012311232123312341235123612371238123912401241124212431244124512461247124812491250125112521253125412551256125712581259126012611262126312641265126612671268126912701271127212731274127512761277127812791280128112821283128412851286128712881289129012911292129312941295129612971298129913001301130213031304130513061307130813091310131113121313131413151316131713181319132013211322132313241325132613271328132913301331133213331334133513361337133813391340134113421343134413451346134713481349135013511352135313541355135613571358135913601361136213631364136513661367136813691370137113721373137413751376137713781379138013811382138313841385138613871388138913901391139213931394139513961397139813991400140114021403140414051406140714081409141014111412141314141415141614171418141914201421142214231424142514261427142814291430143114321433143414351436143714381439144014411442144314441445144614471448144914501451145214531454145514561457145814591460146114621463146414651466146714681469147014711472147314741475147614771478147914801481148214831484148514861487148814891490149114921493149414951496149714981499150015011502150315041505150615071508150915101511151215131514151515161517151815191520152115221523152415251526152715281529153015311532153315341535153615371538153915401541154215431544154515461547154815491550155115521553155415551556155715581559156015611562156315641565156615671568156915701571157215731574157515761577157815791580158115821583158415851586158715881589159015911592159315941595159615971598159916001601160216031604160516061607160816091610161116121613161416151616161716181619162016211622162316241625162616271628162916301631163216331634163516361637163816391640164116421643164416451646164716481649165016511652165316541655165616571658165916601661166216631664166516661667166816691670167116721673167416751676167716781679168016811682168316841685168616871688168916901691169216931694169516961697169816991700170117021703170417051706170717081709171017111712171317141715171617171718171917201721172217231724172517261727172817291730173117321733173417351736173717381739174017411742174317441745174617471748174917501751175217531754175517561757175817591760176117621763176417651766176717681769177017711772177317741775177617771778177917801781178217831784178517861787178817891790179117921793179417951796179717981799180018011802180318041805180618071808180918101811181218131814181518161817181818191820182118221823182418251826182718281829183018311832183318341835183618371838183918401841
  1. // @license magnet:?xt=urn:btih:0b31508aeb0634b347b8270c7bee4d411b5d4109&dn=agpl-3.0.txt AGPL-3.0
  2. 'use strict';
  3. // <Polyfills>
  4. if (!document.scrollingElement) document.scrollingElement = document.documentElement;
  5. if (!NodeList.prototype.forEach) NodeList.prototype.forEach = Array.prototype.forEach;
  6. if (!Element.prototype.matches) {
  7. Element.prototype.matches = Element.prototype.msMatchesSelector || Element.prototype.mozMatchesSelector || Element.prototype.webkitMatchesSelector;
  8. }
  9. if (!Element.prototype.closest) {
  10. Element.prototype.closest = function (s) {
  11. let el = this;
  12. do {
  13. if (el.matches(s)) return el;
  14. el = el.parentElement;
  15. } while (el);
  16. return null;
  17. };
  18. }
  19. if (!Element.prototype.remove) Element.prototype.remove = function () { if (this.parentNode) this.parentNode.removeChild(this); };
  20. // </Polyfills>
  21. // <Utils>
  22. function xmlHttpRequestJson(req) {
  23. let json = req.response;
  24. if (req.responseType !== 'json') { // IE11
  25. try {
  26. json = JSON.parse(req.responseText);
  27. } catch (ex) {
  28. json = null;
  29. }
  30. }
  31. return json;
  32. }
  33. // </Utils>
  34. // <Global context>
  35. /* eslint-disable no-var */
  36. var context;
  37. /* eslint-enable no-var */
  38. (function parseJsonVars() {
  39. const jsonVars = document.getElementById('jsonVars');
  40. const json = JSON.parse(jsonVars.innerHTML);
  41. jsonVars.outerHTML = '';
  42. context = json.context;
  43. context.ajax_loading = false;
  44. context.i18n = json.i18n;
  45. context.shortcuts = json.shortcuts;
  46. context.urls = json.urls;
  47. context.icons = json.icons;
  48. context.icons.read = decodeURIComponent(context.icons.read);
  49. context.icons.unread = decodeURIComponent(context.icons.unread);
  50. context.extensions = json.extensions;
  51. }());
  52. // </Global context>
  53. function badAjax(reload) {
  54. openNotification(context.i18n.notif_request_failed, 'bad');
  55. if (reload) {
  56. setTimeout(function () { location.reload(); }, 2000);
  57. }
  58. return true;
  59. }
  60. function needsScroll(elem) {
  61. const winBottom = document.scrollingElement.scrollTop + document.scrollingElement.clientHeight;
  62. const elemTop = elem.offsetParent.offsetTop + elem.offsetTop;
  63. const elemBottom = elemTop + elem.offsetHeight;
  64. if (elemTop < document.scrollingElement.scrollTop || elemBottom > winBottom) {
  65. return elemTop - (document.scrollingElement.clientHeight / 2);
  66. }
  67. return 0;
  68. }
  69. function str2int(str) {
  70. if (!str) {
  71. return 0;
  72. }
  73. return parseInt(str.replace(/\D/g, ''), 10) || 0;
  74. }
  75. function numberFormat(nStr) {
  76. if (nStr < 0) {
  77. return 0;
  78. }
  79. // http://www.mredkj.com/javascript/numberFormat.html
  80. nStr += '';
  81. const x = nStr.split('.');
  82. const x2 = x.length > 1 ? '.' + x[1] : '';
  83. const rgx = /(\d+)(\d{3})/;
  84. let x1 = x[0];
  85. while (rgx.test(x1)) {
  86. x1 = x1.replace(rgx, '$1 $2');
  87. }
  88. return x1 + x2;
  89. }
  90. function incLabel(p, inc, spaceAfter) {
  91. const i = str2int(p) + inc;
  92. return i > 0 ? ((spaceAfter ? '' : ' ') + '(' + numberFormat(i) + ')' + (spaceAfter ? ' ' : '')) : '';
  93. }
  94. function incUnreadsFeed(article, feed_id, nb) {
  95. // Update unread: feed
  96. let elem = document.getElementById(feed_id);
  97. let feed_unreads = elem ? str2int(elem.getAttribute('data-unread')) : 0;
  98. const feed_priority = elem ? str2int(elem.getAttribute('data-priority')) : 0;
  99. if (elem) {
  100. elem.setAttribute('data-unread', feed_unreads + nb);
  101. elem = elem.querySelector('.item-title');
  102. if (elem) {
  103. elem.setAttribute('data-unread', numberFormat(feed_unreads + nb));
  104. }
  105. }
  106. // Update unread: category
  107. elem = document.getElementById(feed_id);
  108. elem = elem ? elem.closest('.category') : null;
  109. if (elem) {
  110. feed_unreads = str2int(elem.getAttribute('data-unread'));
  111. elem.setAttribute('data-unread', feed_unreads + nb);
  112. elem = elem.querySelector('.title');
  113. if (elem) {
  114. elem.setAttribute('data-unread', numberFormat(feed_unreads + nb));
  115. }
  116. }
  117. // Update unread: all
  118. if (feed_priority > 0) {
  119. elem = document.querySelector('#aside_feed .all .title');
  120. if (elem) {
  121. feed_unreads = elem ? str2int(elem.getAttribute('data-unread')) : 0;
  122. elem.setAttribute('data-unread', numberFormat(feed_unreads + nb));
  123. }
  124. }
  125. // Update unread: favourites
  126. if (article && article.closest('div').classList.contains('favorite')) {
  127. elem = document.querySelector('#aside_feed .favorites .title');
  128. if (elem) {
  129. feed_unreads = elem ? str2int(elem.getAttribute('data-unread')) : 0;
  130. elem.setAttribute('data-unread', numberFormat(feed_unreads + nb));
  131. }
  132. }
  133. let isCurrentView = false;
  134. // Update unread: title
  135. document.title = document.title.replace(/^((?:\([\s0-9]+\) )?)/, function (m, p1) {
  136. const feed = document.getElementById(feed_id);
  137. if (article || (feed && feed.closest('.active'))) {
  138. isCurrentView = true;
  139. return incLabel(p1, nb, true);
  140. } else if (document.querySelector('.all.active')) {
  141. isCurrentView = feed_priority > 0;
  142. return incLabel(p1, feed_priority > 0 ? nb : 0, true);
  143. } else {
  144. return p1;
  145. }
  146. });
  147. return isCurrentView;
  148. }
  149. function incUnreadsTag(tag_id, nb) {
  150. let t = document.getElementById(tag_id);
  151. if (t) {
  152. const unreads = str2int(t.getAttribute('data-unread'));
  153. t.setAttribute('data-unread', unreads + nb);
  154. t.querySelector('.item-title').setAttribute('data-unread', numberFormat(unreads + nb));
  155. }
  156. t = document.querySelector('.category.tags .title');
  157. if (t) {
  158. const unreads = str2int(t.getAttribute('data-unread'));
  159. t.setAttribute('data-unread', numberFormat(unreads + nb));
  160. }
  161. }
  162. function removeArticle(div) {
  163. if (!div || div.classList.contains('not_read') || (context.auto_mark_article && div.classList.contains('active'))) {
  164. return;
  165. }
  166. let scrollTop = box_to_follow.scrollTop;
  167. let dirty = false;
  168. const p = div.previousElementSibling;
  169. const n = div.nextElementSibling;
  170. if (p && p.classList.contains('day') && n && n.classList.contains('day')) {
  171. scrollTop -= p.offsetHeight;
  172. dirty = true;
  173. p.remove();
  174. }
  175. if (div.offsetHeight > 0 && div.offsetParent.offsetTop + div.offsetTop + div.offsetHeight < scrollTop) {
  176. scrollTop -= div.offsetHeight;
  177. dirty = true;
  178. }
  179. div.remove();
  180. if (dirty) {
  181. box_to_follow.scrollTop = scrollTop;
  182. }
  183. }
  184. const pending_entries = {};
  185. let mark_read_queue = [];
  186. function send_mark_read_queue(queue, asRead, callback) {
  187. if (!queue || queue.length === 0) {
  188. if (callback) {
  189. callback();
  190. }
  191. return;
  192. }
  193. const req = new XMLHttpRequest();
  194. req.open('POST', '.?c=entry&a=read' + (asRead ? '' : '&is_read=0'), true);
  195. req.responseType = 'json';
  196. req.onerror = function (e) {
  197. for (let i = queue.length - 1; i >= 0; i--) {
  198. delete pending_entries['flux_' + queue[i]];
  199. }
  200. badAjax(this.status == 403);
  201. };
  202. req.onload = function (e) {
  203. if (this.status != 200) {
  204. return req.onerror(e);
  205. }
  206. const json = xmlHttpRequestJson(this);
  207. if (!json) {
  208. return req.onerror(e);
  209. }
  210. for (let i = queue.length - 1; i >= 0; i--) {
  211. const div = document.getElementById('flux_' + queue[i]);
  212. const myIcons = context.icons;
  213. let inc = 0;
  214. if (div.classList.contains('not_read')) {
  215. div.classList.remove('not_read');
  216. div.querySelectorAll('a.read').forEach(function (a) {
  217. a.href = a.href.replace('&is_read=0', '') + '&is_read=1';
  218. });
  219. div.querySelectorAll('a.read > .icon').forEach(function (img) { img.outerHTML = myIcons.read; });
  220. inc--;
  221. if (context.auto_remove_article) {
  222. removeArticle(div);
  223. }
  224. } else {
  225. div.classList.add('not_read');
  226. div.classList.add('keep_unread'); // Split for IE11
  227. div.querySelectorAll('a.read').forEach(function (a) {
  228. a.href = a.href.replace('&is_read=1', '');
  229. });
  230. div.querySelectorAll('a.read > .icon').forEach(function (img) { img.outerHTML = myIcons.unread; });
  231. inc++;
  232. }
  233. const feed_link = div.querySelector('.website > a, a.website');
  234. if (feed_link) {
  235. const feed_url = feed_link.href;
  236. const feed_id = feed_url.substr(feed_url.lastIndexOf('f_'));
  237. incUnreadsFeed(div, feed_id, inc);
  238. }
  239. delete pending_entries['flux_' + queue[i]];
  240. }
  241. faviconNbUnread();
  242. if (json.tags) {
  243. const tagIds = Object.keys(json.tags);
  244. for (let i = tagIds.length - 1; i >= 0; i--) {
  245. const tagId = tagIds[i];
  246. incUnreadsTag(tagId, (asRead ? -1 : 1) * json.tags[tagId].length);
  247. }
  248. }
  249. onScroll();
  250. if (callback) {
  251. callback();
  252. }
  253. };
  254. req.setRequestHeader('Content-Type', 'application/json');
  255. req.send(JSON.stringify({
  256. ajax: true,
  257. _csrf: context.csrf,
  258. id: queue,
  259. }));
  260. }
  261. let send_mark_read_queue_timeout = 0;
  262. function send_mark_queue_tick(callback) {
  263. send_mark_read_queue_timeout = 0;
  264. const queue = mark_read_queue.slice(0);
  265. mark_read_queue = [];
  266. send_mark_read_queue(queue, true, callback);
  267. }
  268. const delayedFunction = send_mark_queue_tick;
  269. function delayedClick(a) {
  270. if (a) {
  271. delayedFunction(function () { a.click(); });
  272. }
  273. }
  274. function mark_read(div, only_not_read, asBatch) {
  275. if (!div || !div.id || context.anonymous ||
  276. (only_not_read && !div.classList.contains('not_read'))) {
  277. return false;
  278. }
  279. if (pending_entries[div.id]) {
  280. return false;
  281. }
  282. pending_entries[div.id] = true;
  283. const asRead = div.classList.contains('not_read');
  284. const entryId = div.id.replace(/^flux_/, '');
  285. if (asRead && asBatch) {
  286. mark_read_queue.push(entryId);
  287. if (send_mark_read_queue_timeout == 0) {
  288. send_mark_read_queue_timeout = setTimeout(function () { send_mark_queue_tick(null); }, 1000);
  289. }
  290. } else {
  291. const queue = [entryId];
  292. send_mark_read_queue(queue, asRead);
  293. }
  294. }
  295. function mark_previous_read(div) {
  296. while (div) {
  297. mark_read(div, true, true);
  298. div = div.previousElementSibling;
  299. }
  300. }
  301. function mark_favorite(div) {
  302. if (!div) {
  303. return false;
  304. }
  305. const a = div.querySelector('a.bookmark');
  306. const url = a ? a.href : '';
  307. if (!url) {
  308. return false;
  309. }
  310. if (pending_entries[div.id]) {
  311. return false;
  312. }
  313. pending_entries[div.id] = true;
  314. const req = new XMLHttpRequest();
  315. req.open('POST', url, true);
  316. req.responseType = 'json';
  317. req.onerror = function (e) {
  318. delete pending_entries[div.id];
  319. badAjax(this.status == 403);
  320. };
  321. req.onload = function (e) {
  322. if (this.status != 200) {
  323. return req.onerror(e);
  324. }
  325. const json = xmlHttpRequestJson(this);
  326. if (!json) {
  327. return req.onerror(e);
  328. }
  329. let inc = 0;
  330. if (div.classList.contains('favorite')) {
  331. div.classList.remove('favorite');
  332. inc--;
  333. } else {
  334. div.classList.add('favorite');
  335. inc++;
  336. }
  337. div.querySelectorAll('a.bookmark').forEach(function (a) { a.href = json.url; });
  338. div.querySelectorAll('a.bookmark > .icon').forEach(function (img) { img.outerHTML = json.icon; });
  339. const favourites = document.querySelector('#aside_feed .favorites .title');
  340. if (favourites) {
  341. favourites.textContent = favourites.textContent.replace(/((?: \([\s0-9]+\))?\s*)$/, function (m, p1) {
  342. return incLabel(p1, inc, false);
  343. });
  344. }
  345. if (div.classList.contains('not_read')) {
  346. const elem = document.querySelector('#aside_feed .favorites .title');
  347. const feed_unreads = elem ? str2int(elem.getAttribute('data-unread')) : 0;
  348. if (elem) {
  349. elem.setAttribute('data-unread', numberFormat(feed_unreads + inc));
  350. }
  351. }
  352. delete pending_entries[div.id];
  353. };
  354. req.setRequestHeader('Content-Type', 'application/json');
  355. req.send(JSON.stringify({
  356. ajax: true,
  357. _csrf: context.csrf,
  358. }));
  359. }
  360. const freshrssOpenArticleEvent = document.createEvent('Event');
  361. freshrssOpenArticleEvent.initEvent('freshrss:openArticle', true, true);
  362. function toggleContent(new_active, old_active, skipping) {
  363. // If skipping, move current without activating or marking as read
  364. if (!new_active) {
  365. return;
  366. }
  367. if (context.does_lazyload && !skipping) {
  368. new_active.querySelectorAll('img[data-original], iframe[data-original]').forEach(function (el) {
  369. el.src = el.getAttribute('data-original');
  370. el.removeAttribute('data-original');
  371. });
  372. }
  373. if (old_active !== new_active) {
  374. if (!skipping) {
  375. new_active.classList.add('active');
  376. }
  377. new_active.classList.add('current');
  378. if (old_active) {
  379. old_active.classList.remove('active');
  380. old_active.classList.remove('current'); // Split for IE11
  381. if (context.auto_remove_article) {
  382. removeArticle(old_active);
  383. }
  384. }
  385. } else {
  386. new_active.classList.toggle('active');
  387. }
  388. const relative_move = context.current_view === 'global';
  389. const box_to_move = relative_move ? document.getElementById('panel') : document.scrollingElement;
  390. if (context.sticky_post) { // Stick the article to the top when opened
  391. const prev_article = new_active.previousElementSibling;
  392. let new_pos = new_active.offsetParent.offsetTop + new_active.offsetTop;
  393. if (prev_article && new_active.offsetTop - prev_article.offsetTop <= 150) {
  394. new_pos = prev_article.offsetParent.offsetTop + prev_article.offsetTop;
  395. if (relative_move) {
  396. new_pos -= box_to_move.offsetTop;
  397. }
  398. }
  399. if (skipping) {
  400. // when skipping, this feels more natural if it’s not so near the top
  401. new_pos -= document.body.clientHeight / 4;
  402. }
  403. if (relative_move) {
  404. new_pos += box_to_move.scrollTop;
  405. }
  406. box_to_move.scrollTop = new_pos;
  407. }
  408. if (new_active.classList.contains('active') && !skipping) {
  409. if (context.auto_mark_article) {
  410. mark_read(new_active, true, true);
  411. }
  412. new_active.dispatchEvent(freshrssOpenArticleEvent);
  413. }
  414. onScroll();
  415. }
  416. function prev_entry(skipping) {
  417. const old_active = document.querySelector('.flux.current');
  418. let new_active = old_active;
  419. if (new_active) {
  420. do new_active = new_active.previousElementSibling;
  421. while (new_active && !new_active.classList.contains('flux'));
  422. if (!new_active) {
  423. prev_feed();
  424. }
  425. } else {
  426. new_active = document.querySelector('.flux');
  427. }
  428. toggleContent(new_active, old_active, skipping);
  429. }
  430. function next_entry(skipping) {
  431. const old_active = document.querySelector('.flux.current');
  432. let new_active = old_active;
  433. if (new_active) {
  434. do new_active = new_active.nextElementSibling;
  435. while (new_active && !new_active.classList.contains('flux'));
  436. if (!new_active) {
  437. next_feed();
  438. }
  439. } else {
  440. new_active = document.querySelector('.flux');
  441. }
  442. toggleContent(new_active, old_active, skipping);
  443. }
  444. function next_unread_entry(skipping) {
  445. const old_active = document.querySelector('.flux.current');
  446. let new_active = old_active;
  447. if (new_active) {
  448. do new_active = new_active.nextElementSibling;
  449. while (new_active && !new_active.classList.contains('not_read'));
  450. if (!new_active) {
  451. next_feed();
  452. }
  453. } else {
  454. new_active = document.querySelector('.not_read');
  455. }
  456. toggleContent(new_active, old_active, skipping);
  457. }
  458. function prev_feed() {
  459. let found = false;
  460. let adjacent = null;
  461. const feeds = document.querySelectorAll('#aside_feed .feed');
  462. for (let i = feeds.length - 1; i >= 0; i--) {
  463. const feed = feeds[i];
  464. if (feed.classList.contains('active')) {
  465. found = true;
  466. continue;
  467. }
  468. if (!found) {
  469. continue;
  470. }
  471. if (getComputedStyle(feed).display === 'none') {
  472. continue;
  473. }
  474. if (feed.dataset.unread != 0) {
  475. return delayedClick(feed.querySelector('a.item-title'));
  476. } else if (adjacent === null) {
  477. adjacent = feed;
  478. }
  479. }
  480. if (found) {
  481. delayedClick(adjacent.querySelector('a.item-title'));
  482. } else {
  483. last_feed();
  484. }
  485. }
  486. function next_feed() {
  487. let found = false;
  488. let adjacent = null;
  489. const feeds = document.querySelectorAll('#aside_feed .feed');
  490. for (let i = 0; i < feeds.length; i++) {
  491. const feed = feeds[i];
  492. if (feed.classList.contains('active')) {
  493. found = true;
  494. continue;
  495. }
  496. if (!found) {
  497. continue;
  498. }
  499. if (getComputedStyle(feed).display === 'none') {
  500. continue;
  501. }
  502. if (feed.dataset.unread != 0) {
  503. return delayedClick(feed.querySelector('a.item-title'));
  504. } else if (adjacent === null) {
  505. adjacent = feed;
  506. }
  507. }
  508. if (found) {
  509. delayedClick(adjacent.querySelector('a.item-title'));
  510. } else {
  511. first_feed();
  512. }
  513. }
  514. function first_feed() {
  515. const a = document.querySelector('#aside_feed .category.active .feed:not([data-unread="0"]) a.item-title');
  516. delayedClick(a);
  517. }
  518. function last_feed() {
  519. const links = document.querySelectorAll('#aside_feed .category.active .feed:not([data-unread="0"]) a.item-title');
  520. if (links && links.length > 0) {
  521. delayedClick(links[links.length - 1]);
  522. }
  523. }
  524. function prev_category() {
  525. const active_cat = document.querySelector('#aside_feed .category.active');
  526. if (active_cat) {
  527. let cat = active_cat;
  528. do cat = cat.previousElementSibling;
  529. while (cat && getComputedStyle(cat).display === 'none');
  530. if (cat) {
  531. delayedClick(cat.querySelector('a.title'));
  532. }
  533. } else {
  534. last_category();
  535. }
  536. }
  537. function next_category() {
  538. const active_cat = document.querySelector('#aside_feed .category.active');
  539. if (active_cat) {
  540. let cat = active_cat;
  541. do cat = cat.nextElementSibling;
  542. while (cat && getComputedStyle(cat).display === 'none');
  543. if (cat) {
  544. delayedClick(cat.querySelector('a.title'));
  545. }
  546. } else {
  547. first_category();
  548. }
  549. }
  550. function next_unread_category() {
  551. const active_cat = document.querySelector('#aside_feed .category.active');
  552. if (active_cat) {
  553. let cat = active_cat;
  554. do cat = cat.nextElementSibling;
  555. while (cat && cat.getAttribute('data-unread') <= 0);
  556. if (cat) {
  557. delayedClick(cat.querySelector('a.title'));
  558. }
  559. } else {
  560. first_category();
  561. }
  562. }
  563. function first_category() {
  564. const a = document.querySelector('#aside_feed .category:not([data-unread="0"]) a.title');
  565. delayedClick(a);
  566. }
  567. function last_category() {
  568. const links = document.querySelectorAll('#aside_feed .category:not([data-unread="0"]) a.title');
  569. if (links && links.length > 0) {
  570. delayedClick(links[links.length - 1]);
  571. }
  572. }
  573. function collapse_entry() {
  574. const flux_current = document.querySelector('.flux.current');
  575. toggleContent(flux_current, flux_current, false);
  576. }
  577. function toggle_media() {
  578. const media = document.querySelector('.flux.current video,.flux.current audio');
  579. if (media === null) {
  580. return;
  581. }
  582. if (media.paused) {
  583. media.play();
  584. } else {
  585. media.pause();
  586. }
  587. }
  588. function user_filter(key) {
  589. const filter = document.getElementById('dropdown-query');
  590. const filters = filter.parentElement.querySelectorAll('.dropdown-menu > .query > a');
  591. if (typeof key === 'undefined') {
  592. if (!filters.length) {
  593. return;
  594. }
  595. // Display the filter div
  596. location.hash = filter.id;
  597. // Force scrolling to the filter div
  598. const scroll = needsScroll(document.querySelector('.header'));
  599. if (scroll !== 0) {
  600. document.scrollingElement.scrollTop = scroll;
  601. }
  602. // Force the key value if there is only one action, so we can trigger it automatically
  603. if (filters.length === 1) {
  604. key = 1;
  605. } else {
  606. return;
  607. }
  608. }
  609. // Trigger selected share action
  610. key = parseInt(key);
  611. if (key <= filters.length) {
  612. filters[key - 1].click();
  613. }
  614. }
  615. function auto_share(key) {
  616. const share = document.querySelector('.flux.current.active .dropdown-target[id^="dropdown-share"]');
  617. if (!share) {
  618. return;
  619. }
  620. const shares = share.parentElement.querySelectorAll('.dropdown-menu .item a');
  621. if (typeof key === 'undefined') {
  622. // Display the share div
  623. location.hash = share.id;
  624. // Force scrolling to the share div
  625. const scrollTop = needsScroll(share.closest('.bottom'));
  626. if (scrollTop !== 0) {
  627. document.scrollingElement.scrollTop = scrollTop;
  628. }
  629. // Force the key value if there is only one action, so we can trigger it automatically
  630. if (shares.length === 1) {
  631. key = 1;
  632. } else {
  633. return;
  634. }
  635. }
  636. // Trigger selected share action and hide the share div
  637. key = parseInt(key);
  638. if (key <= shares.length) {
  639. shares[key - 1].click();
  640. share.parentElement.querySelector('.dropdown-menu + a.dropdown-close').click();
  641. }
  642. }
  643. let box_to_follow;
  644. function onScroll() {
  645. if (!box_to_follow) {
  646. return;
  647. }
  648. if (context.auto_mark_scroll) {
  649. const hidden_px = -5; // negative = pixels over the edge
  650. const minTop = hidden_px + box_to_follow.scrollTop;
  651. document.querySelectorAll('.not_read:not(.keep_unread)').forEach(function (div) {
  652. if (div.offsetHeight > 0 &&
  653. div.offsetParent.offsetTop + div.offsetTop + div.offsetHeight < minTop) {
  654. mark_read(div, true, true);
  655. }
  656. });
  657. }
  658. if (context.auto_load_more) {
  659. const streamFooter = document.getElementById('stream-footer');
  660. if (streamFooter && box_to_follow.offsetHeight > 0 &&
  661. box_to_follow.scrollTop + box_to_follow.offsetHeight + (window.innerHeight / 2) >= streamFooter.offsetTop) {
  662. load_more_posts();
  663. }
  664. }
  665. }
  666. function init_posts() {
  667. if (context.auto_load_more || context.auto_mark_scroll || context.auto_remove_article) {
  668. box_to_follow = context.current_view === 'global' ? document.getElementById('panel') : document.scrollingElement;
  669. let lastScroll = 0; // Throttle
  670. let timerId = 0;
  671. (box_to_follow === document.scrollingElement ? window : box_to_follow).onscroll = function () {
  672. clearTimeout(timerId);
  673. if (lastScroll + 500 < Date.now()) {
  674. lastScroll = Date.now();
  675. onScroll();
  676. } else {
  677. timerId = setTimeout(onScroll, 500);
  678. }
  679. };
  680. onScroll();
  681. }
  682. if (!navigator.share && document.styleSheets.length > 0) {
  683. // https://developer.mozilla.org/en-US/docs/Web/API/Navigator/share
  684. // do not show the menu entry if browser does not support navigator.share
  685. document.styleSheets[0].insertRule(
  686. 'button.as-link[data-type="web-sharing-api"] {display: none !important;}',
  687. document.styleSheets[0].cssRules.length
  688. );
  689. }
  690. }
  691. function rememberOpenCategory(category_id, isOpen) {
  692. if (context.display_categories === 'remember') {
  693. const open_categories = JSON.parse(localStorage.getItem('FreshRSS_open_categories') || '{}');
  694. if (isOpen) {
  695. open_categories[category_id] = true;
  696. } else {
  697. delete open_categories[category_id];
  698. }
  699. localStorage.setItem('FreshRSS_open_categories', JSON.stringify(open_categories));
  700. }
  701. }
  702. function openCategory(category_id) {
  703. const category_element = document.getElementById(category_id);
  704. category_element.querySelector('.tree-folder-items').classList.add('active');
  705. const img = category_element.querySelector('a.dropdown-toggle img');
  706. img.src = img.src.replace('/icons/down.', '/icons/up.');
  707. img.alt = '🔼';
  708. }
  709. function loadJs(name) {
  710. if (!document.getElementById(name)) {
  711. const script = document.createElement('script');
  712. script.setAttribute('id', name);
  713. script.setAttribute('src', '../scripts/' + name + '?' + context.mtime[name]);
  714. script.setAttribute('defer', 'defer');
  715. script.setAttribute('async', 'async');
  716. document.head.appendChild(script);
  717. }
  718. }
  719. function init_column_categories() {
  720. if (context.current_view !== 'normal' && context.current_view !== 'reader') {
  721. return;
  722. }
  723. // Restore sidebar scroll position
  724. document.getElementById('sidebar').scrollTop = +sessionStorage.getItem('FreshRSS_sidebar_scrollTop');
  725. // Restore open categories
  726. if (context.display_categories === 'remember') {
  727. const open_categories = JSON.parse(localStorage.getItem('FreshRSS_open_categories') || '{}');
  728. Object.keys(open_categories).forEach(function (category_id) {
  729. openCategory(category_id);
  730. });
  731. }
  732. document.getElementById('aside_feed').onclick = function (ev) {
  733. let a = ev.target.closest('.tree-folder > .tree-folder-title > a.dropdown-toggle');
  734. if (a) {
  735. const icon = a.querySelector('.icon');
  736. const category_id = a.closest('.category').id;
  737. if (icon.alt === '🔽' || icon.innerHTML === '🔽') {
  738. if (icon.src) {
  739. icon.src = icon.src.replace('/icons/down.', '/icons/up.');
  740. icon.alt = '🔼';
  741. } else {
  742. icon.innerHTML = '🔼';
  743. }
  744. rememberOpenCategory(category_id, true);
  745. } else {
  746. if (icon.src) {
  747. icon.src = icon.src.replace('/icons/up.', '/icons/down.');
  748. icon.alt = '🔽';
  749. } else {
  750. icon.innerHTML = '🔽';
  751. }
  752. rememberOpenCategory(category_id, false);
  753. }
  754. const ul = a.closest('li').querySelector('.tree-folder-items');
  755. let nbVisibleItems = 0;
  756. for (let i = ul.children.length - 1; i >= 0; i--) {
  757. if (ul.children[i].offsetHeight) {
  758. nbVisibleItems++;
  759. }
  760. }
  761. ul.classList.toggle('active');
  762. // CSS transition does not work on max-height:auto
  763. ul.style.maxHeight = ul.classList.contains('active') ? (nbVisibleItems * 4) + 'em' : 0;
  764. return false;
  765. }
  766. a = ev.target.closest('.tree-folder-items > .feed .dropdown-toggle');
  767. if (a) {
  768. loadJs('extra.js');
  769. loadJs('feed.js');
  770. const itemId = a.closest('.item').id;
  771. const templateId = itemId.substring(0, 2) === 't_' ? 'tag_config_template' : 'feed_config_template';
  772. const id = itemId.substr(2);
  773. const feed_web = a.getAttribute('data-fweb');
  774. const div = a.parentElement;
  775. const dropdownMenu = div.querySelector('.dropdown-menu');
  776. const template = document.getElementById(templateId)
  777. .innerHTML.replace(/------/g, id).replace('http://example.net/', feed_web);
  778. if (!dropdownMenu) {
  779. a.href = '#dropdown-' + id;
  780. div.querySelector('.dropdown-target').id = 'dropdown-' + id;
  781. div.insertAdjacentHTML('beforeend', template);
  782. if (feed_web.length < 1) {
  783. div.querySelector('.item.link.website').remove();
  784. }
  785. const b = div.querySelector('button.confirm');
  786. if (b) {
  787. b.disabled = false;
  788. }
  789. } else if (getComputedStyle(dropdownMenu).display === 'none') {
  790. const id2 = div.closest('.item').id.substr(2);
  791. a.href = '#dropdown-' + id2;
  792. } else {
  793. a.href = '#close';
  794. }
  795. return true;
  796. }
  797. return true;
  798. };
  799. }
  800. function init_shortcuts() {
  801. Object.keys(context.shortcuts).forEach(function (k) {
  802. context.shortcuts[k] = (context.shortcuts[k] || '').toUpperCase();
  803. });
  804. document.addEventListener('keydown', ev => {
  805. if (ev.target.closest('input, textarea') ||
  806. ev.ctrlKey || ev.metaKey || (ev.altKey && ev.shiftKey)) {
  807. return;
  808. }
  809. const s = context.shortcuts;
  810. let k = (ev.key.trim() || ev.code || 'Space').toUpperCase();
  811. // IE11
  812. if (k === 'SPACEBAR') k = 'SPACE';
  813. else if (k === 'DEL') k = 'DELETE';
  814. else if (k === 'ESC') k = 'ESCAPE';
  815. if (location.hash.match(/^#dropdown-/)) {
  816. const n = parseInt(k);
  817. if (n) {
  818. if (location.hash === '#dropdown-query') {
  819. user_filter(n);
  820. } else {
  821. auto_share(n);
  822. }
  823. ev.preventDefault();
  824. return;
  825. }
  826. }
  827. if (k === s.actualize) {
  828. const btn = document.getElementById('actualize');
  829. if (btn) {
  830. btn.click();
  831. }
  832. ev.preventDefault();
  833. return;
  834. }
  835. if (k === s.next_entry) {
  836. if (ev.altKey) {
  837. next_category();
  838. } else if (ev.shiftKey) {
  839. next_feed();
  840. } else {
  841. next_entry(false);
  842. }
  843. ev.preventDefault();
  844. return;
  845. }
  846. if (k === s.next_unread_entry) {
  847. if (ev.altKey) {
  848. next_unread_category();
  849. } else if (ev.shiftKey) {
  850. next_feed();
  851. } else {
  852. next_unread_entry(false);
  853. }
  854. ev.preventDefault();
  855. return;
  856. }
  857. if (k === s.prev_entry) {
  858. if (ev.altKey) {
  859. prev_category();
  860. } else if (ev.shiftKey) {
  861. prev_feed();
  862. } else {
  863. prev_entry(false);
  864. }
  865. ev.preventDefault();
  866. return;
  867. }
  868. if (k === s.mark_read) {
  869. if (ev.altKey) {
  870. mark_previous_read(document.querySelector('.flux.current'));
  871. } else if (ev.shiftKey) {
  872. document.querySelector('.nav_menu .read_all').click();
  873. } else { // Toggle the read state
  874. mark_read(document.querySelector('.flux.current'), false, false);
  875. }
  876. ev.preventDefault();
  877. return;
  878. }
  879. if (k === s.first_entry) {
  880. if (ev.altKey) {
  881. first_category();
  882. } else if (ev.shiftKey) {
  883. first_feed();
  884. } else {
  885. const old_active = document.querySelector('.flux.current');
  886. const first = document.querySelector('.flux');
  887. if (first.classList.contains('flux')) {
  888. toggleContent(first, old_active, false);
  889. }
  890. }
  891. ev.preventDefault();
  892. return;
  893. }
  894. if (k === s.last_entry) {
  895. if (ev.altKey) {
  896. last_category();
  897. } else if (ev.shiftKey) {
  898. last_feed();
  899. } else {
  900. const old_active = document.querySelector('.flux.current');
  901. const last = document.querySelector('.flux:last-of-type');
  902. if (last.classList.contains('flux')) {
  903. toggleContent(last, old_active, false);
  904. }
  905. }
  906. ev.preventDefault();
  907. return;
  908. }
  909. if (ev.altKey || ev.shiftKey) {
  910. return;
  911. }
  912. if (k === s.mark_favorite) { // Toggle the favorite state
  913. mark_favorite(document.querySelector('.flux.current'));
  914. ev.preventDefault();
  915. return;
  916. }
  917. if (k === s.go_website) {
  918. if (context.auto_mark_site) {
  919. mark_read(document.querySelector('.flux.current'), true, false);
  920. }
  921. const newWindow = window.open();
  922. if (newWindow) {
  923. newWindow.opener = null;
  924. newWindow.location = document.querySelector('.flux.current a.go_website').href;
  925. }
  926. ev.preventDefault();
  927. return;
  928. }
  929. if (k === s.skip_next_entry) { next_entry(true); ev.preventDefault(); return; }
  930. if (k === s.skip_prev_entry) { prev_entry(true); ev.preventDefault(); return; }
  931. if (k === s.collapse_entry) { collapse_entry(); ev.preventDefault(); return; }
  932. if (k === s.auto_share) { auto_share(); ev.preventDefault(); return; }
  933. if (k === s.user_filter) { user_filter(); ev.preventDefault(); return; }
  934. if (k === s.load_more) { load_more_posts(); ev.preventDefault(); return; }
  935. if (k === s.close_dropdown) { location.hash = null; ev.preventDefault(); return; }
  936. if (k === s.help) { window.open(context.urls.help); ev.preventDefault(); return; }
  937. if (k === s.focus_search) { document.getElementById('search').focus(); ev.preventDefault(); return; }
  938. if (k === s.normal_view) { delayedClick(document.querySelector('#nav_menu_views .view-normal')); ev.preventDefault(); return; }
  939. if (k === s.reading_view) { delayedClick(document.querySelector('#nav_menu_views .view-reader')); ev.preventDefault(); return; }
  940. if (k === s.global_view) { delayedClick(document.querySelector('#nav_menu_views .view-global')); ev.preventDefault(); return; }
  941. if (k === s.rss_view) { delayedClick(document.querySelector('#nav_menu_views .view-rss')); ev.preventDefault(); return; }
  942. if (k === s.toggle_media) { toggle_media(); ev.preventDefault(); }
  943. });
  944. }
  945. function init_stream(stream) {
  946. stream.onclick = function (ev) {
  947. let el = ev.target.closest('.flux a.read');
  948. if (el) {
  949. mark_read(el.closest('.flux'), false, false);
  950. return false;
  951. }
  952. el = ev.target.closest('.flux a.bookmark');
  953. if (el) {
  954. mark_favorite(el.closest('.flux'));
  955. return false;
  956. }
  957. el = ev.target.closest('.dynamictags');
  958. if (el) {
  959. loadDynamicTags(el);
  960. return true;
  961. }
  962. el = ev.target.closest('.item.title > a');
  963. if (el) { // Allow default control-click behaviour such as open in background-tab
  964. return ev.ctrlKey;
  965. }
  966. el = ev.target.closest('.flux .content .text a');
  967. if (el) {
  968. if (!el.closest('div').classList.contains('author')) {
  969. el.target = '_blank';
  970. el.rel = 'noreferrer';
  971. }
  972. return true;
  973. }
  974. el = ev.target.closest('.item.share > button[data-type="print"]');
  975. if (el) { // Print
  976. const tmp_window = window.open();
  977. for (let i = 0; i < document.styleSheets.length; i++) {
  978. tmp_window.document.writeln('<link href="' + document.styleSheets[i].href + '" rel="stylesheet" type="text/css" />');
  979. }
  980. tmp_window.document.writeln(el.closest('.flux_content').querySelector('.content').innerHTML);
  981. tmp_window.document.close();
  982. tmp_window.focus();
  983. tmp_window.print();
  984. tmp_window.close();
  985. return false;
  986. }
  987. el = ev.target.closest('.item.share > button[data-type="clipboard"]');
  988. if (el && navigator.clipboard) { // Clipboard
  989. navigator.clipboard.writeText(el.dataset.url);
  990. return false;
  991. }
  992. el = ev.target.closest('.item.share > button[data-type="web-sharing-api"]');
  993. if (el && navigator.share) { // https://developer.mozilla.org/en-US/docs/Web/API/Navigator/share
  994. const shareData = {
  995. url: el.dataset.url,
  996. title: decodeURI(el.dataset.title),
  997. };
  998. navigator.share(shareData);
  999. return false;
  1000. }
  1001. el = ev.target.closest('.item.share > a[href="POST"]');
  1002. if (el) { // Share by POST
  1003. const f = el.parentElement.querySelector('form');
  1004. f.disabled = false;
  1005. f.submit();
  1006. return false;
  1007. }
  1008. el = ev.target.closest('.flux_header, .flux_content');
  1009. if (el) { // flux_toggle
  1010. if (ev.target.closest('.content, .item.website, .item.link, .dropdown')) {
  1011. return true;
  1012. }
  1013. if (!context.sides_close_article && ev.target.matches('div.flux_content')) {
  1014. // setting for not-closing after clicking outside article area
  1015. return false;
  1016. }
  1017. const old_active = document.querySelector('.flux.current');
  1018. const new_active = el.parentNode;
  1019. if (ev.target.tagName.toUpperCase() === 'A') { // Leave real links alone (but does not catch img in a link)
  1020. if (context.auto_mark_article) {
  1021. mark_read(new_active, true, false);
  1022. }
  1023. return true;
  1024. }
  1025. toggleContent(new_active, old_active, false);
  1026. return false;
  1027. }
  1028. };
  1029. stream.onmouseup = function (ev) { // Mouseup enables us to catch middle click, and control+click in IE/Edge
  1030. if (ev.altKey || ev.metaKey || ev.shiftKey) {
  1031. return;
  1032. }
  1033. let el = ev.target.closest('.item.title > a');
  1034. if (el) {
  1035. if (ev.which == 1) {
  1036. if (ev.ctrlKey) { // Control+click
  1037. if (context.auto_mark_site) {
  1038. mark_read(el.closest('.flux'), true, false);
  1039. }
  1040. } else {
  1041. el.parentElement.click(); // Normal click, just toggle article.
  1042. }
  1043. } else if (ev.which == 2 && !ev.ctrlKey) { // Simple middle click: same behaviour as CTRL+click
  1044. if (context.auto_mark_article) {
  1045. const new_active = el.closest('.flux');
  1046. mark_read(new_active, true, false);
  1047. }
  1048. }
  1049. return;
  1050. }
  1051. if (context.auto_mark_site) {
  1052. // catch mouseup instead of click so we can have the correct behaviour
  1053. // with middle button click (scroll button).
  1054. el = ev.target.closest('.flux .link > a');
  1055. if (el) {
  1056. if (ev.which == 3) {
  1057. return;
  1058. }
  1059. mark_read(el.closest('.flux'), true, false);
  1060. }
  1061. }
  1062. };
  1063. stream.onchange = function (ev) {
  1064. const checkboxTag = ev.target.closest('.checkboxTag');
  1065. if (checkboxTag) { // Dynamic tags
  1066. ev.stopPropagation();
  1067. const tagId = checkboxTag.name.replace(/^t_/, '');
  1068. const tagName = checkboxTag.nextElementSibling ? checkboxTag.nextElementSibling.childNodes[0].value : '';
  1069. if ((tagId == 0 && tagName.length > 0) || tagId != 0) {
  1070. const isChecked = checkboxTag.checked;
  1071. const entry = checkboxTag.closest('div.flux');
  1072. const entryId = entry.id.replace(/^flux_/, '');
  1073. checkboxTag.disabled = true;
  1074. const req = new XMLHttpRequest();
  1075. req.open('POST', './?c=tag&a=tagEntry', true);
  1076. req.responseType = 'json';
  1077. req.onerror = function (e) {
  1078. checkboxTag.checked = !isChecked;
  1079. badAjax(this.status == 403);
  1080. };
  1081. req.onload = function (e) {
  1082. if (this.status != 200) {
  1083. return req.onerror(e);
  1084. }
  1085. if (entry.classList.contains('not_read')) {
  1086. incUnreadsTag('t_' + tagId, isChecked ? 1 : -1);
  1087. }
  1088. };
  1089. req.onloadend = function (e) {
  1090. checkboxTag.disabled = false;
  1091. if (tagId == 0) {
  1092. loadDynamicTags(checkboxTag.closest('div.dropdown'));
  1093. }
  1094. };
  1095. req.setRequestHeader('Content-Type', 'application/json');
  1096. req.send(JSON.stringify({
  1097. _csrf: context.csrf,
  1098. id_tag: tagId,
  1099. name_tag: tagId == 0 ? tagName : '',
  1100. id_entry: entryId,
  1101. checked: isChecked,
  1102. ajax: 1,
  1103. }));
  1104. }
  1105. }
  1106. };
  1107. }
  1108. function init_nav_entries() {
  1109. const nav_entries = document.getElementById('nav_entries');
  1110. if (nav_entries) {
  1111. nav_entries.querySelector('.previous_entry').onclick = function (e) {
  1112. prev_entry(false);
  1113. return false;
  1114. };
  1115. nav_entries.querySelector('.next_entry').onclick = function (e) {
  1116. next_entry(false);
  1117. return false;
  1118. };
  1119. nav_entries.querySelector('.up').onclick = function (e) {
  1120. const active_item = (document.querySelector('.flux.current') || document.querySelector('.flux'));
  1121. const windowTop = document.scrollingElement.scrollTop;
  1122. const item_top = active_item.offsetParent.offsetTop + active_item.offsetTop;
  1123. document.scrollingElement.scrollTop = windowTop > item_top ? item_top : 0;
  1124. return false;
  1125. };
  1126. }
  1127. }
  1128. function loadDynamicTags(div) {
  1129. div.classList.remove('dynamictags');
  1130. div.querySelectorAll('li.item').forEach(function (li) { li.remove(); });
  1131. const entryId = div.closest('div.flux').id.replace(/^flux_/, '');
  1132. const req = new XMLHttpRequest();
  1133. req.open('GET', './?c=tag&a=getTagsForEntry&id_entry=' + entryId, true);
  1134. req.responseType = 'json';
  1135. req.onerror = function (e) {
  1136. div.querySelectorAll('li.item').forEach(function (li) { li.remove(); });
  1137. div.classList.add('dynamictags');
  1138. };
  1139. req.onload = function (e) {
  1140. if (this.status != 200) {
  1141. return req.onerror(e);
  1142. }
  1143. const json = xmlHttpRequestJson(this);
  1144. if (!json) {
  1145. return req.onerror(e);
  1146. }
  1147. const li_item0 = document.createElement('li');
  1148. li_item0.setAttribute('class', 'item addItem');
  1149. const label = document.createElement('label');
  1150. label.setAttribute('class', 'noHover');
  1151. const input_checkboxTag = document.createElement('input');
  1152. input_checkboxTag.setAttribute('class', 'checkboxTag checkboxNewTag');
  1153. input_checkboxTag.setAttribute('name', 't_0');
  1154. input_checkboxTag.setAttribute('type', 'checkbox');
  1155. const input_newTag = document.createElement('input');
  1156. input_newTag.setAttribute('type', 'text');
  1157. input_newTag.setAttribute('name', 'newTag');
  1158. input_newTag.addEventListener('keydown', function (ev) { if (ev.key.toUpperCase() == 'ENTER') { this.parentNode.previousSibling.click(); } });
  1159. const button_btn = document.createElement('button');
  1160. button_btn.setAttribute('type', 'button');
  1161. button_btn.setAttribute('class', 'btn');
  1162. button_btn.addEventListener('click', function () { this.parentNode.parentNode.click(); });
  1163. const text_plus = document.createTextNode('+');
  1164. const div_stick = document.createElement('div');
  1165. div_stick.setAttribute('class', 'stick');
  1166. button_btn.appendChild(text_plus);
  1167. div_stick.appendChild(input_newTag);
  1168. div_stick.appendChild(button_btn);
  1169. label.appendChild(input_checkboxTag);
  1170. label.appendChild(div_stick);
  1171. li_item0.appendChild(label);
  1172. div.querySelector('.dropdown-menu').appendChild(li_item0);
  1173. let html = '';
  1174. if (json && json.length) {
  1175. for (let i = 0; i < json.length; i++) {
  1176. const tag = json[i];
  1177. html += '<li class="item"><label><input class="checkboxTag" name="t_' + tag.id + '" type="checkbox"' +
  1178. (tag.checked ? ' checked="checked"' : '') + '> ' + tag.name + '</label></li>';
  1179. }
  1180. }
  1181. div.querySelector('.dropdown-menu').insertAdjacentHTML('beforeend', html);
  1182. };
  1183. req.send();
  1184. }
  1185. // <actualize>
  1186. let feeds_processed = 0;
  1187. let categories_processed = 0;
  1188. let to_process = 0;
  1189. function refreshFeed(feeds, feeds_count) {
  1190. const feed = feeds.pop();
  1191. if (!feed) {
  1192. return;
  1193. }
  1194. const req = new XMLHttpRequest();
  1195. req.open('POST', feed.url, true);
  1196. req.onloadend = function (e) {
  1197. feeds_processed++;
  1198. if (this.status != 200) {
  1199. badAjax(false);
  1200. } else {
  1201. const div = document.getElementById('actualizeProgress');
  1202. div.querySelector('.progress').innerHTML = (categories_processed + feeds_processed) + ' / ' + to_process;
  1203. div.querySelector('.title').innerHTML = feed.title;
  1204. }
  1205. if (feeds_processed === feeds_count) {
  1206. // Empty request to commit new articles
  1207. const req2 = new XMLHttpRequest();
  1208. req2.open('POST', './?c=feed&a=actualize&id=-1&ajax=1', true);
  1209. req2.onloadend = function (e) {
  1210. delayedFunction(function () { location.reload(); });
  1211. };
  1212. req2.setRequestHeader('Content-Type', 'application/json');
  1213. req2.send(JSON.stringify({
  1214. _csrf: context.csrf,
  1215. noCommit: 0,
  1216. }));
  1217. } else {
  1218. refreshFeed(feeds, feeds_count);
  1219. }
  1220. };
  1221. req.setRequestHeader('Content-Type', 'application/json');
  1222. req.send(JSON.stringify({
  1223. _csrf: context.csrf,
  1224. noCommit: 1,
  1225. }));
  1226. }
  1227. function refreshFeeds(json) {
  1228. feeds_processed = 0;
  1229. if (!json.feeds || json.feeds.length === 0) {
  1230. // Empty request to commit new articles
  1231. const req2 = new XMLHttpRequest();
  1232. req2.open('POST', './?c=feed&a=actualize&id=-1&ajax=1', true);
  1233. req2.onloadend = function (e) {
  1234. context.ajax_loading = false;
  1235. };
  1236. req2.setRequestHeader('Content-Type', 'application/json');
  1237. req2.send(JSON.stringify({
  1238. _csrf: context.csrf,
  1239. noCommit: 0,
  1240. }));
  1241. } else {
  1242. const feeds_count = json.feeds.length;
  1243. for (let i = 10; i > 0; i--) {
  1244. refreshFeed(json.feeds, feeds_count);
  1245. }
  1246. }
  1247. }
  1248. function refreshDynamicOpml(categories, categories_count, next) {
  1249. const category = categories.pop();
  1250. if (!category) {
  1251. return;
  1252. }
  1253. const req = new XMLHttpRequest();
  1254. req.open('POST', category.url, true);
  1255. req.onloadend = function (e) {
  1256. categories_processed++;
  1257. if (this.status != 200) {
  1258. badAjax(false);
  1259. } else {
  1260. const div = document.getElementById('actualizeProgress');
  1261. div.querySelector('.progress').innerHTML = (categories_processed + feeds_processed) + ' / ' + to_process;
  1262. div.querySelector('.title').innerHTML = category.title;
  1263. }
  1264. if (categories_processed === categories_count) {
  1265. if (next) { next(); }
  1266. } else {
  1267. refreshDynamicOpml(categories, categories_count, next);
  1268. }
  1269. };
  1270. req.setRequestHeader('Content-Type', 'application/json');
  1271. req.send(JSON.stringify({
  1272. _csrf: context.csrf,
  1273. noCommit: 1,
  1274. }));
  1275. }
  1276. function refreshDynamicOpmls(json, next) {
  1277. categories_processed = 0;
  1278. if (json.categories && json.categories.length > 0) {
  1279. const categories_count = json.categories.length;
  1280. for (let i = 10; i > 0; i--) {
  1281. refreshDynamicOpml(json.categories, categories_count, next);
  1282. }
  1283. } else {
  1284. if (next) { next(); }
  1285. }
  1286. }
  1287. function init_actualize() {
  1288. let auto = false;
  1289. let nbCategoriesFirstRound = 0;
  1290. let skipCategories = false;
  1291. const actualize = document.getElementById('actualize');
  1292. if (!actualize) {
  1293. return;
  1294. }
  1295. actualize.onclick = function () {
  1296. if (context.ajax_loading) {
  1297. return false;
  1298. }
  1299. context.ajax_loading = true;
  1300. const req = new XMLHttpRequest();
  1301. req.open('POST', './?c=javascript&a=actualize', true);
  1302. req.responseType = 'json';
  1303. req.onload = function (e) {
  1304. if (this.status != 200) {
  1305. return badAjax(false);
  1306. }
  1307. const json = xmlHttpRequestJson(this);
  1308. if (!json) {
  1309. return badAjax(false);
  1310. }
  1311. if (auto && json.categories.length < 1 && json.feeds.length < 1) {
  1312. auto = false;
  1313. context.ajax_loading = false;
  1314. return false;
  1315. }
  1316. to_process = json.categories.length + json.feeds.length + nbCategoriesFirstRound;
  1317. if (json.categories.length + json.feeds.length > 0 && !document.getElementById('actualizeProgress')) {
  1318. document.body.insertAdjacentHTML('beforeend', '<div id="actualizeProgress" class="notification good">' +
  1319. json.feedback_actualize + '<br /><span class="title">/</span><br /><span class="progress">0 / ' +
  1320. to_process + '</span></div>');
  1321. } else {
  1322. openNotification(json.feedback_no_refresh, 'good');
  1323. }
  1324. if (json.categories.length > 0 && !skipCategories) {
  1325. skipCategories = true; // To avoid risk of infinite loop
  1326. nbCategoriesFirstRound = json.categories.length;
  1327. // If some dynamic OPML categories are refreshed, need to reload the list of feeds before updating them
  1328. refreshDynamicOpmls(json, () => {
  1329. context.ajax_loading = false;
  1330. actualize.click();
  1331. });
  1332. } else {
  1333. refreshFeeds(json);
  1334. }
  1335. };
  1336. req.setRequestHeader('Content-Type', 'application/json');
  1337. req.send(JSON.stringify({
  1338. _csrf: context.csrf,
  1339. }));
  1340. return false;
  1341. };
  1342. if (context.auto_actualize_feeds) {
  1343. auto = true;
  1344. actualize.click();
  1345. }
  1346. }
  1347. // </actualize>
  1348. // <notification>
  1349. let notification = null;
  1350. let notification_interval = null;
  1351. let notification_working = false;
  1352. function openNotification(msg, status) {
  1353. if (notification_working === true) {
  1354. return false;
  1355. }
  1356. notification_working = true;
  1357. notification.querySelector('.msg').innerHTML = msg;
  1358. notification.className = 'notification';
  1359. notification.classList.add(status);
  1360. if (status == 'good') {
  1361. notification_interval = setTimeout(closeNotification, 4000);
  1362. } else {
  1363. // no status or f.e. status = 'bad', give some more time to read
  1364. notification_interval = setTimeout(closeNotification, 8000);
  1365. }
  1366. }
  1367. function closeNotification() {
  1368. notification.classList.add('closed');
  1369. clearInterval(notification_interval);
  1370. notification_working = false;
  1371. }
  1372. function init_notifications() {
  1373. notification = document.getElementById('notification');
  1374. notification.querySelector('a.close').addEventListener('click', function (ev) {
  1375. closeNotification();
  1376. ev.preventDefault();
  1377. return false;
  1378. });
  1379. notification.addEventListener('mouseenter', function () {
  1380. clearInterval(notification_interval);
  1381. });
  1382. notification.addEventListener('mouseleave', function () {
  1383. notification_interval = setTimeout(closeNotification, 3000);
  1384. });
  1385. if (notification.querySelector('.msg').innerHTML.length > 0) {
  1386. notification_working = true;
  1387. if (notification.classList.contains('good')) {
  1388. notification_interval = setTimeout(closeNotification, 4000);
  1389. } else {
  1390. // no status or f.e. status = 'bad', give some more time to read
  1391. notification_interval = setTimeout(closeNotification, 8000);
  1392. }
  1393. }
  1394. }
  1395. // </notification>
  1396. // <notifs html5>
  1397. let notifs_html5_permission = 'denied';
  1398. function notifs_html5_is_supported() {
  1399. return window.Notification !== undefined;
  1400. }
  1401. function notifs_html5_ask_permission() {
  1402. window.Notification.requestPermission(function () {
  1403. notifs_html5_permission = window.Notification.permission;
  1404. });
  1405. }
  1406. function notifs_html5_show(nb, nb_new) {
  1407. if (notifs_html5_permission !== 'granted') {
  1408. return;
  1409. }
  1410. const notification = new window.Notification(context.i18n.notif_title_articles, {
  1411. icon: '../themes/icons/favicon-256-padding.png',
  1412. body: context.i18n.notif_body_new_articles.replace('%d', nb_new) + ' ' + context.i18n.notif_body_unread_articles.replace('%d', nb),
  1413. tag: 'freshRssNewArticles',
  1414. });
  1415. notification.onclick = function () {
  1416. delayedFunction(function () {
  1417. location.reload();
  1418. window.focus();
  1419. notification.close();
  1420. });
  1421. };
  1422. if (context.html5_notif_timeout !== 0) {
  1423. setTimeout(function () {
  1424. notification.close();
  1425. }, context.html5_notif_timeout * 1000);
  1426. }
  1427. }
  1428. function init_notifs_html5() {
  1429. if (!notifs_html5_is_supported()) {
  1430. return;
  1431. }
  1432. notifs_html5_permission = notifs_html5_ask_permission();
  1433. }
  1434. // </notifs html5>
  1435. function refreshUnreads() {
  1436. const req = new XMLHttpRequest();
  1437. req.open('GET', './?c=javascript&a=nbUnreadsPerFeed', true);
  1438. req.responseType = 'json';
  1439. req.onload = function (e) {
  1440. const json = xmlHttpRequestJson(this);
  1441. if (!json) {
  1442. return badAjax(false);
  1443. }
  1444. const isAll = document.querySelector('.category.all.active');
  1445. let new_articles = false;
  1446. let nbUnreadFeeds = 0;
  1447. const title = document.querySelector('.category.all .title');
  1448. const nb_unreads_before = title ? str2int(title.getAttribute('data-unread')) : 0;
  1449. Object.keys(json.feeds).forEach(function (feed_id) {
  1450. const nbUnreads = json.feeds[feed_id];
  1451. nbUnreadFeeds += nbUnreads;
  1452. feed_id = 'f_' + feed_id;
  1453. const elem = document.getElementById(feed_id);
  1454. const feed_unreads = elem ? str2int(elem.getAttribute('data-unread')) : 0;
  1455. if ((incUnreadsFeed(null, feed_id, nbUnreads - feed_unreads) || isAll) && // Update of current view?
  1456. (nbUnreads - feed_unreads > 0)) {
  1457. const newArticle = document.getElementById('new-article');
  1458. newArticle.setAttribute('aria-hidden', 'false');
  1459. newArticle.style.display = 'block';
  1460. new_articles = true;
  1461. }
  1462. });
  1463. const noArticlesToShow_div = document.getElementById('noArticlesToShow');
  1464. if (nbUnreadFeeds > 0 && noArticlesToShow_div) {
  1465. noArticlesToShow_div.classList.add('hide');
  1466. }
  1467. let nbUnreadTags = 0;
  1468. Object.keys(json.tags).forEach(function (tag_id) {
  1469. const nbUnreads = json.tags[tag_id];
  1470. nbUnreadTags += nbUnreads;
  1471. const tag = document.getElementById('t_' + tag_id);
  1472. if (tag) {
  1473. tag.setAttribute('data-unread', nbUnreads);
  1474. tag.querySelector('.item-title').setAttribute('data-unread', numberFormat(nbUnreads));
  1475. }
  1476. });
  1477. const tags = document.querySelector('.category.tags');
  1478. if (tags) {
  1479. tags.setAttribute('data-unread', nbUnreadTags);
  1480. tags.querySelector('.title').setAttribute('data-unread', numberFormat(nbUnreadTags));
  1481. }
  1482. const nb_unreads = title ? str2int(title.getAttribute('data-unread')) : 0;
  1483. if (nb_unreads > 0 && new_articles) {
  1484. faviconNbUnread(nb_unreads);
  1485. const nb_new = nb_unreads - nb_unreads_before;
  1486. notifs_html5_show(nb_unreads, nb_new);
  1487. }
  1488. };
  1489. req.send();
  1490. }
  1491. // <endless_mode>
  1492. let url_load_more = '';
  1493. let load_more = false;
  1494. let box_load_more = null;
  1495. function load_more_posts() {
  1496. if (load_more || !url_load_more || !box_load_more) {
  1497. return;
  1498. }
  1499. load_more = true;
  1500. document.getElementById('load_more').classList.add('loading');
  1501. const req = new XMLHttpRequest();
  1502. req.open('GET', url_load_more, true);
  1503. req.responseType = 'document';
  1504. req.onload = function (e) {
  1505. const html = this.response;
  1506. const streamFooter = document.getElementById('stream-footer');
  1507. const streamAdopted = document.adoptNode(html.getElementById('stream'));
  1508. streamAdopted.querySelectorAll('.flux, .day').forEach(function (div) {
  1509. box_load_more.insertBefore(div, streamFooter);
  1510. });
  1511. const streamFooterOld = streamFooter.querySelector('.stream-footer-inner');
  1512. const streamFooterNew = streamAdopted.querySelector('.stream-footer-inner');
  1513. streamFooter.replaceChild(streamFooterNew, streamFooterOld);
  1514. const bigMarkAsRead = document.getElementById('bigMarkAsRead');
  1515. const readAll = document.querySelector('#nav_menu_read_all .read_all');
  1516. if (readAll && bigMarkAsRead && bigMarkAsRead.formAction) {
  1517. if (context.display_order === 'ASC') {
  1518. readAll.formAction = bigMarkAsRead.formAction;
  1519. } else {
  1520. bigMarkAsRead.formAction = readAll.formAction;
  1521. }
  1522. }
  1523. document.querySelectorAll('[id^=day_]').forEach(function (div) {
  1524. const ids = document.querySelectorAll('[id="' + div.id + '"]');
  1525. for (let i = ids.length - 1; i > 0; i--) { // Keep only the first
  1526. ids[i].remove();
  1527. }
  1528. });
  1529. init_load_more(box_load_more);
  1530. const div_load_more = document.getElementById('load_more');
  1531. if (bigMarkAsRead) {
  1532. bigMarkAsRead.removeAttribute('disabled');
  1533. }
  1534. if (div_load_more) {
  1535. div_load_more.classList.remove('loading');
  1536. }
  1537. load_more = false;
  1538. };
  1539. req.send();
  1540. }
  1541. const freshrssLoadMoreEvent = document.createEvent('Event');
  1542. freshrssLoadMoreEvent.initEvent('freshrss:load-more', true, true);
  1543. function init_load_more(box) {
  1544. box_load_more = box;
  1545. document.body.dispatchEvent(freshrssLoadMoreEvent);
  1546. const next_button = document.getElementById('load_more');
  1547. if (!next_button) {
  1548. // no more article to load
  1549. url_load_more = '';
  1550. return;
  1551. }
  1552. url_load_more = next_button.getAttribute('formaction');
  1553. next_button.onclick = function (e) {
  1554. load_more_posts();
  1555. return false;
  1556. };
  1557. }
  1558. // </endless_mode>
  1559. function init_confirm_action() {
  1560. document.body.onclick = function (ev) {
  1561. const b = ev.target.closest('.confirm');
  1562. if (b) {
  1563. let str_confirmation = this.getAttribute('data-str-confirm');
  1564. if (!str_confirmation) {
  1565. str_confirmation = context.i18n.confirmation_default;
  1566. }
  1567. return confirm(str_confirmation);
  1568. }
  1569. };
  1570. document.querySelectorAll('button.confirm').forEach(function (b) { b.disabled = false; });
  1571. }
  1572. function faviconNbUnread(n) {
  1573. if (typeof n === 'undefined') {
  1574. const t = document.querySelector('.category.all .title');
  1575. n = t ? str2int(t.getAttribute('data-unread')) : 0;
  1576. }
  1577. // http://remysharp.com/2010/08/24/dynamic-favicons/
  1578. const canvas = document.createElement('canvas');
  1579. const link = document.getElementById('favicon').cloneNode(true);
  1580. const ratio = window.devicePixelRatio;
  1581. if (canvas.getContext && link) {
  1582. canvas.height = canvas.width = 16 * ratio;
  1583. const img = document.createElement('img');
  1584. img.onload = function () {
  1585. const ctx = canvas.getContext('2d');
  1586. ctx.drawImage(this, 0, 0, canvas.width, canvas.height);
  1587. if (n > 0) {
  1588. let text = '';
  1589. if (n < 1000) {
  1590. text = n;
  1591. } else if (n < 100000) {
  1592. text = Math.floor(n / 1000) + 'k';
  1593. } else {
  1594. text = 'E' + Math.floor(Math.log10(n));
  1595. }
  1596. ctx.font = 'bold ' + 9 * ratio + 'px "Arial", sans-serif';
  1597. ctx.fillStyle = 'rgba(255, 255, 255, 0.8)';
  1598. ctx.fillRect(0, 7 * ratio, ctx.measureText(text).width, 9 * ratio);
  1599. ctx.fillStyle = '#F00';
  1600. ctx.fillText(text, 0, canvas.height - 1);
  1601. }
  1602. link.href = canvas.toDataURL('image/png');
  1603. // Check if data URI has generated a real favicon and if not, fallback to standard icon
  1604. if (link.href.length > 180) {
  1605. document.querySelector('link[rel~=icon]').remove();
  1606. document.head.appendChild(link);
  1607. }
  1608. };
  1609. img.src = '../favicon.ico';
  1610. }
  1611. }
  1612. function removeFirstLoadSpinner() {
  1613. const first_load = document.getElementById('first_load');
  1614. if (first_load) {
  1615. first_load.remove();
  1616. }
  1617. }
  1618. function init_normal() {
  1619. const stream = document.getElementById('stream');
  1620. if (!stream) {
  1621. if (window.console) {
  1622. console.log('FreshRSS waiting for content…');
  1623. }
  1624. setTimeout(init_normal, 100);
  1625. return;
  1626. }
  1627. init_column_categories();
  1628. init_stream(stream);
  1629. init_actualize();
  1630. faviconNbUnread();
  1631. window.onbeforeunload = function (e) {
  1632. const sidebar = document.getElementById('sidebar');
  1633. if (sidebar) { // Save sidebar scroll position
  1634. sessionStorage.setItem('FreshRSS_sidebar_scrollTop', sidebar.scrollTop);
  1635. }
  1636. if (mark_read_queue && mark_read_queue.length > 0) {
  1637. return false;
  1638. }
  1639. };
  1640. }
  1641. function init_main_beforeDOM() {
  1642. document.scrollingElement.scrollTop = 0;
  1643. init_shortcuts();
  1644. if (['normal', 'reader', 'global'].indexOf(context.current_view) >= 0) {
  1645. init_normal();
  1646. }
  1647. }
  1648. function init_main_afterDOM() {
  1649. removeFirstLoadSpinner();
  1650. init_notifications();
  1651. init_confirm_action();
  1652. const stream = document.getElementById('stream');
  1653. if (stream) {
  1654. init_load_more(stream);
  1655. init_posts();
  1656. init_nav_entries();
  1657. init_notifs_html5();
  1658. setTimeout(faviconNbUnread, 1000);
  1659. setInterval(refreshUnreads, 120000);
  1660. }
  1661. if (window.console) {
  1662. console.log('FreshRSS main init done.');
  1663. }
  1664. }
  1665. init_main_beforeDOM(); // Can be called before DOM is fully loaded
  1666. if (document.readyState && document.readyState !== 'loading') {
  1667. init_main_afterDOM();
  1668. } else {
  1669. if (window.console) {
  1670. console.log('FreshRSS waiting for DOMContentLoaded…');
  1671. }
  1672. document.addEventListener('DOMContentLoaded', init_main_afterDOM, false);
  1673. }
  1674. // @license-end