[WIP] Emscripten support

bgfx-emscripten/bgfx_emscripten_utils.hpp

@@ -0,0 +1,22 @@
+#pragma once
+
+#include <string>
+#include <emscripten/emscripten.h>
+
+namespace emscriptenutils {
+
+inline bool fetch_file(const std::string& filename, std::string& fileContents) {
+    emscripten_fetch_attr_t attr;
+    emscripten_fetch_attr_init(&attr);
+    strcpy(attr.requestMethod, "GET");
+    attr.attributes = EMSCRIPTEN_FETCH_ATTR_LOAD_TO_MEMORY | EMSCRIPTEN_FETCH_SYNCHRONOUS;
+    emscripten_fetch_t *fetch = emscripten_fetch(&attr, filename.c_str());
+    if (fetch->status == 200) {
+        *fileContents = fetch->data;
+        return true;
+    } else {
+        return false;
+    }
+}
+
+} // namespace emscriptenutils

compile-shaders-emscripten.sh

@@ -0,0 +1,12 @@
+#!/bin/bash
+
+# compile shaders
+
+# simple shader
+./third-party/build/bin/shaderc \
+-f shader/v_simple.sc -o shader/v_simple.bin  \
+--platform asmjs --type vertex --verbose -i ./
+
+./third-party/build/bin/shaderc \
+-f shader/f_simple.sc -o shader/f_simple.bin \
+--platform asmjs --type fragment --verbose -i ./

configure-make.sh

@@ -0,0 +1,11 @@
+#!/bin/bash
+
+# Commands to configure this repo for building after dependencies have been installed
+
+cmake -S . -B build/debug -G "Unix Makefiles" -DCMAKE_BUILD_TYPE=Debug \
+-DCMAKE_PREFIX_PATH="$(pwd)/third-party/build" \
+-DCMAKE_EXPORT_COMPILE_COMMANDS=ON
+
+cmake -S . -B build/release -G "Unix Makefiles" -DCMAKE_BUILD_TYPE=Release \
+-DCMAKE_PREFIX_PATH="$(pwd)/third-party/build" \
+-DCMAKE_EXPORT_COMPILE_COMMANDS=ON

main.cpp

@@ -8,6 +8,12 @@
 #include "imgui.h"
 #include "sdl-imgui/imgui_impl_sdl.h"
 
