From d5977e8c7a7f537b250ce34456df04bc2c829d74 Mon Sep 17 00:00:00 2001 From: Rob Loach Date: Fri, 21 Jan 2022 21:14:59 -0500 Subject: [PATCH] Add Emscripten Web Build to the CMake project --- examples/core/core_basic_window_web.cpp | 2 +- projects/CMake/CMakeLists.txt | 13 ++++ projects/CMake/README.md | 9 +++ projects/CMake/main.cpp | 86 ++++++++++++++++--------- 4 files changed, 77 insertions(+), 33 deletions(-) diff --git a/examples/core/core_basic_window_web.cpp b/examples/core/core_basic_window_web.cpp index 89bd6f01..546e6de7 100644 --- a/examples/core/core_basic_window_web.cpp +++ b/examples/core/core_basic_window_web.cpp @@ -1,6 +1,6 @@ /******************************************************************************************* * -* raylib [core] example - Basic window (adapted for HTML5 platform) +* raylib-cpp [core] example - Basic window (adapted for HTML5 platform) * * This example is prepared to compile for PLATFORM_WEB, PLATFORM_DESKTOP and PLATFORM_RPI * As you will notice, code structure is slightly diferent to the other examples... diff --git a/projects/CMake/CMakeLists.txt b/projects/CMake/CMakeLists.txt index d3d6eb3c..f92c7446 100644 --- a/projects/CMake/CMakeLists.txt +++ b/projects/CMake/CMakeLists.txt @@ -45,4 +45,17 @@ add_executable(${PROJECT_NAME} ${PROJECT_SOURCES}) set_target_properties(${PROJECT_NAME} PROPERTIES CXX_STANDARD 11) target_link_libraries(${PROJECT_NAME} PUBLIC raylib raylib_cpp) +# Web Configurations +if (${PLATFORM} STREQUAL "Web") + # Tell Emscripten to build an example.html file. + set_target_properties(${PROJECT_NAME} PROPERTIES SUFFIX ".html") +endif() + +# Checks if OSX and links appropriate frameworks (Only required on MacOS) +if (APPLE) + target_link_libraries(${PROJECT_NAME} "-framework IOKit") + target_link_libraries(${PROJECT_NAME} "-framework Cocoa") + target_link_libraries(${PROJECT_NAME} "-framework OpenGL") +endif() + # That's it! You should have an example executable that you can run. Have fun! diff --git a/projects/CMake/README.md b/projects/CMake/README.md index 7ee2dafd..23376826 100644 --- a/projects/CMake/README.md +++ b/projects/CMake/README.md @@ -11,6 +11,15 @@ cmake .. make ``` +### Web + +``` +mkdir build +cd build +emcmake cmake .. -DPLATFORM=Web -DCMAKE_BUILD_TYPE=Release -DCMAKE_EXE_LINKER_FLAGS="-s USE_GLFW=3" +emmake make +``` + ## Run ``` diff --git a/projects/CMake/main.cpp b/projects/CMake/main.cpp index 0392760f..c78c72d2 100644 --- a/projects/CMake/main.cpp +++ b/projects/CMake/main.cpp @@ -1,56 +1,78 @@ /******************************************************************************************* * -* raylib-cpp [core] example - Basic window +* raylib-cpp [core] example - Basic window (adapted for HTML5 platform) * -* Welcome to raylib-cpp! +* This example is prepared to compile for PLATFORM_WEB, PLATFORM_DESKTOP and PLATFORM_RPI +* As you will notice, code structure is slightly diferent to the other examples... +* To compile it for PLATFORM_WEB just uncomment #define PLATFORM_WEB at beginning * -* To test examples, just press F6 and execute raylib_compile_execute script -* Note that compiled executable is placed in the same folder as .c file +* This example has been created using raylib-cpp (www.raylib.com) +* raylib is licensed under an unmodified zlib/libpng license (View raylib.h for details) * -* You can find all basic examples on C:\raylib\raylib\examples folder or -* raylib official webpage: www.raylib.com -* -* Enjoy using raylib-cpp. :) -* -* This example has been created using raylib 1.0 (www.raylib.com) -* raylib-cpp is licensed under an unmodified zlib/libpng license (View raylib-cpp.hpp for details) -* -* Copyright (c) 2021 Rob Loach (@RobLoach) +* Copyright (c) 2015 Ramon Santamaria (@raysan5) * ********************************************************************************************/ #include "raylib-cpp.hpp" -int main() { +#if defined(PLATFORM_WEB) + #include +#endif + +//---------------------------------------------------------------------------------- +// Global Variables Definition +//---------------------------------------------------------------------------------- +int screenWidth = 800; +int screenHeight = 450; + +//---------------------------------------------------------------------------------- +// Module Functions Declaration +//---------------------------------------------------------------------------------- +void UpdateDrawFrame(void); // Update and Draw one frame + +//---------------------------------------------------------------------------------- +// Main Enry Point +//---------------------------------------------------------------------------------- +int main() +{ // Initialization //-------------------------------------------------------------------------------------- - int screenWidth = 800; - int screenHeight = 450; - raylib::Color textColor = LIGHTGRAY; - raylib::Window window(screenWidth, screenHeight, "raylib [core] example - basic window"); + raylib::Window window(screenWidth, screenHeight, "raylib-cpp [core] example - basic window"); - SetTargetFPS(60); +#if defined(PLATFORM_WEB) + emscripten_set_main_loop(UpdateDrawFrame, 0, 1); +#else + SetTargetFPS(60); // Set our game to run at 60 frames-per-second //-------------------------------------------------------------------------------------- // Main game loop while (!window.ShouldClose()) // Detect window close button or ESC key { - // Update - //---------------------------------------------------------------------------------- - // Update your variables here - //---------------------------------------------------------------------------------- + UpdateDrawFrame(); + } +#endif + + return 0; +} - // Draw - //---------------------------------------------------------------------------------- - BeginDrawing(); +//---------------------------------------------------------------------------------- +// Module Functions Definition +//---------------------------------------------------------------------------------- +void UpdateDrawFrame(void) +{ + // Update + //---------------------------------------------------------------------------------- + // TODO: Update your variables here + //---------------------------------------------------------------------------------- - window.ClearBackground(RAYWHITE); + // Draw + //---------------------------------------------------------------------------------- + BeginDrawing(); - textColor.DrawText("Congrats! You created your first window!", 190, 200, 20); + ClearBackground(RAYWHITE); - EndDrawing(); - //---------------------------------------------------------------------------------- - } + DrawText("Congrats! You created your first raylib-cpp window!", 190, 200, 20, LIGHTGRAY); - return 0; + EndDrawing(); + //---------------------------------------------------------------------------------- }