this repo has no description
0
fork

Configure Feed

Select the types of activity you want to include in your feed.

<Gleam FE> fix user-menu (#58)

* Fix user-menu

* Move the event listener up, to avoid creating multiple event listeners for the same event

* Add in aria labels

authored by

Mar and committed by
GitHub
8dfff7a0 734bb1df

+83 -9
+83 -9
frontend/src/frontend/page/site.gleam
··· 2 2 // Licensed under the BSD 3-Clause License. See the LICENSE file for more info. 3 3 4 4 import frontend/other/element_actions 5 + import frontend/other/fejson 5 6 import frontend/other/rendering 7 + import frontend/other/rust_kind_of_unwrap.{unwrap} 6 8 import frontend/page/site/editor 7 9 import frontend/page/site/subpages 8 10 import gleam/bool 9 11 import gleam/dict.{type Dict} 10 - import gleam/dynamic 11 - import gleam/fetch 12 - import gleam/http 13 - import gleam/http/request 14 - import gleam/http/response 15 12 import gleam/javascript/array 16 13 import gleam/javascript/promise 17 - import gleam/json 18 14 import gleam/list 19 15 import gleam/string 20 16 import gleamy_lights/console 21 17 import gleamy_lights/premixed 22 18 import gleamy_lights/premixed/gleam_colours 23 - import lumina/shared/shared_fepage_com.{ 24 - type FEPageServeResponse, FEPageServeResponse, 25 - } 26 19 import plinth/browser/document 27 20 import plinth/browser/element 28 21 import plinth/browser/event ··· 118 111 ) 119 112 global.set_interval(60, fn() { 120 113 check_if_page_needs_to_be_switched(sub_page_list) 114 + }) 115 + user_menu_toggle() 116 + 117 + document.query_selector("main") 118 + |> rust_kind_of_unwrap.unwrap 119 + |> element.add_event_listener("click", fn(_) { 120 + case document.get_element_by_id("user-menu") { 121 + Ok(user_menu) -> { 122 + let classes = 123 + user_menu 124 + |> element.get_attribute("class") 125 + |> unwrap 126 + user_menu |> element.set_attribute("class", classes <> " hidden") 127 + } 128 + Error(_) -> { 129 + console.error("Failed to find user menu.") 130 + } 131 + } 132 + }) 133 + 134 + case document.get_element_by_id("user-menu-button") { 135 + Ok(user_menu_button) -> { 136 + element.add_event_listener(user_menu_button, "click", fn(_) { 137 + console.log("User menu button clicked.") 138 + user_menu_toggle() 139 + }) 140 + Nil 141 + } 142 + _ -> { 143 + console.error("Failed to find user menu button.") 144 + Nil 145 + } 146 + } 147 + fejson.register_fejson_function(fn() { 148 + let d = fejson.get() 149 + case document.get_element_by_id("userimg") { 150 + Ok(f) -> { 151 + f |> element.set_attribute("alt", d.user.username) 152 + } 153 + _ -> Nil 154 + } 155 + 156 + document.query_selector_all(".settodisplayname") 157 + |> array.to_list 158 + |> list.each(fn(a) { a |> element.set_inner_text(d.user.username) }) 121 159 }) 122 160 editor.fold() 123 161 { ··· 344 382 Error(_) -> promise.resolve(error_out()) 345 383 } 346 384 } 385 + 386 + fn user_menu_toggle() { 387 + let assert Ok(user_menu_button) = 388 + document.get_element_by_id("user-menu-button") 389 + user_menu_button |> element.set_attribute("aria-haspopup", "true") 390 + 391 + case document.get_element_by_id("user-menu") { 392 + Ok(user_menu) -> { 393 + let classes = 394 + user_menu 395 + |> element.get_attribute("class") 396 + |> rust_kind_of_unwrap.unwrap 397 + case classes |> string.contains("hidden") { 398 + True -> { 399 + user_menu 400 + |> element.set_attribute( 401 + "class", 402 + string.replace(classes, "hidden", ""), 403 + ) 404 + } 405 + False -> { 406 + user_menu |> element.set_attribute("class", classes <> " hidden") 407 + } 408 + } 409 + classes 410 + |> string.contains("hidden") 411 + // |> bool.negate 412 + |> bool.to_string 413 + |> string.lowercase() 414 + |> element.set_attribute(user_menu_button, "aria-expanded", _) 415 + } 416 + Error(_) -> { 417 + console.error("Failed to find user menu.") 418 + } 419 + } 420 + }