@@ -12,22 +12,15 @@ function make_environment(env) {
1212}
1313
1414/**
15- * Setup correct DPI of canvas element for HiDPI screens.
15+ * Adjust canvas size according to screen DPI.
1616 *
1717 * @see : https://web.dev/articles/canvas-hidipi
1818 */
19- function setupCanvas ( canvas ) {
19+ function adjustCanvasSize ( ctx , height , width ) {
2020 const dpr = window . devicePixelRatio || 1 ;
21- const { height, width } = canvas . getBoundingClientRect ( ) ;
22- canvas . height = height * dpr ;
23- canvas . width = width * dpr ;
24-
25- const ctx = canvas . getContext ( '2d' ) ;
26- if ( ! ctx ) {
27- throw new Error ( "Could not create 2d canvas context" )
28- }
21+ ctx . canvas . height = height * dpr ;
22+ ctx . canvas . width = width * dpr ;
2923 ctx . scale ( dpr , dpr ) ;
30- return ctx ;
3124}
3225
3326let iota = 0 ;
@@ -85,6 +78,13 @@ class RaylibJs {
8578 }
8679
8780 this . ctx = setupCanvas ( canvas ) ;
81+ if ( ! this . ctx ) {
82+ throw new Error ( "Could not create 2d canvas context" )
83+ }
84+
85+ const { height, width } = ctx . canvas . getBoundingClientRect ( ) ;
86+ adjustCanvasSize ( ctx , height , width ) ;
87+
8888 this . wasm = await WebAssembly . instantiateStreaming ( fetch ( wasmPath ) , {
8989 env : make_environment ( this )
9090 } ) ;
@@ -126,8 +126,7 @@ class RaylibJs {
126126 }
127127
128128 InitWindow ( width , height , title_ptr ) {
129- this . ctx . canvas . width = width ;
130- this . ctx . canvas . height = height ;
129+ adjustCanvasSize ( this . ctx , height , width ) ;
131130 const buffer = this . wasm . instance . exports . memory . buffer ;
132131 document . title = cstr_by_ptr ( buffer , title_ptr ) ;
133132 }
0 commit comments