window_js.odin 11 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197198199200201202203204205206207208209210211212213214215216217218219220221222223224225226227228229230231232233234235236237238239240241242243244245246247248249250251252253254255256257258259260261262263264265266267268269270271272273274275276277278279280281282283284285286287288289290291292293294295296297298299300301302303304305306307308309310311312313314315316317318319320321322323324325326327328329330331332333334335336337338339340341342343344345346347348349350351352353354355356357358359360361362363364365366367368369370371372373374375376377378379380381382383384385386387388389390391392393394395396397398399400401402403404405406407408409410411412413414415416417418419420421422423424425426427428429430431432433434435436437438439440441442443444445446447448449450451452453454455456457458459460
  1. #+build js
  2. #+private file
  3. package karl2d
  4. @(private="package")
  5. WINDOW_INTERFACE_JS :: Window_Interface {
  6. state_size = js_state_size,
  7. init = js_init,
  8. shutdown = js_shutdown,
  9. window_handle = js_window_handle,
  10. process_events = js_process_events,
  11. get_events = js_get_events,
  12. get_width = js_get_width,
  13. get_height = js_get_height,
  14. clear_events = js_clear_events,
  15. set_position = js_set_position,
  16. set_size = js_set_size,
  17. get_window_scale = js_get_window_scale,
  18. set_window_mode = js_set_window_mode,
  19. is_gamepad_active = js_is_gamepad_active,
  20. get_gamepad_axis = js_get_gamepad_axis,
  21. set_gamepad_vibration = js_set_gamepad_vibration,
  22. set_internal_state = js_set_internal_state,
  23. }
  24. import "core:sys/wasm/js"
  25. import "base:runtime"
  26. import "core:log"
  27. js_state_size :: proc() -> int {
  28. return size_of(JS_State)
  29. }
  30. js_init :: proc(
  31. window_state: rawptr,
  32. window_width: int,
  33. window_height: int,
  34. window_title: string,
  35. init_options: Init_Options,
  36. allocator: runtime.Allocator,
  37. ) {
  38. s = (^JS_State)(window_state)
  39. s.allocator = allocator
  40. s.canvas_id = "webgl-canvas"
  41. js.set_document_title(window_title)
  42. // The browser window probably has some other size than what was sent in.
  43. switch init_options.window_mode {
  44. case .Windowed:
  45. js_set_size(window_width, window_height)
  46. case .Windowed_Resizable:
  47. add_window_event_listener(.Resize, js_event_window_resize)
  48. update_canvas_size(s.canvas_id)
  49. case .Borderless_Fullscreen:
  50. log.error("Borderless_Fullscreen not implemented on web, but you can make it happen by using Window_Mode.Windowed_Resizable and putting the game in a fullscreen iframe.")
  51. }
  52. s.window_mode = init_options.window_mode
  53. add_canvas_event_listener(.Mouse_Move, js_event_mouse_move)
  54. add_canvas_event_listener(.Mouse_Down, js_event_mouse_down)
  55. add_canvas_event_listener(.Mouse_Up, js_event_mouse_up)
  56. add_canvas_event_listener(.Wheel, js_event_mouse_wheel)
  57. add_window_event_listener(.Key_Down, js_event_key_down)
  58. add_window_event_listener(.Key_Up, js_event_key_up)
  59. }
  60. js_event_key_down :: proc(e: js.Event) {
  61. if e.key.repeat {
  62. return
  63. }
  64. key := key_from_js_event(e)
  65. append(&s.events, Window_Event_Key_Went_Down {
  66. key = key,
  67. })
  68. }
  69. js_event_key_up :: proc(e: js.Event) {
  70. key := key_from_js_event(e)
  71. append(&s.events, Window_Event_Key_Went_Up {
  72. key = key,
  73. })
  74. }
  75. js_event_window_resize :: proc(e: js.Event) {
  76. update_canvas_size(s.canvas_id)
  77. }
  78. js_event_mouse_move :: proc(e: js.Event) {
  79. append(&s.events, Window_Event_Mouse_Move {
  80. position = {f32(e.mouse.client.x), f32(e.mouse.client.y)},
  81. })
  82. }
  83. js_event_mouse_down :: proc(e: js.Event) {
  84. button := Mouse_Button.Left
  85. if e.mouse.button == 2 {
  86. button = .Right
  87. }
  88. if e.mouse.button == 1 {
  89. button = .Middle
  90. }
  91. append(&s.events, Window_Event_Mouse_Button_Went_Down {
  92. button = button,
  93. })
  94. }
  95. js_event_mouse_up :: proc(e: js.Event) {
  96. button := Mouse_Button.Left
  97. if e.mouse.button == 2 {
  98. button = .Right
  99. }
  100. if e.mouse.button == 1 {
  101. button = .Middle
  102. }
  103. append(&s.events, Window_Event_Mouse_Button_Went_Up {
  104. button = button,
  105. })
  106. }
  107. js_event_mouse_wheel :: proc(e: js.Event) {
  108. append(&s.events, Window_Event_Mouse_Wheel {
  109. // Not the best way, but how would we know what the wheel deltaMode really represents? If it
  110. // is in pixels, how much "scroll" does that equal to?
  111. delta = f32(e.wheel.delta.y > 0 ? -1 : 1),
  112. })
  113. }
  114. add_canvas_event_listener :: proc(evt: js.Event_Kind, callback: proc(e: js.Event)) {
  115. js.add_event_listener(
  116. s.canvas_id,
  117. evt,
  118. nil,
  119. callback,
  120. true,
  121. )
  122. }
  123. add_window_event_listener :: proc(evt: js.Event_Kind, callback: proc(e: js.Event)) {
  124. js.add_window_event_listener(evt, nil, callback, true)
  125. }
  126. remove_window_event_listener :: proc(evt: js.Event_Kind, callback: proc(e: js.Event)) {
  127. js.remove_window_event_listener(evt, nil, callback, true)
  128. }
  129. update_canvas_size :: proc(canvas_id: HTML_Canvas_ID) {
  130. rect := js.get_bounding_client_rect("body")
  131. width := f64(rect.width)
  132. height := f64(rect.height)
  133. js.set_element_key_f64(canvas_id, "width", width)
  134. js.set_element_key_f64(canvas_id, "height", height)
  135. s.width = int(rect.width)
  136. s.height = int(rect.height)
  137. append(&s.events, Window_Event_Resize {
  138. width = int(width),
  139. height = int(height),
  140. })
  141. }
  142. js_shutdown :: proc() {
  143. }
  144. js_window_handle :: proc() -> Window_Handle {
  145. return Window_Handle(&s.canvas_id)
  146. }
  147. // This works for XBox controller -- does it work for PlayStation?
  148. KARL2D_GAMEPAD_BUTTON_FROM_JS :: [Gamepad_Button]int {
  149. .Left_Face_Up = 12,
  150. .Left_Face_Down = 13,
  151. .Left_Face_Left = 14,
  152. .Left_Face_Right = 15,
  153. .Right_Face_Up = 3,
  154. .Right_Face_Down = 0,
  155. .Right_Face_Left = 2,
  156. .Right_Face_Right = 1,
  157. .Left_Shoulder = 5,
  158. .Left_Trigger = 7,
  159. .Right_Shoulder = 4,
  160. .Right_Trigger = 6,
  161. .Left_Stick_Press = 10,
  162. .Right_Stick_Press = 11,
  163. .Middle_Face_Left = 8,
  164. .Middle_Face_Middle = -1,
  165. .Middle_Face_Right = 9,
  166. }
  167. js_process_events :: proc() {
  168. for gamepad_idx in 0..<MAX_GAMEPADS {
  169. // new_state
  170. ns: js.Gamepad_State
  171. if !js.get_gamepad_state(gamepad_idx, &ns) || !ns.connected {
  172. if s.gamepad_state[gamepad_idx].connected {
  173. s.gamepad_state[gamepad_idx] = {}
  174. }
  175. continue
  176. }
  177. // prev_state
  178. ps := s.gamepad_state[gamepad_idx]
  179. // We check if any button changed from pressed to not pressed and the other way around.
  180. for js_idx, button in KARL2D_GAMEPAD_BUTTON_FROM_JS {
  181. if js_idx == -1 {
  182. continue
  183. }
  184. if !ps.buttons[js_idx].pressed && ns.buttons[js_idx].pressed {
  185. append(&s.events, Window_Event_Gamepad_Button_Went_Down {
  186. gamepad = gamepad_idx,
  187. button = button,
  188. })
  189. }
  190. if ps.buttons[js_idx].pressed && !ns.buttons[js_idx].pressed {
  191. append(&s.events, Window_Event_Gamepad_Button_Went_Up {
  192. gamepad = gamepad_idx,
  193. button = button,
  194. })
  195. }
  196. }
  197. s.gamepad_state[gamepad_idx] = ns
  198. }
  199. }
  200. js_get_events :: proc() -> []Window_Event {
  201. return s.events[:]
  202. }
  203. js_get_width :: proc() -> int {
  204. return s.width
  205. }
  206. js_get_height :: proc() -> int {
  207. return s.height
  208. }
  209. js_clear_events :: proc() {
  210. runtime.clear(&s.events)
  211. }
  212. js_set_position :: proc(x: int, y: int) {
  213. log.warn("set_window_position not implemented on web")
  214. }
  215. js_set_size :: proc(w, h: int) {
  216. s.width = w
  217. s.height = h
  218. js.set_element_key_f64(s.canvas_id, "width", f64(w))
  219. js.set_element_key_f64(s.canvas_id, "height", f64(h))
  220. }
  221. js_get_window_scale :: proc() -> f32 {
  222. return f32(js.device_pixel_ratio())
  223. }
  224. js_set_window_mode :: proc(window_mode: Window_Mode) {
  225. if window_mode == .Windowed_Resizable && s.window_mode == .Windowed {
  226. add_window_event_listener(.Resize, js_event_window_resize)
  227. update_canvas_size(s.canvas_id)
  228. } else if window_mode == .Windowed && s.window_mode == .Windowed_Resizable {
  229. remove_window_event_listener(.Resize, js_event_window_resize)
  230. js_set_size(s.width, s.height)
  231. }
  232. s.window_mode = window_mode
  233. }
  234. js_is_gamepad_active :: proc(gamepad: int) -> bool {
  235. if gamepad < 0 || gamepad >= MAX_GAMEPADS {
  236. return false
  237. }
  238. return s.gamepad_state[gamepad].connected
  239. }
  240. js_get_gamepad_axis :: proc(gamepad: int, axis: Gamepad_Axis) -> f32 {
  241. if gamepad < 0 || gamepad >= MAX_GAMEPADS {
  242. return 0
  243. }
  244. if axis == .Left_Trigger {
  245. return f32(s.gamepad_state[gamepad].buttons[KARL2D_GAMEPAD_BUTTON_FROM_JS[.Left_Trigger]].value)
  246. }
  247. if axis == .Right_Trigger {
  248. return f32(s.gamepad_state[gamepad].buttons[KARL2D_GAMEPAD_BUTTON_FROM_JS[.Right_Trigger]].value)
  249. }
  250. return f32(s.gamepad_state[gamepad].axes[int(axis)])
  251. }
  252. js_set_gamepad_vibration :: proc(gamepad: int, left: f32, right: f32) {
  253. if gamepad < 0 || gamepad >= MAX_GAMEPADS {
  254. return
  255. }
  256. }
  257. js_set_internal_state :: proc(state: rawptr) {
  258. assert(state != nil)
  259. s = (^JS_State)(state)
  260. }
  261. @(private="package")
  262. HTML_Canvas_ID :: string
  263. JS_State :: struct {
  264. allocator: runtime.Allocator,
  265. canvas_id: HTML_Canvas_ID,
  266. width: int,
  267. height: int,
  268. events: [dynamic]Window_Event,
  269. gamepad_state: [MAX_GAMEPADS]js.Gamepad_State,
  270. window_mode: Window_Mode,
  271. }
  272. s: ^JS_State
  273. key_from_js_event :: proc(e: js.Event) -> Keyboard_Key {
  274. switch e.key.code {
  275. case "Digit1": return .N1
  276. case "Digit2": return .N2
  277. case "Digit3": return .N3
  278. case "Digit4": return .N4
  279. case "Digit5": return .N5
  280. case "Digit6": return .N6
  281. case "Digit7": return .N7
  282. case "Digit8": return .N8
  283. case "Digit9": return .N9
  284. case "Digit0": return .N0
  285. case "KeyA": return .A
  286. case "KeyB": return .B
  287. case "KeyC": return .C
  288. case "KeyD": return .D
  289. case "KeyE": return .E
  290. case "KeyF": return .F
  291. case "KeyG": return .G
  292. case "KeyH": return .H
  293. case "KeyI": return .I
  294. case "KeyJ": return .J
  295. case "KeyK": return .K
  296. case "KeyL": return .L
  297. case "KeyM": return .M
  298. case "KeyN": return .N
  299. case "KeyO": return .O
  300. case "KeyP": return .P
  301. case "KeyQ": return .Q
  302. case "KeyR": return .R
  303. case "KeyS": return .S
  304. case "KeyT": return .T
  305. case "KeyU": return .U
  306. case "KeyV": return .V
  307. case "KeyW": return .W
  308. case "KeyX": return .X
  309. case "KeyY": return .Y
  310. case "KeyZ": return .Z
  311. case "Quote": return .Apostrophe
  312. case "Comma": return .Comma
  313. case "Minus": return .Minus
  314. case "Period": return .Period
  315. case "Slash": return .Slash
  316. case "Semicolon": return .Semicolon
  317. case "Equal": return .Equal
  318. case "BracketLeft": return .Left_Bracket
  319. case "Backslash": return .Backslash
  320. case "IntlBackslash": return .Backslash
  321. case "BracketRight": return .Right_Bracket
  322. case "Backquote": return .Backtick
  323. case "Space": return .Space
  324. case "Escape": return .Escape
  325. case "Enter": return .Enter
  326. case "Tab": return .Tab
  327. case "Backspace": return .Backspace
  328. case "Insert": return .Insert
  329. case "Delete": return .Delete
  330. case "ArrowRight": return .Right
  331. case "ArrowLeft": return .Left
  332. case "ArrowDown": return .Down
  333. case "ArrowUp": return .Up
  334. case "PageUp": return .Page_Up
  335. case "PageDown": return .Page_Down
  336. case "Home": return .Home
  337. case "End": return .End
  338. case "CapsLock": return .Caps_Lock
  339. case "ScrollLock": return .Scroll_Lock
  340. case "NumLock": return .Num_Lock
  341. case "PrintScreen": return .Print_Screen
  342. case "Pause": return .Pause
  343. case "F1": return .F1
  344. case "F2": return .F2
  345. case "F3": return .F3
  346. case "F4": return .F4
  347. case "F5": return .F5
  348. case "F6": return .F6
  349. case "F7": return .F7
  350. case "F8": return .F8
  351. case "F9": return .F9
  352. case "F10": return .F10
  353. case "F11": return .F11
  354. case "F12": return .F12
  355. case "ShiftLeft": return .Left_Shift
  356. case "ControlLeft": return .Left_Control
  357. case "AltLeft": return .Left_Alt
  358. case "MetaLeft": return .Left_Super
  359. case "ShiftRight": return .Right_Shift
  360. case "ControlRight": return .Right_Control
  361. case "AltRight": return .Right_Alt
  362. case "MetaRight": return .Right_Super
  363. case "ContextMenu": return .Menu
  364. case "Numpad0": return .NP_0
  365. case "Numpad1": return .NP_1
  366. case "Numpad2": return .NP_2
  367. case "Numpad3": return .NP_3
  368. case "Numpad4": return .NP_4
  369. case "Numpad5": return .NP_5
  370. case "Numpad6": return .NP_6
  371. case "Numpad7": return .NP_7
  372. case "Numpad8": return .NP_8
  373. case "Numpad9": return .NP_9
  374. case "NumpadDecimal": return .NP_Decimal
  375. case "NumpadDivide": return .NP_Divide
  376. case "NumpadMultiply": return .NP_Multiply
  377. case "NumpadSubtract": return .NP_Subtract
  378. case "NumpadAdd": return .NP_Add
  379. case "NumpadEnter": return .NP_Enter
  380. }
  381. log.errorf("Unhandled key code: %v", e.key.code)
  382. return .None
  383. }