Use SDL2 for wasm

haxenme · Sep 19, 2024 · 170ee5a · 170ee5a
1 parent eef58ef
commit 170ee5a
Show file tree

Hide file tree

Showing 3 changed files with 99 additions and 9 deletions.
diff --git a/project/ToolkitBuild.xml b/project/ToolkitBuild.xml
@@ -79,8 +79,9 @@
    <set name="NME_SDL2" value="1" if="linux" unless="NME_NATIVE_SDL_SYSTEM" />
    <set name="NME_SDL2" value="1" if="macos" />
    <set name="NME_SDL2" value="1" if="winrpi" />
+   <set name="NME_SDL2" value="1" if="emscripten" />
    <set name="NME_SDL2" value="1" if="gcw0" />
-   <set name="NME_SDL3" value="1" if="NME_LOCAL_TOOLKIT" />
+   <set name="NME_SDL3" value="1" if="NME_LOCAL_TOOLKIT" unless="emscripten" />
    <set name="SYSTEM_FREETYPE" value="1" if="gcw0" />
 
    <set name="NME_SDL_ANY" value="1" if="NME_NATIVE_SDL_SYSTEM" />
@@ -184,6 +185,7 @@
       <include name="${NME_LIBSDL}files.xml" />
       <set name="NME_MODPLUG" value="${NATIVE_TOOLKIT_PATH}/modplug/" />
       <include name="${NME_MODPLUG}/files.xml" if="modplug" />
+
       <set name="NME_LIBSDL_MIXER" value="${NATIVE_TOOLKIT_PATH}/sdl-mixer/" />
       <include name="${NME_LIBSDL_MIXER}files.xml" if="NME_MIXER" />
 
@@ -349,7 +351,7 @@
       </section>
 
       <section if="emscripten">
-         <compilerflag value="-sUSE_SDL=1"/>
+         <compilerflag value="-sUSE_SDL=2"/>
          <file name="${SRC_DIR}/emscripten/System.cpp" />
          <file name="${SRC_DIR}/emscripten/CurlFetch.cpp" />
          <file name="${SRC_DIR}/emscripten/JsPrime.cpp" if="HXCPP_JS_PRIME" />
@@ -626,10 +628,14 @@
             </section>
             <section if="NME_SDL2" >
                <lib name="-lSDL2" />
-               <lib name="-lSDL2_Mixer" />
+               <lib name="-lSDL2_Mixer" unless="NME_NO_AUDIO||emscripten" />
                <lib name="-lEGL" />
                <lib name="-lGLESv2" />
                <lib name="-lfreetype" if="SYSTEM_FREETYPE" />
+
+               <section if="emscripten" >
+                   <lib name="-sUSE_SDL_MIXER=2" />
+               </section>
             </section>
          </section>
             <!--<lib name="-lcurl" />

diff --git a/project/src/sdl2/SDL2Stage.cpp b/project/src/sdl2/SDL2Stage.cpp
@@ -9,6 +9,10 @@
 #include <nme/NmeCffi.h>
 #include <KeyCodes.h>
 #include <map>
+#ifdef EMSCRIPTEN
+#include <emscripten.h>
+#include <emscripten/html5.h>
+#endif
 
 #include <Sound.h>
 
@@ -75,7 +79,7 @@ enum { NO_TOUCH = -1 };
 
 
 int InitSDL()
-{   
+{
    if (sgInitCalled)
       return 0;
 
@@ -102,6 +106,9 @@ int InitSDL()
    SDL_SetHint(SDL_HINT_VIDEO_FORCE_EGL, forceEgl ? "1" : "0");
    #endif
 
+   #if EMSCRIPTEN
+   SDL_SetHint(SDL_HINT_EMSCRIPTEN_KEYBOARD_ELEMENT, "#canvas");
+   #endif
 
    int err = SDL_Init(SDL_INIT_VIDEO | audioFlag | SDL_INIT_TIMER);
 
@@ -1116,7 +1123,6 @@ extern "C" void MacBoot( /*void (*)()*/ );
 
 
 
-#ifndef EMSCRIPTEN
 
 #define MAX_JOYSTICKS 16
 #define etControllerAxisMove etJoyAxisMove
@@ -1396,7 +1402,6 @@ typedef struct controllerState
       }
    }
 } ControllerState;
-#endif
 
 
 void AddModStates(int &ioFlags,int inState = -1)
