tracker

30.5 KB

1. // components/show.hl — `/shows/:slug` (tracker.worldapi.org#4): a show's own page. Creator's words:
2. // "the poster on the left, right of it the title of the show, the genre pills, below the plot summary,
3. // below that the artists just as normal links, separated with comma color red, genres are blue" (the
4. // header) — "then all seasons in reverse order, latest on top, below them collapsable their episodes,
5. // episodes first the round check icon, if the episode was watched by the user looking its solid, if
6. // not its regular, then the episode number, then the title. the last season is not collapsed. click on
7. // the check adds a watch. the season also has a check, if the season is checked or unchecked all its
8. // episodes get checked or unchecked. artists link to /person/<artist-slug> the genre to /genre/<genre-slug>."
9. //
10. // THE ROWS ARE ONE FLAT LIST, not a nested for-loop over seasons > episodes: the vendored build may
11. // still lack the fix for hybriel#86 (a nested for over a reassigned outer list keeps stale inner
12. // cells) — a single-level `for (row of rows)` with a `kind` field, reassigned whole on every click,
13. // is the same proven-safe shape components/main.hl's own header and ident's inbox.hl already use.
14. // `rows` is rebuilt from scratch (seasons/episodes refetched by id, watch rows refetched) on every
15. // toggle — cheap: a show has at most a few dozen episodes per season.
16. //
17. // Mission 047 (the creator, 2026-10-01): a caret at the season header's right edge (down = open, right = collapsed); episode
18. // rows not indented; on a phone the title first, then the poster at full width, then genres/plot/cast; a Follow toggle
19. // next to the title. SIGNED OUT the checks and Follow are visible too: a click opens the "sign in" modal (modal.hl, copied
20. // from components.hybriel) and writes nothing.
21. //
22. // tracker.worldapi.org#17 (mission 057): the caret points DOWN while a season is closed and UP while it is open. Opening a
23. // season shows SKELETON rows at once (min(episodes, 8), a CSS shimmer, styles.hl) and then its episodes from the face
24. // `showSeasonEpisodes`, which takes NO session: a face with `session` makes hl:web re-mount the whole page on the server and
25. // ship every session-derived member back as a `sync` (WebFramework.hl `inbound`) — that, not the episodes, was most of the
26. // old 250–450 ms (real data). The watched state comes from `watchedEpisodes` (this show's watched episodes per season, rendered
27. // with the page and re-synced after every watch face). Closing is client-only (no request). An ADULT show (only its
28. // followers see it) keeps the session face `showRows`: the public face refuses adult seasons.
29. //
30. // tracker.worldapi.org#12: link icons under the title — the show on TMDB, IMDb, TheTVDB, TVmaze (a movie: TMDB + IMDb),
31. // only for the ids it has (shows.hl externalLinksOf), each in a new tab.
32. //
33. // tracker.worldapi.org#26: an INCOMPLETE title (one a person page added from a filmography — details.hl `needsDetails`) shows
34. // what it has plus skeletons (poster, cast line, season rows for a series) and completes itself WITHOUT a reload: the
35. // invisible `showProbe` (endless short CSS animation — hl:web has no mount hook, the person page's trick) calls the face
36. // `showComplete` until it is done — one step per call (details.hl completeStep: TMDB details + ids + cast; a series' seasons/
37. // episodes in parts; poster, TVmaze) — and the last answer's parts replace the skeletons. No session (no page re-mount); adult
38. // refused.
39. //
40. // tracker.worldapi.org#28: the WHOLE cast and the key crew (details.hl stores them: a series' cast of every season, main cast
41. // first by episode count, then "Guest stars"; crew = Created by / Directed by / Written by / Screenplay / Story / Music). The
42. // cast shows its first `castShown` (20) and a "Show all (N)" toggle, each crew job its first `crewShown` (6) and one "Show all
43. // crew (N)" toggle — CLIENT-SIDE (the rows are all rendered, CSS hides the rest; `castClass`/`crewClass`, no request). Names
44. // link to /person/<slug>; the character in brackets after the name (CSS `attr(data-role)` — one element per name: the SSR's
45. // line breaks inside a wrapper element put a space before the comma).
46. parent './main.hl'
47. import Modal from './modal.hl'
48. import { appTitle } from '../project.hl'
49. import { userIdOfSession, loginHref } from '../users.hl'
50. import { isFollowing, setFollowed } from '../follows.hl'
51. import { showBySlug, showById, genreById, personById, seasonsOfShow, episodesOfSeason, seasonById, posterName, externalLinksOf, summaryOf } from '../shows.hl'
52. import { watchesOfUser, isWatched, watchedSet, setWatched, setSeasonWatched, watchClassOf } from '../watches.hl'
53. import { needsDetails, completeStep, completeLine, persistDetails } from '../details.hl'
55. // ---- pure helpers ----------------------------------------------------------------------------
56. // `static`, like calendar.hl's `soonOf` — a PLAIN instance member function that calls an
57. // hl:mpackdb-backed import (seasonsOfShow, episodesOfSeason, watchesOfUser, …) comes back null
58. // when called from an `on server` face (confirmed by running the gate: "'buildRows' is not
59. // callable — it holds null" at the face's call site, even though the SAME call works fine as a
60. // member's own initializer at the top of this file). `static` is the proven-safe shape (calendar's
61. // `soonOf`, called from `calLoad`/`calSettingsLoad`, an mpackdb-backed helper exactly like this one).
62. static initialCollapsed = (seasons) => {
63. let m = {}
64. let i = 0
65. while (i < seasons.length) {
66. if (i > 0) { m[seasons[i].id] = true }
67. i = i + 1
68. }
69. return m
70. }
71. static genreRowsOf = (show) => {
72. let out = []
73. for (gid of show.genres) {
74. let g = genreById(gid)
75. if (g != null) { out.push({ id = g.id name = g.name href = '/genre/' + g.urlSegment }) }
76. }
77. return out
78. }
79. // tracker#28: how many names show before "Show all" (cast; per crew job)
80. static castShown = 20
81. static crewShown = 6
82. static listOf = (v) => { return v == null ? [] : v }
83. // the cast as flat rows (no nested for, see THE ROWS above): `isPerson` rows { name, href, roleText (' (Character)' or ''),
84. // itemClass } and before the first guest one `isLabel` row "Guest stars". itemClass: `more` = hidden until "Show all", `end` =
85. // no comma after it (the last of a group), `cut` = the last one shown while collapsed (no comma then)
86. static castRowsOf = (show) => {
87. let people = []
88. for (c of listOf(show.cast)) {
89. let p = c != null ? personById(c.person) : null
90. if (p != null) { people.push({ name = c.actor != null ? c.actor : p.name href = '/person/' + p.urlSegment role = c.character != null ? c.character : '' guest = c.guest == true }) }
91. }
92. let out = []
93. let k = 0
94. let guests = false
95. while (k < people.length) {
96. let c = people[k]
97. if (c.guest && !guests && k > 0) {
98. guests = true
99. out.push({ isLabel = true isPerson = false text = 'Guest stars' name = '' href = '' roleText = '' itemClass = k >= castShown ? 'more' : '' })
100. }
101. let last = k == people.length - 1 || (people[k + 1].guest && !c.guest)
102. let cls = (k >= castShown ? ' more' : '') + (last ? ' end' : '') + (k == castShown - 1 ? ' cut' : '')
103. out.push({ isLabel = false isPerson = true text = '' name = c.name href = c.href roleText = c.role != '' ? ' (' + c.role + ')' : '' itemClass = 'artist-link' + cls })
104. k = k + 1
105. }
106. return out
107. }
108. static castCountOf = (show) => {
109. let n = 0
110. for (c of listOf(show.cast)) { if (c != null && personById(c.person) != null) { n = n + 1 } }
111. return n
112. }
113. static crewLabels = { creator = 'Created by' director = 'Directed by' writer = 'Written by' screenplay = 'Screenplay' story = 'Story' composer = 'Music' }
114. // the crew as flat rows: per job (in stored order) an `isLabel` row, then its people (itemClass as for the cast, `more` after
115. // the first crewShown of a job)
116. static crewRowsOf = (show) => {
117. let people = []
118. for (c of listOf(show.crew)) {
119. let p = c != null ? personById(c.person) : null
120. if (p != null && crewLabels[c.job] != null) { people.push({ name = c.name != null ? c.name : p.name href = '/person/' + p.urlSegment job = c.job }) }
121. }
122. let out = []
123. let k = 0
124. let inJob = 0
125. while (k < people.length) {
126. let c = people[k]
127. if (k == 0 || people[k - 1].job != c.job) {
128. inJob = 0
129. out.push({ isLabel = true isPerson = false text = crewLabels[c.job] name = '' href = '' itemClass = '' })
130. }
131. let last = k == people.length - 1 || people[k + 1].job != c.job
132. out.push({ isLabel = false isPerson = true text = '' name = c.name href = c.href itemClass = 'crew-link' + (inJob >= crewShown ? ' more' : '') + (last ? ' end' : '') + (inJob == crewShown - 1 ? ' cut' : '') })
133. inJob = inJob + 1
134. k = k + 1
135. }
136. return out
137. }
138. // how many crew names are hidden while collapsed (0 = no toggle) and how many there are
139. static crewHiddenOf = (rows) => {
140. let n = 0
141. for (r of rows) { if (r.isPerson && r.itemClass.includes(' more')) { n = n + 1 } }
142. return n
143. }
144. static crewCountOf = (rows) => {
145. let n = 0
146. for (r of rows) { if (r.isPerson) { n = n + 1 } }
147. return n
148. }
149. // a View attribute must be a literal, a member or a field path — never an inline expression — so
150. // every ternary (watched -> icon class, collapsed -> row class) is resolved HERE, once, into a
151. // plain field the View just reads (row.watchClass, row.rowClass); `watchClassOf` itself lives in
152. // watches.hl (shared with /unwatched and /schedule, "reuse, don't copy")
153. static buildRows = (show, uid, collapsed) => {
154. let watched = watchedSet(uid != null ? watchesOfUser(uid) : [])
155. let out = []
156. for (s of seasonsOfShow(show)) {
157. let isCollapsed = collapsed[s.id] == true
158. let label = s.title != null && s.title != '' ? s.title : 'Season ' + s.seasonNumber
159. let seasonWatched = watched['season:' + s.id] == true
160. out.push({ kind = 'season' isSeason = true isEpisode = false isSkeleton = false id = s.id skeletonCount = s.episodes.length < 8 ? s.episodes.length : 8 label = label episodeCountText = s.episodes.length == 1 ? '1 episode' : s.episodes.length + ' episodes' watched = seasonWatched watchClass = watchClassOf(seasonWatched) collapsed = isCollapsed rowClass = isCollapsed ? 'collapsed' : 'expanded' })
161. if (!isCollapsed) {
162. for (e of episodesOfSeason(s)) {
163. let epWatched = watched['episode:' + e.id] == true
164. out.push({ kind = 'episode' isSeason = false isEpisode = true isSkeleton = false id = e.id seasonId = s.id episodeNumber = e.episodeNumber title = e.title != null ? e.title : '' watched = epWatched watchClass = watchClassOf(epWatched) })
165. }
166. }
167. }
168. return out
169. }
171. // what the client marks the rows of a season it opens with (tracker#17) — only this show's, never the user's whole watch
172. // list (every member is shipped to the browser). Per season with a watched episode: `{ all, except }` — `all` = most of
173. // it is watched, then `except` holds the UNwatched ids, else the watched ones (a fully watched 142-episode season is
174. // `{ all = true except = {} }`, not 142 ids). No entry = nothing watched.
175. static watchedEpisodesOf = (show, uid) => {
176. let m = {}
177. if (uid == null) { return m }
178. let watched = watchedSet(watchesOfUser(uid))
179. for (s of seasonsOfShow(show)) {
180. let yes = {}
181. let no = {}
182. let n = 0
183. for (eid of s.episodes) {
184. if (watched['episode:' + eid] == true) { yes[eid] = true n = n + 1 } else { no[eid] = true }
185. }
186. if (n > 0) { m[s.id] = n * 2 > s.episodes.length ? { all = true except = no } : { all = false except = yes } }
187. }
188. return m
189. }
190. // is this episode watched, by that per-season shape (client-side, pure)
191. static watchedIn = (entry, episodeId) => {
192. if (entry == null) { return false }
193. let listed = entry.except[episodeId] == true
194. return entry.all ? !listed : listed
195. }
197. // ---- the rows as the CLIENT changes them (tracker#17) — pure: no import is reached, so they run in the browser ----------
198. // (`watchClassOf` is an import of the mpackdb-backed watches.hl, so `filledRows` writes its two classes itself)
199. static seasonRowAs = (row, isCollapsed) => {
200. return { kind = 'season' isSeason = true isEpisode = false isSkeleton = false id = row.id skeletonCount = row.skeletonCount label = row.label episodeCountText = row.episodeCountText watched = row.watched watchClass = row.watchClass collapsed = isCollapsed rowClass = isCollapsed ? 'collapsed' : 'expanded' }
201. }
202. // the season opened: its caret up at once, `skeletonCount` placeholder rows under it
203. static openingRows = (rows, seasonId) => {
204. let out = []
205. for (row of rows) {
206. if (row.isSeason && row.id == seasonId) {
207. out.push(seasonRowAs(row, false))
208. let i = 0
209. while (i < row.skeletonCount) {
210. out.push({ kind = 'skeleton' isSeason = false isEpisode = false isSkeleton = true id = seasonId + '-skeleton-' + i seasonId = seasonId })
211. i = i + 1
212. }
213. } else { out.push(row) }
214. }
215. return out
216. }
217. // the season closed: its episode (and skeleton) rows gone, caret down
218. static closedRows = (rows, seasonId) => {
219. let out = []
220. for (row of rows) {
221. if (row.isSeason && row.id == seasonId) { out.push(seasonRowAs(row, true)) }
222. else if (!row.isSeason && row.seasonId == seasonId) { }
223. else { out.push(row) }
224. }
225. return out
226. }
227. // the episodes arrived: they replace the season's skeleton rows. No skeleton of it left (closed meanwhile, or a watch face
228. // already rebuilt every row) → the rows stay as they are (no double rows)
229. static filledRows = (rows, seasonId, episodes, watched) => {
230. let out = []
231. let done = false
232. for (row of rows) {
233. if (row.isSkeleton && row.seasonId == seasonId) {
234. if (!done) {
235. for (e of episodes) {
236. let w = watchedIn(watched[seasonId], e.id)
237. out.push({ kind = 'episode' isSeason = false isEpisode = true isSkeleton = false id = e.id seasonId = seasonId episodeNumber = e.episodeNumber title = e.title watched = w watchClass = w ? 'checkicon solid' : 'checkicon regular' })
238. }
239. done = true
240. }
241. } else { out.push(row) }
242. }
243. return out
244. }
246. // a LOCAL static like buildRows (an imported mpackdb helper called straight from a member's initializer came back false
247. // after a client-side navigation to the page — the gate's follow check)
248. static followingOf = (show, uid) => { return uid != null && isFollowing(uid, show.id) }
249. // mission 056: an ADULT title's page (TMDB's flag `adult == true`, mission 054) is "Not found" for everyone who does not
250. // follow it (signed out too); a follower sees it as before. Unknown (`null`) is not hidden here — only in the lists.
251. // With hybriel ≥ 73267707 (#121/#122) `showRow`/`found` are server sites re-derived after every session face with the page's
252. // slug, so an Unfollow on the page hides it at once (the gate proves it; the old build left the page up until a reload).
253. // Mission 054's try (`found = … && !adultHiddenFor(showRow, me)`, `collapsed`/`rows` from `found`) broke the checks.
254. static adultHiddenFor = (show, uid) => { return show.adult == true && !followingOf(show, uid) }
255. // the page's show — null when there is none OR it is hidden for this user: every member is shipped to the browser, so the
256. // row of a hidden title must never be one
257. static visibleShow = (slug, uid) => {
258. let s = showBySlug(slug)
259. return s != null && adultHiddenFor(s, uid) ? null : s
260. }
261. // the initial open/closed seasons from the SLUG alone (not from `showRow`, which reads the session — see `collapsed`)
262. static initialCollapsedOf = (slug) => {
263. let s = showBySlug(slug)
264. return s != null ? initialCollapsed(seasonsOfShow(s)) : {}
265. }
267. // tracker#26: the page loads this title's full details on open
268. static completingOf = (show) => { return needsDetails(show) }
269. // the face's work: ONE step of completing the title (details.hl completeStep — a series takes a few; a second viewer drives the
270. // same job or finds it complete); when done, every part of the page that changes — the rows without anyone's watch state (a
271. // title that was incomplete had no episodes to watch)
272. static completedPageOf = (slug) => {
273. let show = showBySlug(slug)
274. if (show == null || show.adult == true) { return { error = 'no such show' } }
275. if (needsDetails(show)) {
276. let r = completeStep(show.id)
277. if (r.retry || r.adult == true) { return { error = r.error != '' ? r.error : 'no such show' } }
278. if (!r.done) { return { done = false steps = r.sum.steps } }
279. if (!r.skipped) {
280. persistDetails()
281. console.log('details on open: ' + completeLine(show.title, r.sum))
282. }
283. show = showById(show.id)
284. }
285. let cl = initialCollapsed(seasonsOfShow(show))
286. let pn = posterName(show)
287. let crew = crewRowsOf(show)
288. return { done = true title = show.title summary = summaryOf(show) poster = pn genreRows = genreRowsOf(show) castRows = castRowsOf(show)
289. castCount = castCountOf(show) castMore = castCountOf(show) > castShown crewRows = crew crewCount = crewCountOf(crew) crewMore = crewHiddenOf(crew) > 0
290. linkRows = externalLinksOf(show) collapsed = cl rows = buildRows(show, null, cl) }
291. }
293. // ---- reactive members -----------------------------------------------------------------------
294. slug = null
295. session = null
296. userId = userIdOfSession(session)
297. signedIn = userId != null
298. // SESSION SYNC (mission 047; since hybriel #121/#122, mission 056): a face taking `session` answers with a `sync` of every
299. // member derived from session that reaches an import (here `showRow`, `found`, `following`, `rows`, …), re-derived on the
300. // server with the page's route params but the MOUNT's other state — so client state (`collapsed`) must never derive from
301. // them. `me` stays the plain copy mission 047 introduced.
302. me = userId
304. showRow = visibleShow(slug, me)
305. found = showRow != null
306. notFound = showRow == null
308. // the Follow toggle: "Follow" = the inverted button (accent border), "Following" = the filled one
309. following = found ? followingOf(showRow, me) : false
310. followClass = following ? 'follow' : 'follow inverted'
311. followText = following ? 'Following' : 'Follow'
312. signInHref = loginHref
314. title = found ? showRow.title : ''
315. // tracker#18: the creator's own text, else TMDB's, else TVmaze's
316. summary = found ? summaryOf(showRow) : ''
317. poster = found ? posterName(showRow) : null
318. hasPoster = poster != null
319. posterUrl = hasPoster ? '/posters/' + poster : ''
321. genreRows = found ? genreRowsOf(showRow) : []
322. hasGenres = genreRows.length > 0
323. castRows = found ? castRowsOf(showRow) : []
324. hasCast = castRows.length > 0
325. // tracker#28: "Show all (N)" — the toggles' state is CLIENT state: literals, never derived from `showRow` (session sync)
326. castCount = found ? castCountOf(showRow) : 0
327. castMore = castCount > castShown
328. castAllText = 'Show all (' + castCount + ')'
329. castClass = 'collapsed'
330. crewRows = found ? crewRowsOf(showRow) : []
331. hasCrew = crewRows.length > 0
332. crewCount = crewCountOf(crewRows)
333. crewMore = crewHiddenOf(crewRows) > 0
334. crewAllText = 'Show all crew (' + crewCount + ')'
335. crewClass = 'collapsed'
336. linkRows = found ? externalLinksOf(showRow) : []
337. hasLinks = linkRows.length > 0
339. // NOT from `showRow`/`found`: they read the session (via `me`), so a member derived from them is re-derived on the server
340. // after every session face with the MOUNT's state — `collapsed` (client state) would snap back to the initial seasons (mission
341. // 056: the 2nd episode click in a re-opened season did nothing). The season ids of a hidden page are no secret.
342. collapsed = initialCollapsedOf(slug)
343. rows = found ? buildRows(showRow, me, collapsed) : []
344. hasRows = rows.length > 0
345. watchedEpisodes = found ? watchedEpisodesOf(showRow, me) : {}
346. // an adult page (followers only) opens its seasons through the session face `showRows`
347. adultShow = found && showRow.adult == true
348. // tracker#26: incomplete → skeletons + the probe until `showComplete` answered
349. completing = found ? completingOf(showRow) : false
350. completeBusy = false
351. isSeries = found && showRow.type != 'movie'
352. skeletonSeasons = ['1', '2', '3']
354. __title = found ? title + ' — ' + appTitle : appTitle
356. View {
357. showPage {
358. if (notFound) {
359. article { class = "main"
360. h1 { "Not found" }
361. p { "This show doesn't exist." }
362. }
363. }
364. if (found) {
365. showHeader {
366. showPoster {
367. if (hasPoster) { img { src = posterUrl alt = title } }
368. if (completing) { skeletonPoster { "aria-hidden" = "true" } }
369. }
370. showMeta {
371. showTitle {
372. h1 { title }
373. button { id = "follow" type = "button" class = followClass followText on click(e) { emit toggleFollow(e) } }
374. }
375. if (hasLinks) {
376. showLinks {
377. for (l of linkRows) { a { class = "extlink" href = l.href target = "_blank" rel = "noopener" title = l.title "aria-label" = l.title "data-site" = l.site l.label } }
378. }
379. }
380. if (hasGenres) {
381. showGenres {
382. for (g of genreRows) { a { class = "genre-pill" href = g.href g.name } }
383. }
384. }
385. showSummary { summary }
386. if (hasCrew) {
387. showCrew { class = crewClass
388. for (r of crewRows) {
389. if (r.isLabel) { crewLabel { r.text } }
390. if (r.isPerson) { a { class = r.itemClass href = r.href r.name } }
391. }
392. if (crewMore) {
393. button { id = "crewtoggle" type = "button" class = "quiet showall"
394. whenCollapsed { crewAllText }
395. whenAll { "Show less" }
396. on click(e) { emit toggleCrewAll(e) }
397. }
398. }
399. }
400. }
401. if (hasCast) {
402. showCast { class = castClass
403. castHeading { "Cast" }
404. for (c of castRows) {
405. if (c.isLabel) { castLabel { class = c.itemClass c.text } }
406. if (c.isPerson) { a { class = c.itemClass href = c.href "data-role" = c.roleText c.name } }
407. }
408. if (castMore) {
409. button { id = "casttoggle" type = "button" class = "quiet showall"
410. whenCollapsed { castAllText }
411. whenAll { "Show less" }
412. on click(e) { emit toggleCastAll(e) }
413. }
414. }
415. }
416. }
417. if (completing) { skeletonCast { "aria-hidden" = "true" } }
418. }
419. }
420. if (completing) {
421. showLoading { id = "showloading" "aria-busy" = "true"
422. if (isSeries) {
423. for (k of skeletonSeasons) {
424. skeletonRow { "aria-hidden" = "true"
425. skeletonCheck { }
426. skeletonTitle { }
427. }
428. }
429. }
430. showProbe { "aria-hidden" = "true" on animationiteration(e) { emit completeTick(e) } }
431. }
432. }
433. if (hasRows) {
434. showSeasons {
435. for (row of rows) {
436. if (row.isSeason) {
437. seasonRow { class = row.rowClass
438. button { type = "button" class = row.watchClass value = row.id "aria-label" = "mark season watched"
439. svg { viewBox = "0 0 24 24" width = "22" height = "22" "aria-hidden" = "true"
440. circle { cx = "12" cy = "12" r = "10" }
441. path { d = "M7 12.5 L10.5 16 L17 8.5" }
442. }
443. on click(e) { emit toggleSeason(row.id) }
444. }
445. button { type = "button" class = "season-toggle" value = row.id
446. seasonLabel { row.label }
447. seasonCount { row.episodeCountText }
448. seasonCaret { "aria-hidden" = "true"
449. svg { viewBox = "0 0 24 24" width = "20" height = "20"
450. path { d = "M6 9 L12 15 L18 9" }
451. }
452. }
453. on click(e) { emit toggleCollapse(row.id) }
454. }
455. }
456. }
457. if (row.isEpisode) {
458. episodeRow {
459. button { type = "button" class = row.watchClass value = row.id "aria-label" = "mark episode watched"
460. svg { viewBox = "0 0 24 24" width = "22" height = "22" "aria-hidden" = "true"
461. circle { cx = "12" cy = "12" r = "10" }
462. path { d = "M7 12.5 L10.5 16 L17 8.5" }
463. }
464. on click(e) { emit toggleEpisode(row.id) }
465. }
466. episodeNumber { row.episodeNumber }
467. episodeTitle { row.title }
468. }
469. }
470. if (row.isSkeleton) {
471. skeletonRow { "aria-hidden" = "true"
472. skeletonCheck { }
473. skeletonNumber { }
474. skeletonTitle { }
475. }
476. }
477. }
478. }
479. }
480. Modal { id = "signin" title = "Sign in"
481. p { "You need to sign in to follow shows and mark episodes." }
482. footer {
483. button { type = "button" value = "close" "Close" }
484. a { id = "signin-link" class = "button" href = signInHref "Sign in with ident" }
485. }
486. }
487. }
488. }
489. }
491. // Every rebuild of `rows` happens SERVER-SIDE, never by calling `buildRows` from a client handler:
492. // a member function whose body reaches an hl:mpackdb-backed import (seasonsOfShow, episodesOfSeason,
493. // watchesOfUser, …) compiles to nothing on the client (no case ever assigns it — a genuine Hybriel
494. // gap, filed under `issues`) even though the client bundle still calls it, so `this.buildRows(...)`
495. // throws "not a function" in the browser. The client here only ever ASSIGNS the `rows` the server
496. // already built (`rows = r.rows`) — never calls a tainted local helper itself. `slug` goes along so
497. // the face can refetch the show without depending on implicit access to a sibling member.
498. //
499. // tracker#17: opening shows the skeleton rows BEFORE the request; the answer replaces them unless the season was closed
500. // meanwhile (then nothing). An error closes the season again. Closing never asks the server.
501. on toggleCollapse(seasonId) {
502. let m = collapsed
503. if (collapsed[seasonId] != true) {
504. m[seasonId] = true
505. collapsed = m
506. rows = closedRows(rows, seasonId)
507. return null
508. }
509. m[seasonId] = false
510. collapsed = m
511. rows = openingRows(rows, seasonId)
512. if (adultShow) {
513. let a = emit server showRows(slug, collapsed)
514. if (collapsed[seasonId] == true) { return null }
515. if (a == null || a.error != null) { m[seasonId] = true collapsed = m rows = closedRows(rows, seasonId) return null }
516. rows = a.rows
517. return null
518. }
519. let r = emit server showSeasonEpisodes('' + seasonId)
520. if (collapsed[seasonId] == true) { return null }
521. if (r == null || r.error != null) { m[seasonId] = true collapsed = m rows = closedRows(rows, seasonId) return null }
522. rows = filledRows(rows, seasonId, r.episodes, watchedEpisodes)
523. }
525. // tracker#26: the probe's tick — `showComplete` step by step until `done` (once per page: `completeBusy`; other requests are
526. // served between two calls); the last answer replaces the skeletons. A lost answer (null) lets the next tick go on where the
527. // server is; an error (TMDB down, adult) ends the loading and keeps what the page has.
528. on completeTick(e) {
529. if (completeBusy || !completing) { return null }
530. completeBusy = true
531. let s = slug
532. let r = emit server showComplete(s)
533. while (r != null && r.error == null && r.done != true && slug == s) { r = emit server showComplete(s) }
534. completeBusy = false
535. if (r == null || slug != s) { return null }
536. if (r.error != null) { completing = false return null }
537. title = r.title
538. summary = r.summary
539. poster = r.poster
540. genreRows = r.genreRows
541. castRows = r.castRows
542. castCount = r.castCount
543. castMore = r.castMore
544. castAllText = 'Show all (' + r.castCount + ')'
545. crewRows = r.crewRows
546. crewCount = r.crewCount
547. crewMore = r.crewMore
548. crewAllText = 'Show all crew (' + r.crewCount + ')'
549. linkRows = r.linkRows
550. collapsed = r.collapsed
551. rows = r.rows
552. completing = false
553. }
555. // tracker#28: the cast / crew "Show all" toggles — client-only, no request (CSS shows the hidden names)
556. on toggleCastAll(e) {
557. castClass = castClass == 'all' ? 'collapsed' : 'all'
558. }
559. on toggleCrewAll(e) {
560. crewClass = crewClass == 'all' ? 'collapsed' : 'all'
561. }
563. // signed out: the modal, nothing is sent
564. on toggleEpisode(episodeId) {
565. if (!signedIn) { document.getElementById('signin').showModal() return null }
566. let r = emit server showToggleEpisode(slug, '' + episodeId, collapsed)
567. if (r == null || r.error != null) { return null }
568. rows = r.rows
569. }
571. on toggleSeason(seasonId) {
572. if (!signedIn) { document.getElementById('signin').showModal() return null }
573. let r = emit server showToggleSeason(slug, '' + seasonId, collapsed)
574. if (r == null || r.error != null) { return null }
575. rows = r.rows
576. }
578. on toggleFollow(e) {
579. if (!signedIn) { document.getElementById('signin').showModal() return null }
580. let r = emit server showToggleFollow(slug)
581. if (r == null || r.error != null) { return null }
582. following = r.following
583. followClass = r.following ? 'follow' : 'follow inverted'
584. followText = r.following ? 'Following' : 'Follow'
585. }
587. // ---- the faces (the trailing `session` is always the server's: hybriel#16) ----
588. // tracker#26: complete an incomplete title and answer the page's parts — public data, NO session (no page re-mount)
589. on server showComplete(slug) {
590. return completedPageOf(slug != null ? '' + slug : '')
591. }
593. // every row for these open/closed seasons — only an ADULT show's page still uses it (its followers; tracker#17)
594. on server showRows(slug, collapsed, session) {
595. let show = showBySlug(slug)
596. let uid = userIdOfSession(session)
597. if (show == null || adultHiddenFor(show, uid)) { return { error = 'no such show' } }
598. return { ok = true rows = buildRows(show, uid, collapsed) }
599. }
601. // tracker#17: one season's episodes, in order — public data, so NO `session` (no page re-mount, no sync: the fast path).
602. // Refuses a season of an adult title (those pages use showRows above).
603. on server showSeasonEpisodes(seasonId) {
604. if (seasonId == null || hlTypeName(seasonId) != 'String') { return { error = 'no such season' } }
605. let season = seasonById(seasonId)
606. if (season == null) { return { error = 'no such season' } }
607. let show = showById(season.show)
608. if (show == null || show.adult == true) { return { error = 'no such season' } }
609. let out = []
610. for (e of episodesOfSeason(season)) { out.push({ id = e.id episodeNumber = e.episodeNumber title = e.title != null ? e.title : '' }) }
611. return { ok = true episodes = out }
612. }
614. on server showToggleEpisode(slug, episodeId, collapsed, session) {
615. let show = showBySlug(slug)
616. if (show == null) { return { error = 'no such show' } }
617. let uid = userIdOfSession(session)
618. if (uid == null) { return { error = 'you are not signed in' } }
619. if (adultHiddenFor(show, uid)) { return { error = 'no such show' } }
620. let rows = watchesOfUser(uid)
621. let watched = isWatched(rows, 'episode', episodeId) == false
622. let ok = setWatched(uid, 'episode', episodeId, rows, watched)
623. if (!ok) { return { error = 'could not save the watch' } }
624. return { ok = true rows = buildRows(show, uid, collapsed) }
625. }
627. on server showToggleSeason(slug, seasonId, collapsed, session) {
628. let show = showBySlug(slug)
629. if (show == null) { return { error = 'no such show' } }
630. let uid = userIdOfSession(session)
631. if (uid == null) { return { error = 'you are not signed in' } }
632. if (adultHiddenFor(show, uid)) { return { error = 'no such show' } }
633. let season = seasonById(seasonId)
634. if (season == null) { return { error = 'no such season' } }
635. let rows = watchesOfUser(uid)
636. let watched = isWatched(rows, 'season', seasonId) == false
637. let ok = setSeasonWatched(uid, seasonId, season.episodes, rows, watched)
638. if (!ok) { return { error = 'could not save the watch' } }
639. return { ok = true rows = buildRows(show, uid, collapsed) }
640. }
642. on server showToggleFollow(slug, session) {
643. let show = showBySlug(slug)
644. if (show == null) { return { error = 'no such show' } }
645. let uid = userIdOfSession(session)
646. if (uid == null) { return { error = 'you are not signed in' } }
647. let follow = isFollowing(uid, show.id) == false
648. if (!setFollowed(uid, show.id, follow)) { return { error = 'could not save the follow' } }
649. return { ok = true following = follow }
650. }