tracker

3.0 KB

1. // components/mymovies.hl — `/my/movies` (tracker.worldapi.org#13): every MOVIE the signed-in user follows, the one
2. // followed last on top — the architect: "/my/movies = the movies you follow, like /my/shows". A row: the small poster, the
3. // title with its year linking to the movie's page (`/movies/<slug>`, tracker#21: the one title page and its Follow button).
4. // Read-only like /my/shows, the same row look (the my-show-row tags/classes in styles.hl). Reused: `followsOfUser`,
5. // `insertByFollowDesc` (follows.hl), `cardOf`, `posterUrlOfName` (shows.hl). tracker#30 (mission 025): the slim cached card per
6. // movie and the user's cached watched set, no whole record (cast + crew) per load.
7. // mission 058 (tracker#24): a movie watched on its page (watch `movie:<id>`, watches.hl) shows the solid check in its row,
8. // and the count line says how many of them are watched ("3 movies · 1 watched"). The user's watched set (watchedSetOf, kept).
9. parent './main.hl'
10. import { appTitle } from '../project.hl'
11. import { userIdOfSession } from '../lib/users.hl'
12. import { followsOfUser, insertByFollowDesc } from '../lib/follows.hl'
13. import { cardOf, posterUrlOfName } from '../lib/shows.hl'
14. import { watchedSetOf } from '../lib/watches.hl'
16. // static: an mpackdb-backed helper must be `static` (hybriel#115/#116)
17. static watchedCountOf = (&rows) => {
18. let n = 0
19. for (r of rows) { if (r.watched) { n = n + 1 } }
20. return n
21. }
22. static myMoviesRowsOf = (&userId) => {
23. if (userId == null) { return [] }
24. watched = watchedSetOf(userId)
25. let out = []
26. for (f of followsOfUser(userId)) {
27. let c = cardOf(f.show)
28. if (c != null && c.type == 'movie') {
29. out = insertByFollowDesc(out, {
30. id = c.id title = c.titleYear href = c.href
31. posterUrl = posterUrlOfName(c.posterName) followedAt = f.at != null ? f.at : 0
32. watched = watched['movie:' + c.id] == true
33. })
34. }
35. }
36. return out
37. }
39. session = null
40. userId = userIdOfSession(session)
41. signedIn = userId != null
42. // a plain copy of userId for `rows` (mission 047: session sync, see components/show.hl `me`)
43. me = userId
45. rows = signedIn ? myMoviesRowsOf(me) : []
46. hasRows = rows.length > 0
47. noRows = !hasRows
48. countText = rows.length + (rows.length == 1 ? ' movie' : ' movies') + ' · ' + watchedCountOf(rows) + ' watched'
49. emptyText = signedIn ? 'You follow no movies yet.' : 'Sign in to see the movies you follow.'
51. __title = 'My movies — ' + appTitle
53. View {
54. myMoviesPage {
55. h1 { "My movies" }
56. if (noRows) { p { class = "muted" emptyText } }
57. if (hasRows) {
58. p { class = "muted list-count" id = "mymovies-count" countText }
59. myShowsRows {
60. for (row of rows) {
61. myShowRow {
62. img { class = "myshow-poster" src = row.posterUrl alt = row.title }
63. a { class = "myshow-title" href = row.href row.title }
64. if (row.watched) {
65. myMovieWatched { class = "checkicon solid" title = "Watched"
66. svg { viewBox = "0 0 24 24" width = "22" height = "22" "aria-hidden" = "true"
67. circle { cx = "12" cy = "12" r = "10" }
68. path { d = "M7 12.5 L10.5 16 L17 8.5" }
69. }
70. }
71. }
72. }
73. }
74. }
75. }
76. }
77. }