@@ -1845,6 +1850,7 @@ void ProcessEvent(SDL_Event &inEvent)
          {
             Event event(etWindowLeave);
             frame->ProcessEvent(event);
+            break;
          }
          case SDL_WINDOWEVENT_FOCUS_GAINED:
          {
@@ -2080,7 +2086,7 @@ void ProcessEvent(SDL_Event &inEvent)
          frame->ProcessEvent(key);
          break;
       }
-      #ifndef EMSCRIPTEN
+
       case SDL_CONTROLLERAXISMOTION:
       {   
          ControllerState* controller = sgJoysticksState[inEvent.jbutton.which];
@@ -2170,7 +2176,6 @@ void ProcessEvent(SDL_Event &inEvent)
          }
          break;
       }
-      #endif
       case SDL_AUDIODEVICEADDED:
          // TODO
          break;
@@ -2669,7 +2674,20 @@ void CreateMainFrame(FrameCreationCallback inOnFrame, int inWidth, int inHeight,
    //SDL_GameControllerEventState(SDL_TRUE);
 
    if (isMain)
+   {
+      #if EMSCRIPTEN
+      //emscripten_set_resize_callback("canvas", nullptr, false, onCanvasSize);
+      EM_ASM({
+      window.onresize = function() {
+         Module['ccall']('nmeOnCanvasSize', 'number',[],[]);
+      }
+      });
+
+      emscripten_set_main_loop(StartAnimation, 0, false);
+      #else
       StartAnimation();
+      #endif
+   }
 }
 
 
@@ -2925,6 +2943,71 @@ static SDL_TimerID sgTimerID = 0;
 #define SDL_NOEVENT -1;
 #endif
 
+#ifdef EMSCRIPTEN
+extern void clUpdateAsyncChannels();
+extern void nme_native_resource_release_temps();
+
+static bool sCheckCanvasSize = true;
+static double sgDeviceDpi = 1.0;
+static int sgCanvasWidth = 0;
+static int sgCanvasHeight = 0;
+
+extern "C"
+{
+EMSCRIPTEN_KEEPALIVE int nmeOnCanvasSize()
+{
+   sCheckCanvasSize = true;
+   return 1;
+}
+}
+
+void StartAnimation()
+{
+   SDL_Event event;
+   while(SDL_PollEvent(&event))
+   {
+      ProcessEvent(event);
+      // if (sgDead) break;
+      event.type = -1;
+      #ifdef HXCPP_JS_PRIME
+      nme_native_resource_release_temps();
+      #endif
+   }
+
+   clUpdateAsyncChannels();
+
+   if (sCheckCanvasSize)
+   {
+      sCheckCanvasSize = false;
+      double w=0;
+      double h=0;
+      emscripten_get_element_css_size("canvas", &w, &h);
+      int cw = w*sgDeviceDpi;
+      int ch = h*sgDeviceDpi;
+      if (sgCanvasWidth!=cw || sgCanvasHeight!=ch)
+      {
+         sgCanvasWidth=cw;
+         sgCanvasHeight=ch;
+
+         Event resize(etResize,cw,ch);
+         sgSDLFrame->Resize(cw,ch);
+         sgSDLFrame->ProcessEvent(resize);
+         #ifdef HXCPP_JS_PRIME
+         nme_native_resource_release_temps();
+         #endif
+      }
+   }
+
+   Event poll(etPoll);
+   sgSDLFrame->ProcessEvent(poll);
+   #ifdef HXCPP_JS_PRIME
+   nme_native_resource_release_temps();
+   #endif
+   //emscripten_set_main_loop_timing(EM_TIMING_SETTIMEOUT, nextWake);
+}
+
+#else
+
 
 void StartAnimation()
 {
@@ -3019,6 +3102,7 @@ void StartAnimation()
    sgSDLFrame->ProcessEvent(kill);
    SDL_Quit();
 }
+#endif
 
 bool SetClipboardText(const char* text)
 {

diff --git a/templates/jsprime/index.html b/templates/jsprime/index.html
@@ -41,7 +41,7 @@
    ::NME_JS_BODY::
    ::else::
    <div class="emscripten_border" id="stage" style="position:absolute;width:100%;height:100%;" >
-      <canvas class="emscripten" id="canvas" oncontextmenu="event.preventDefault()"></canvas>
+      <canvas class="emscripten" id="canvas" oncontextmenu="event.preventDefault()" tabIndex="-1" ></canvas>
    </div>
    ::end::