+#if BX_PLATFORM_EMSCRIPTEN
+#include "emscripten.h"
+#include "emscripten/html5.h"
+#include "bgfx-emscripten/bgfx_emscripten_utils.hpp"
+#endif // BX_PLATFORM_EMSCRIPTEN
+
 struct PosColorVertex
 {
     float x;
@@ -37,6 +43,76 @@ static bgfx::ShaderHandle createShader(
     return handle;
 }
 
+static bool quit = false;
+
+void main_loop()
+{
+    SDL_Event currentEvent;
+    while (SDL_PollEvent(&currentEvent) != 0) {
+        ImGui_ImplSDL2_ProcessEvent(&currentEvent);
+        if (currentEvent.type == SDL_QUIT) {
+            quit = true;
+            break;
+        }
+    }
+
+    ImGui_Implbgfx_NewFrame();
+    ImGui_ImplSDL2_NewFrame(window);
+
+    ImGui::NewFrame();
+    ImGui::ShowDemoWindow(); // your drawing here
+    ImGui::Render();
+    ImGui_Implbgfx_RenderDrawLists(ImGui::GetDrawData());
+
+    // simple input code for orbit camera
+    int mouse_x, mouse_y;
+    const int buttons = SDL_GetGlobalMouseState(&mouse_x, &mouse_y);
+    if ((buttons & SDL_BUTTON(SDL_BUTTON_LEFT)) != 0) {
+        int delta_x = mouse_x - prev_mouse_x;
+        int delta_y = mouse_y - prev_mouse_y;
+        cam_yaw += float(-delta_x) * rot_scale;
+        cam_pitch += float(-delta_y) * rot_scale;
+    }
+
+    prev_mouse_x = mouse_x;
+    prev_mouse_y = mouse_y;
+
+    float cam_rotation[16];
+    bx::mtxRotateXYZ(cam_rotation, cam_pitch, cam_yaw, 0.0f);
+
+    float cam_translation[16];
+    bx::mtxTranslate(cam_translation, 0.0f, 0.0f, -5.0f);
+
+    float cam_transform[16];
+    bx::mtxMul(cam_transform, cam_translation, cam_rotation);
+
+    float view[16];
+    bx::mtxInverse(view, cam_transform);
+
+    float proj[16];
+    bx::mtxProj(
+        proj, 60.0f, float(width) / float(height), 0.1f, 100.0f,
+        bgfx::getCaps()->homogeneousDepth);
+
+    bgfx::setViewTransform(0, view, proj);
+
+    float model[16];
+    bx::mtxIdentity(model);
+    bgfx::setTransform(model);
+
+    bgfx::setVertexBuffer(0, vbh);
+    bgfx::setIndexBuffer(ibh);
+
+    bgfx::submit(0, program);
+
+    bgfx::frame();
+
+#if BX_PLATFORM_EMSCRIPTEN
+    if (quit)
+        emscripten_cancel_main_loop();
+#endif
+}
+
 int main(int argc, char** argv)
 {
     if (SDL_Init(SDL_INIT_VIDEO) < 0) {
@@ -55,6 +131,9 @@ int main(int argc, char** argv)
         return 1;
     }
 
+    bgfx::PlatformData pd{};
+
+#if !BX_PLATFORM_EMSCRIPTEN
     SDL_SysWMinfo wmi;
     SDL_VERSION(&wmi.version);
     if (!SDL_GetWindowWMInfo(window, &wmi)) {
@@ -64,9 +143,6 @@ int main(int argc, char** argv)
         return 1;
     }
 
-    bgfx::renderFrame(); // single threaded mode
-
-    bgfx::PlatformData pd{};
 #if BX_PLATFORM_WINDOWS
     pd.nwh = wmi.info.win.window;
 #elif BX_PLATFORM_OSX
@@ -75,6 +151,11 @@ int main(int argc, char** argv)
     pd.ndt = wmi.info.x11.display;
     pd.nwh = (void*)(uintptr_t)wmi.info.x11.window;
 #endif // BX_PLATFORM_WINDOWS ? BX_PLATFORM_OSX ? BX_PLATFORM_LINUX
+#else
+    pd.nwh = (void*)"#canvas";
+#endif // BX_PLATFORM_EMSCRIPTEN
+
+    bgfx::renderFrame(); // single threaded mode
 
     bgfx::Init bgfx_init;
     bgfx_init.type = bgfx::RendererType::Count; // auto choose renderer
@@ -96,9 +177,9 @@ int main(int argc, char** argv)
     ImGui_ImplSDL2_InitForD3D(window);
 #elif BX_PLATFORM_OSX
     ImGui_ImplSDL2_InitForMetal(window);
-#elif BX_PLATFORM_LINUX
+#elif BX_PLATFORM_LINUX || BX_PLATFORM_EMSCRIPTEN
     ImGui_ImplSDL2_InitForOpenGL(window, nullptr);
-#endif // BX_PLATFORM_WINDOWS ? BX_PLATFORM_OSX ? BX_PLATFORM_LINUX
+#endif // BX_PLATFORM_WINDOWS ? BX_PLATFORM_OSX ? BX_PLATFORM_LINUX ? BX_PLATFORM_EMSCRIPTEN
 
     bgfx::VertexLayout pos_col_vert_layout;
     pos_col_vert_layout.begin()
@@ -112,14 +193,24 @@ int main(int argc, char** argv)
         bgfx::makeRef(cube_tri_list, sizeof(cube_tri_list)));
 
     std::string vshader;
+    std::string fshader;
+#if BX_PLATFORM_EMSCRIPTEN
+    if (!emscriptenutils::fetch_file("shader/v_simple.bin", vshader)) {
+        return 1;
+    }
+
+    if (!emscriptenutils::fetch_file("shader/f_simple.bin", fshader)) {
+        return 1;
+    }
+#else
     if (!fileops::read_file("shader/v_simple.bin", vshader)) {
         return 1;
     }
 
-    std::string fshader;
     if (!fileops::read_file("shader/f_simple.bin", fshader)) {
         return 1;
     }
+#endif // BX_PLATFORM_EMSCRIPTEN
 
     bgfx::ShaderHandle vsh = createShader(vshader, "vshader");
     bgfx::ShaderHandle fsh = createShader(fshader, "fshader");
@@ -133,67 +224,13 @@ int main(int argc, char** argv)
     int prev_mouse_x = 0;
     int prev_mouse_y = 0;
 
-    for (bool quit = false; !quit;) {
-        SDL_Event currentEvent;
-        while (SDL_PollEvent(&currentEvent) != 0) {
-            ImGui_ImplSDL2_ProcessEvent(&currentEvent);
-            if (currentEvent.type == SDL_QUIT) {
-                quit = true;
-                break;
-            }
-        }
-
-        ImGui_Implbgfx_NewFrame();
-        ImGui_ImplSDL2_NewFrame(window);
-
-        ImGui::NewFrame();
-        ImGui::ShowDemoWindow(); // your drawing here
-        ImGui::Render();
-        ImGui_Implbgfx_RenderDrawLists(ImGui::GetDrawData());
-
-        // simple input code for orbit camera
-        int mouse_x, mouse_y;
-        const int buttons = SDL_GetGlobalMouseState(&mouse_x, &mouse_y);
-        if ((buttons & SDL_BUTTON(SDL_BUTTON_LEFT)) != 0) {
-            int delta_x = mouse_x - prev_mouse_x;
-            int delta_y = mouse_y - prev_mouse_y;
-            cam_yaw += float(-delta_x) * rot_scale;
-            cam_pitch += float(-delta_y) * rot_scale;
-        }
-
-        prev_mouse_x = mouse_x;
-        prev_mouse_y = mouse_y;
-
-        float cam_rotation[16];
-        bx::mtxRotateXYZ(cam_rotation, cam_pitch, cam_yaw, 0.0f);
-
-        float cam_translation[16];
-        bx::mtxTranslate(cam_translation, 0.0f, 0.0f, -5.0f);
-
-        float cam_transform[16];
-        bx::mtxMul(cam_transform, cam_translation, cam_rotation);
-
-        float view[16];
-        bx::mtxInverse(view, cam_transform);
-
-        float proj[16];
-        bx::mtxProj(
-            proj, 60.0f, float(width) / float(height), 0.1f, 100.0f,
-            bgfx::getCaps()->homogeneousDepth);
-
-        bgfx::setViewTransform(0, view, proj);
-
-        float model[16];
-        bx::mtxIdentity(model);
-        bgfx::setTransform(model);
-
-        bgfx::setVertexBuffer(0, vbh);
-        bgfx::setIndexBuffer(ibh);
-
-        bgfx::submit(0, program);
-
-        bgfx::frame();
+#if BX_PLATFORM_EMSCRIPTEN
+    emscripten_set_main_loop(main_loop, -1, 1);
+#else
+    while (!quit) {
+        main_loop();
     }
+#endif // BX_PLATFORM_EMSCRIPTEN
 
     bgfx::destroy(vbh);
     bgfx::destroy(ibh);

third-party/CMakeLists.txt

@@ -13,12 +13,19 @@ if (NOT isMultiConfig)
     set(build_type_arg -DCMAKE_BUILD_TYPE=$<CONFIG>)
 endif()
 
+if (${CMAKE_SYSTEM_NAME} STREQUAL "Emscripten")
+    set(THIRD_PARTY_CMAKE_COMMAND emcmake cmake)
+else()
+    set(THIRD_PARTY_CMAKE_COMMAND ${CMAKE_COMMAND})
+endif()
+
 ExternalProject_Add(
     SDL2
     URL https://www.libsdl.org/release/SDL2-2.0.14.tar.gz
     URL_HASH MD5=76ed4e6da9c07bd168b2acd9bfefab1b
     BINARY_DIR ${CMAKE_CURRENT_BINARY_DIR}/SDL2/build/${build_type_dir}
     INSTALL_DIR ${CMAKE_CURRENT_BINARY_DIR}
+    CMAKE_COMMAND ${THIRD_PARTY_CMAKE_COMMAND}
     CMAKE_ARGS ${build_type_arg}
                -D CMAKE_INSTALL_PREFIX=<INSTALL_DIR>)
 
@@ -28,6 +35,7 @@ ExternalProject_Add(
     GIT_TAG        86b4b5a610e8bde42eb259cddc75046bc865929b
     BINARY_DIR ${CMAKE_CURRENT_BINARY_DIR}/bgfx/build/${build_type_dir}
     INSTALL_DIR ${CMAKE_CURRENT_BINARY_DIR}
+    CMAKE_COMMAND ${THIRD_PARTY_CMAKE_COMMAND}
     CMAKE_ARGS ${build_type_arg}
                -D CMAKE_INSTALL_PREFIX=<INSTALL_DIR>
                "$<$<CONFIG:Debug>:-DCMAKE_DEBUG_POSTFIX=d>"
@@ -41,6 +49,7 @@ ExternalProject_Add(
     SOURCE_SUBDIR ../imgui
     BINARY_DIR ${CMAKE_CURRENT_BINARY_DIR}/imgui/build/${build_type_dir}
     INSTALL_DIR ${CMAKE_CURRENT_BINARY_DIR}
+    CMAKE_COMMAND ${THIRD_PARTY_CMAKE_COMMAND}
     CMAKE_ARGS ${build_type_arg}
                -D CMAKE_INSTALL_PREFIX=<INSTALL_DIR>
                -D IMGUI_DISABLE_OBSOLETE_FUNCTIONS=ON)