watch.js 6.9 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194
  1. 'use strict';
  2. function toggle_parent(target) {
  3. var body = target.parentNode.parentNode.children[1];
  4. if (body.style.display === 'none') {
  5. target.textContent = '[ − ]';
  6. body.style.display = '';
  7. } else {
  8. target.textContent = '[ + ]';
  9. body.style.display = 'none';
  10. }
  11. }
  12. function swap_comments(event) {
  13. var source = event.target.getAttribute('data-comments');
  14. if (source === 'youtube') {
  15. get_youtube_comments();
  16. } else if (source === 'reddit') {
  17. get_reddit_comments();
  18. }
  19. }
  20. var continue_button = document.getElementById('continue');
  21. if (continue_button) {
  22. continue_button.onclick = continue_autoplay;
  23. }
  24. function next_video() {
  25. var url = new URL('https://example.com/watch?v=' + video_data.next_video);
  26. if (video_data.params.autoplay || video_data.params.continue_autoplay)
  27. url.searchParams.set('autoplay', '1');
  28. if (video_data.params.listen !== video_data.preferences.listen)
  29. url.searchParams.set('listen', video_data.params.listen);
  30. if (video_data.params.speed !== video_data.preferences.speed)
  31. url.searchParams.set('speed', video_data.params.speed);
  32. if (video_data.params.local !== video_data.preferences.local)
  33. url.searchParams.set('local', video_data.params.local);
  34. url.searchParams.set('continue', '1');
  35. location.assign(url.pathname + url.search);
  36. }
  37. function continue_autoplay(event) {
  38. if (event.target.checked) {
  39. player.on('ended', next_video);
  40. } else {
  41. player.off('ended');
  42. }
  43. }
  44. function get_playlist(plid) {
  45. var playlist = document.getElementById('playlist');
  46. playlist.innerHTML = spinnerHTMLwithHR;
  47. var plid_url;
  48. if (plid.startsWith('RD')) {
  49. plid_url = '/api/v1/mixes/' + plid +
  50. '?continuation=' + video_data.id +
  51. '&format=html&hl=' + video_data.preferences.locale;
  52. } else {
  53. plid_url = '/api/v1/playlists/' + plid +
  54. '?index=' + video_data.index +
  55. '&continuation=' + video_data.id +
  56. '&format=html&hl=' + video_data.preferences.locale;
  57. }
  58. helpers.xhr('GET', plid_url, {retries: 5, entity_name: 'playlist'}, {
  59. on200: function (response) {
  60. playlist.innerHTML = response.playlistHtml;
  61. if (!response.nextVideo) return;
  62. var nextVideo = document.getElementById(response.nextVideo);
  63. nextVideo.parentNode.parentNode.scrollTop = nextVideo.offsetTop;
  64. player.on('ended', function () {
  65. var url = new URL('https://example.com/watch?v=' + response.nextVideo);
  66. url.searchParams.set('list', plid);
  67. if (!plid.startsWith('RD'))
  68. url.searchParams.set('index', response.index);
  69. if (video_data.params.autoplay || video_data.params.continue_autoplay)
  70. url.searchParams.set('autoplay', '1');
  71. if (video_data.params.listen !== video_data.preferences.listen)
  72. url.searchParams.set('listen', video_data.params.listen);
  73. if (video_data.params.speed !== video_data.preferences.speed)
  74. url.searchParams.set('speed', video_data.params.speed);
  75. if (video_data.params.local !== video_data.preferences.local)
  76. url.searchParams.set('local', video_data.params.local);
  77. location.assign(url.pathname + url.search);
  78. });
  79. },
  80. onNon200: function (xhr) {
  81. playlist.innerHTML = '';
  82. document.getElementById('continue').style.display = '';
  83. },
  84. onError: function (xhr) {
  85. playlist.innerHTML = spinnerHTMLwithHR;
  86. },
  87. onTimeout: function (xhr) {
  88. playlist.innerHTML = spinnerHTMLwithHR;
  89. }
  90. });
  91. }
  92. function get_reddit_comments() {
  93. var comments = document.getElementById('comments');
  94. var fallback = comments.innerHTML;
  95. comments.innerHTML = spinnerHTML;
  96. var url = '/api/v1/comments/' + video_data.id +
  97. '?source=reddit&format=html' +
  98. '&hl=' + video_data.preferences.locale;
  99. var onNon200 = function (xhr) { comments.innerHTML = fallback; };
  100. if (video_data.params.comments[1] === 'youtube')
  101. onNon200 = function (xhr) {};
  102. helpers.xhr('GET', url, {retries: 5, entity_name: ''}, {
  103. on200: function (response) {
  104. comments.innerHTML = ' \
  105. <div> \
  106. <h3> \
  107. <a href="javascript:void(0)">[ − ]</a> \
  108. {title} \
  109. </h3> \
  110. <p> \
  111. <b> \
  112. <a href="javascript:void(0)" data-comments="youtube"> \
  113. {youtubeCommentsText} \
  114. </a> \
  115. </b> \
  116. </p> \
  117. <b> \
  118. <a rel="noopener" target="_blank" href="https://reddit.com{permalink}">{redditPermalinkText}</a> \
  119. </b> \
  120. </div> \
  121. <div>{contentHtml}</div> \
  122. <hr>'.supplant({
  123. title: response.title,
  124. youtubeCommentsText: video_data.youtube_comments_text,
  125. redditPermalinkText: video_data.reddit_permalink_text,
  126. permalink: response.permalink,
  127. contentHtml: response.contentHtml
  128. });
  129. comments.children[0].children[0].children[0].onclick = toggle_comments;
  130. comments.children[0].children[1].children[0].onclick = swap_comments;
  131. },
  132. onNon200: onNon200, // declared above
  133. });
  134. }
  135. if (video_data.play_next) {
  136. player.on('ended', function () {
  137. var url = new URL('https://example.com/watch?v=' + video_data.next_video);
  138. if (video_data.params.autoplay || video_data.params.continue_autoplay)
  139. url.searchParams.set('autoplay', '1');
  140. if (video_data.params.listen !== video_data.preferences.listen)
  141. url.searchParams.set('listen', video_data.params.listen);
  142. if (video_data.params.speed !== video_data.preferences.speed)
  143. url.searchParams.set('speed', video_data.params.speed);
  144. if (video_data.params.local !== video_data.preferences.local)
  145. url.searchParams.set('local', video_data.params.local);
  146. url.searchParams.set('continue', '1');
  147. location.assign(url.pathname + url.search);
  148. });
  149. }
  150. addEventListener('load', function (e) {
  151. if (video_data.plid)
  152. get_playlist(video_data.plid);
  153. if (video_data.params.comments[0] === 'youtube') {
  154. get_youtube_comments();
  155. } else if (video_data.params.comments[0] === 'reddit') {
  156. get_reddit_comments();
  157. } else if (video_data.params.comments[1] === 'youtube') {
  158. get_youtube_comments();
  159. } else if (video_data.params.comments[1] === 'reddit') {
  160. get_reddit_comments();
  161. } else {
  162. var comments = document.getElementById('comments');
  163. comments.innerHTML = '';
  164. }
  165. });