gitoria

5.7 KB

1. // components/main.hl — THE SHELL: the application header (brand; top right the login: ident's
2. // "Log in with ident" button, or who you are + Log out), the display-name prompt of a first login,
3. // and the slot every page renders into. All CSS is in styles.hl.
4. // THE SELECTOR (gitoria#14): `<ident-selector key=IDENT_API_KEY>` from <ident>/selector.js, as in tickets.
5. // Choosing an identity fires `ident-login` (one-time code); /login.js hands it to the hidden input
6. // #identcode, whose `change` goes to the face gitoriaLogin (server-side exchange, no reload). The element's
7. // class is `in` / `out`; /login.js mirrors it into the selector's `loggedIn`. ident only answers a REGISTERED
8. // origin (the main address), so on a repo address (the request's host, `host = null`, hybriel#74) the selector
9. // carries the class `onrepo` and styles.hl hides it — the button stays there.
10. // LOGIN: a plain link to <ident>/login?key=&return=<public url>/login/callback (lib/api.hl
11. // loginCallback); /login.js adds `?next=<this page>` at the click so the login returns here.
12. // FIRST LOGIN: no display name yet → the name prompt; creating a repo waits for it.
13. import { siteName } from '../project.hl'
14. import { slugOfHost } from '../lib/util.hl'
15. import { identKey, selectorScript, loginHref, infoOfSession, userOfLoginCode, userInfo, setUserName, userOfSession } from '../lib/users.hl'
16. import { randomBytes } from 'hl:crypto'
18. slot = null
19. session = null
20. host = null
22. me = infoOfSession(session)
23. loggedIn = me != null
24. loggedOut = me == null
25. needsName = me != null && !me.named
26. myName = me != null && me.named ? me.name : 'you'
27. buttonHref = loginHref
28. onRepoHost = slugOfHost(host) != ''
29. selectorClass = (me != null ? 'in' : 'out') + (onRepoHost ? ' onrepo' : '')
30. selectorKey = identKey
31. identScript = selectorScript
32. loginError = ''
33. hasLoginError = false
34. nameDraft = ''
35. nameError = ''
36. // OFFLINE (mission 046, as tracker.worldapi.org#10): the service worker opens `/` from its cache without a network; the
37. // shell then says so. hl:web gives a page no connection state and no "mounted" hook, so a tick asks the browser:
38. // `netProbe` runs an endless 1 s CSS animation (styles.hl), and each `animationiteration` reads navigator.onLine — a
39. // write only when it changed.
40. offline = false
42. View {
43. body {
44. applicationHeader {
45. a { class = "brand" href = "/" siteName }
46. userBox { id = "userbox"
47. identSelector { id = "selector" key = selectorKey class = selectorClass }
48. if (loggedIn) {
49. span { id = "whoami" myName }
50. button { id = "logout" type = "button" class = "quiet" "Log out" on click(e) { emit doLogout(e) } }
51. }
52. if (loggedOut) {
53. a { id = "loginbutton" class = "button" href = buttonHref "Log in with ident" }
54. }
55. input { id = "identcode" type = "hidden" on change(e) { emit gotCode(e) } }
56. }
57. }
58. if (hasLoginError) { p { id = "loginerror" class = "message banner" loginError } }
59. if (offline) { offlineNote { id = "offline" "You are offline. Repositories and code need the network." } }
60. netProbe { "aria-hidden" = "true" on animationiteration(e) { emit netTick(e) } }
61. if (needsName) {
62. namePrompt {
63. form { id = "nameform"
64. on submit(e) {
65. e.preventDefault()
66. emit saveName(e)
67. }
68. label { "Welcome! Choose the display name others see as the owner of your repositories"
69. input { id = "displayname" name = "displayname" required = "required" maxlength = "60" value = nameDraft on input(e) { emit setNameDraft(e.target.value) } }
70. }
71. button { id = "namesave" type = "submit" "Save" }
72. p { id = "nameerror" class = "message" nameError }
73. }
74. }
75. }
76. main { slot }
77. script { src = identScript }
78. script { src = "/login.js" }
79. }
80. }
82. showMe = (info) => {
83. loggedIn = true
84. loggedOut = false
85. needsName = !info.named
86. myName = info.named ? info.name : 'you'
87. selectorClass = onRepoHost ? 'in onrepo' : 'in'
88. loginError = ''
89. hasLoginError = false
90. }
91. showOut = () => {
92. loggedIn = false
93. loggedOut = true
94. needsName = false
95. myName = 'you'
96. selectorClass = onRepoHost ? 'out onrepo' : 'out'
97. }
99. // the selector's code (via /login.js and the hidden input) → the server exchanges it
100. on gotCode(e) {
101. code = e.target.value
102. e.target.value = ''
103. if (code == null || code == '') { return null }
104. r = emit server gitoriaLogin(code)
105. if (r == null || r.error != null) {
106. loginError = r != null ? r.error : 'the login failed'
107. hasLoginError = true
108. return null
109. }
110. showMe(r)
111. }
113. on client gitoriaSignedIn(tag, info) { showMe(info) }
114. on client gitoriaSignedOut(tag) { showOut() }
116. on setNameDraft(v) { nameDraft = v }
118. on netTick(e) {
119. down = window.navigator.onLine == false
120. if (down != offline) { offline = down }
121. }
123. on saveName(e) {
124. r = emit server gitoriaSaveName(nameDraft)
125. if (r == null || r.error != null) {
126. nameError = r != null ? r.error : 'could not save the name'
127. return null
128. }
129. nameError = ''
130. showMe(r)
131. }
133. on doLogout(e) {
134. emit server gitoriaLogOut()
135. showOut()
136. }
138. // ---- the faces (the trailing `session` is always the server's: hybriel #16) ----
139. on server gitoriaLogin(code, session) {
140. if (session == null) { return { error = 'no session — reload the page' } }
141. x = userOfLoginCode(code)
142. if (x.error != null) { return { error = x.error } }
143. tag = randomBytes(16)
144. session.user = { id = x.user.id }
145. session.data.tag = tag
146. info = userInfo(x.user)
147. emit client gitoriaSignedIn(tag, info)
148. return info
149. }
151. on server gitoriaSaveName(name, session) {
152. u = userOfSession(session)
153. if (u == null) { return { error = 'log in with ident first' } }
154. r = setUserName(u.id, name)
155. if (r.error != null) { return { error = r.error } }
156. info = userInfo(r.user)
157. emit client gitoriaSignedIn(session.data.tag, info)
158. return info
159. }
161. on server gitoriaLogOut(session) {
162. if (session == null) { return { error = 'no session' } }
163. emit client gitoriaSignedOut(session.data.tag)
164. session.user = null
165. return { ok = true }
166. }