Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

Sign up for GitHub

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Using canvas id provided by Module for event binding #4690

Merged
merged 1 commit into from
Jan 15, 2025
Merged

Using canvas id provided by Module for event binding #4690

Show file tree
Hide file tree
Changes from all commits
Commits
Show all changes
1 commit
Select commit
File filter

Filter by extension

Filter by extension
Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
23 changes: 21 additions & 2 deletions examples/core/core_input_mouse.c
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -2,12 +2,12 @@
*
* raylib [core] example - Mouse input
*
* Example originally created with raylib 1.0, last time updated with raylib 4.0
* Example originally created with raylib 1.0, last time updated with raylib 5.5
*
* Example licensed under an unmodified zlib/libpng license, which is an OSI-certified,
* BSD-like license that allows static linking with closed source software
*
* Copyright (c) 2014-2024 Ramon Santamaria (@raysan5)
* Copyright (c) 2014-2025 Ramon Santamaria (@raysan5)
*
********************************************************************************************/

Expand All @@ -27,6 +27,7 @@ int main(void)

Vector2 ballPosition = { -100.0f, -100.0f };
Color ballColor = DARKBLUE;
int isCursorHidden = 0;

SetTargetFPS(60); // Set our game to run at 60 frames-per-second
//---------------------------------------------------------------------------------------
Expand All @@ -36,6 +37,20 @@ int main(void)
{
// Update
//----------------------------------------------------------------------------------
if (IsKeyPressed(KEY_H))
{
if (isCursorHidden == 0)
{
HideCursor();
isCursorHidden = 1;
}
else
{
ShowCursor();
isCursorHidden = 0;
}
}

ballPosition = GetMousePosition();

if (IsMouseButtonPressed(MOUSE_BUTTON_LEFT)) ballColor = MAROON;
Expand All @@ -56,6 +71,10 @@ int main(void)
DrawCircleV(ballPosition, 40, ballColor);

DrawText("move ball with mouse and click mouse button to change color", 10, 10, 20, DARKGRAY);
DrawText("Press 'H' to toggle cursor visibility", 10, 30, 20, DARKGRAY);

if (isCursorHidden == 1) DrawText("CURSOR HIDDEN", 20, 60, 20, RED);
else DrawText("CURSOR VISIBLE", 20, 60, 20, LIME);

EndDrawing();
//----------------------------------------------------------------------------------
Expand Down
44 changes: 31 additions & 13 deletions src/platforms/rcore_web.c
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -142,6 +142,8 @@ static EM_BOOL EmscriptenPointerlockCallback(int eventType, const EmscriptenPoin
static EM_BOOL EmscriptenTouchCallback(int eventType, const EmscriptenTouchEvent *touchEvent, void *userData);
static EM_BOOL EmscriptenGamepadCallback(int eventType, const EmscriptenGamepadEvent *gamepadEvent, void *userData);

static const char *GetCanvasId(void);

//----------------------------------------------------------------------------------
// Module Functions Declaration
//----------------------------------------------------------------------------------
Expand Down Expand Up @@ -824,7 +826,7 @@ void ShowCursor(void)
{
if (CORE.Input.Mouse.cursorHidden)
{
EM_ASM( { document.getElementById("canvas").style.cursor = UTF8ToString($0); }, cursorLUT[CORE.Input.Mouse.cursor]);
EM_ASM( { Module.canvas.style.cursor = UTF8ToString($0); }, cursorLUT[CORE.Input.Mouse.cursor]);

CORE.Input.Mouse.cursorHidden = false;
}
Expand All @@ -835,7 +837,7 @@ void HideCursor(void)
{
if (!CORE.Input.Mouse.cursorHidden)
{
EM_ASM(document.getElementById('canvas').style.cursor = 'none';);
EM_ASM(Module.canvas.style.cursor = 'none';);

CORE.Input.Mouse.cursorHidden = true;
}
Expand All @@ -856,7 +858,7 @@ void EnableCursor(void)
void DisableCursor(void)
{
// TODO: figure out how not to hard code the canvas ID here.
emscripten_request_pointerlock("#canvas", 1);
emscripten_request_pointerlock(GetCanvasId(), 1);

// Set cursor position in the middle
SetMousePosition(CORE.Window.screen.width/2, CORE.Window.screen.height/2);
Expand Down Expand Up @@ -1355,25 +1357,25 @@ int InitPlatform(void)
// emscripten_set_keydown_callback("#canvas", NULL, 1, EmscriptenKeyboardCallback);

// Support mouse events
emscripten_set_click_callback("#canvas", NULL, 1, EmscriptenMouseCallback);
emscripten_set_click_callback(GetCanvasId(), NULL, 1, EmscriptenMouseCallback);
emscripten_set_pointerlockchange_callback(EMSCRIPTEN_EVENT_TARGET_WINDOW, NULL, 1, EmscriptenPointerlockCallback);

// Following the mouse delta when the mouse is locked
emscripten_set_mousemove_callback("#canvas", NULL, 1, EmscriptenMouseMoveCallback);
emscripten_set_mousemove_callback(GetCanvasId(), NULL, 1, EmscriptenMouseMoveCallback);

// Support touch events
emscripten_set_touchstart_callback("#canvas", NULL, 1, EmscriptenTouchCallback);
emscripten_set_touchend_callback("#canvas", NULL, 1, EmscriptenTouchCallback);
emscripten_set_touchmove_callback("#canvas", NULL, 1, EmscriptenTouchCallback);
emscripten_set_touchcancel_callback("#canvas", NULL, 1, EmscriptenTouchCallback);
emscripten_set_touchstart_callback(GetCanvasId(), NULL, 1, EmscriptenTouchCallback);
emscripten_set_touchend_callback(GetCanvasId(), NULL, 1, EmscriptenTouchCallback);
emscripten_set_touchmove_callback(GetCanvasId(), NULL, 1, EmscriptenTouchCallback);
emscripten_set_touchcancel_callback(GetCanvasId(), NULL, 1, EmscriptenTouchCallback);

// Support gamepad events (not provided by GLFW3 on emscripten)
emscripten_set_gamepadconnected_callback(NULL, 1, EmscriptenGamepadCallback);
emscripten_set_gamepaddisconnected_callback(NULL, 1, EmscriptenGamepadCallback);

// Support focus events
emscripten_set_blur_callback("#canvas", platform.handle, 1, EmscriptenFocusCallback);
emscripten_set_focus_callback("#canvas", platform.handle, 1, EmscriptenFocusCallback);
emscripten_set_blur_callback(GetCanvasId(), platform.handle, 1, EmscriptenFocusCallback);
emscripten_set_focus_callback(GetCanvasId(), platform.handle, 1, EmscriptenFocusCallback);
//----------------------------------------------------------------------------

// Initialize timing system
Expand Down Expand Up @@ -1674,7 +1676,7 @@ static EM_BOOL EmscriptenResizeCallback(int eventType, const EmscriptenUiEvent *
if (height < (int)CORE.Window.screenMin.height) height = CORE.Window.screenMin.height;
else if ((height > (int)CORE.Window.screenMax.height) && (CORE.Window.screenMax.height > 0)) height = CORE.Window.screenMax.height;

emscripten_set_canvas_element_size("#canvas", width, height);
emscripten_set_canvas_element_size(GetCanvasId(), width, height);

SetupViewport(width, height); // Reset viewport and projection matrix for new size

Expand Down Expand Up @@ -1760,7 +1762,7 @@ static EM_BOOL EmscriptenTouchCallback(int eventType, const EmscriptenTouchEvent
// NOTE: emscripten_get_canvas_element_size() returns canvas.width and canvas.height but
// we are looking for actual CSS size: canvas.style.width and canvas.style.height
// EMSCRIPTEN_RESULT res = emscripten_get_canvas_element_size("#canvas", &canvasWidth, &canvasHeight);
emscripten_get_element_css_size("#canvas", &canvasWidth, &canvasHeight);
emscripten_get_element_css_size(GetCanvasId(), &canvasWidth, &canvasHeight);

for (int i = 0; (i < CORE.Input.Touch.pointCount) && (i < MAX_TOUCH_POINTS); i++)
{
Expand Down Expand Up @@ -1835,4 +1837,20 @@ static EM_BOOL EmscriptenTouchCallback(int eventType, const EmscriptenTouchEvent
return 1; // The event was consumed by the callback handler
}

// obtaining the canvas id provided by the module configuration
EM_JS(char*, GetCanvasIdJs, (), {
var canvasId = "#" + Module.canvas.id;
var lengthBytes = lengthBytesUTF8(canvasId) + 1;
var stringOnWasmHeap = _malloc(lengthBytes);
stringToUTF8(canvasId, stringOnWasmHeap, lengthBytes);
return stringOnWasmHeap;
});

static const char *GetCanvasId(void)
{
static char *canvasId = NULL;
if (canvasId == NULL) canvasId = GetCanvasIdJs();
return canvasId;
}

// EOF
Loading