Add Emscripten Web Build to the CMake project

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...

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!

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
 
 ```

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 <emscripten/emscripten.h>
+#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();
+    //----------------------------------------------------------------------------------
 }