Add webgl aka wasm build support

.appveyor.yml

@@ -0,0 +1,15 @@
+image: 
+  - Visual Studio 2019
+
+version: 1.1.0.{build}
+
+install:
+  - git submodule update --init --recursive
+
+build_script:
+  - pwsh: .\build.ps1 -p wasm -xb '--target','cpp_tests'
+  - pwsh: 7z a build_wasm.zip build_wasm/bin/**/*
+
+artifacts:
+  - path: build_wasm.zip
+    name: build_wasm

.github/workflows/pr.yml

@@ -105,4 +105,4 @@ jobs:
 
       - name: Build
         shell: pwsh
-        run: ./build.ps1 -p tvos -a x64
+        run: ./build.ps1 -p tvos -a x64

1k/build1k.ps1

@@ -28,7 +28,7 @@
 # 
 # The build1k.ps1, will be core script of project https://github.com/axmolengine/build1k
 # options
-#  -p: build target platform: win32,winuwp,linux,android,osx,ios,tvos,watchos
+#  -p: build target platform: win32,winuwp,linux,android,osx,ios,tvos,watchos,wasm
 #      for android: will search ndk in sdk_root which is specified by env:ANDROID_HOME first, 
 #      if not found, by default will install ndk-r16b or can be specified by option: -cc 'ndk-r23c'
 #  -a: build arch: x86,x64,armv7,arm64
@@ -204,6 +204,11 @@ foreach ($arg in $args) {
     }
 }
 
+$is_wasm = $options.p -eq 'wasm'
+if ($is_wasm) {
+    $options.a = 'any' # forcing arch to 'any', only for identifying
+}
+
 $manifest_file = Join-Path $myRoot 'manifest.ps1'
 if ($b1k.isfile($manifest_file)) {
     . $manifest_file
@@ -246,6 +251,7 @@ $toolchains = @{
     'ios'     = 'xcode';
     'tvos'    = 'xcode';
     'watchos' = 'xcode';
+    'wasm'    = 'emcc'; # wasm llvm-emcc
 }
 if (!$TOOLCHAIN) {
     $TOOLCHAIN = $toolchains[$BUILD_TARGET]
@@ -764,6 +770,31 @@ function setup_android_sdk() {
     return $sdk_root, $ndk_root
 }
 
+# enable emsdk emcmake
+function setup_emsdk() {
+    $emsdk_cmd = (Get-Command emsdk -ErrorAction SilentlyContinue)
+    if (!$emsdk_cmd) {
+        $emsdk_root = Join-Path $prefix 'emsdk'
+        if (!(Test-Path $emsdk_root -PathType Container)) {
+            git clone 'https://github.com/emscripten-core/emsdk.git' $emsdk_root
+        }
+        else {
+            git -C $emsdk_root pull
+        }
+    } else {
+        $emsdk_root = Split-Path $emsdk_cmd.Source -Parent
+    }
+
+    $emcmake = (Get-Command emcmake -ErrorAction SilentlyContinue)
+    if (!$emcmake) {
+        Set-Location $emsdk_root
+        ./emsdk install latest
+        ./emsdk activate latest
+        . ./emsdk_env.ps1
+        Set-Location -
+    }
+}
+
 # preprocess methods: 
 #   <param>-inputOptions</param> [CMAKE_OPTIONS]
 function preprocess_win([string[]]$inputOptions) {
@@ -902,6 +933,10 @@ function preprocess_ios([string[]]$inputOptions) {
     return $outputOptions
 }
 
+function preprocess_wasm([string[]]$inputOptions) {
+    return $inputOptions
+}
+
 function validHostAndToolchain() {
     $appleTable = @{
         'host'      = @{'macos' = $True };
@@ -928,6 +963,10 @@ function validHostAndToolchain() {
         'ios'     = $appleTable;
         'tvos'    = $appleTable;
         'watchos' = $appleTable;
+        'wasm' = @{
+            'host'      = @{'windows' = $True; 'linux' = $True; 'macos' = $True };
+            'toolchain' = @{'emcc' = $True; };
+        };
     }
     $validInfo = $validTable[$BUILD_TARGET]
     $validOS = $validInfo.host[$HOST_OS_NAME]
@@ -949,6 +988,7 @@ $proprocessTable = @{
     'ios'     = ${function:preprocess_ios};
     'tvos'    = ${function:preprocess_ios};
     'watchos' = ${function:preprocess_ios};
+    'wasm'    = ${Function:preprocess_wasm};
 }
 
 validHostAndToolchain
@@ -978,6 +1018,9 @@ elseif ($BUILD_TARGET -eq 'android') {
         $ninja_prog = setup_ninja
     }  
 }
+elseif($BUILD_TARGET -eq 'wasm') {
+    . setup_emsdk
+}
 
 if (!$setupOnly) {
     $stored_cwd = $(Get-Location).Path
@@ -1006,7 +1049,10 @@ if (!$setupOnly) {
         if ($is_host_target) { # wheither building host target?
             $BUILD_DIR = "build_$($options.a)"
         } else {
-            $BUILD_DIR = "build_${BUILD_TARGET}_$($options.a)"
+            $BUILD_DIR = "build_${BUILD_TARGET}"
+            if (!$is_wasm) {
+                $BUILD_DIR += "_$($options.a)"
+            }
         }
     }
     else {
@@ -1070,7 +1116,11 @@ if (!$setupOnly) {
         $mainDepChanged = "$storeTime" -ne "$lastWriteTime"
         $cmakeCachePath = Join-Path $workDir "$BUILD_DIR/CMakeCache.txt"
         if ($mainDepChanged -or !$b1k.isfile($cmakeCachePath)) {
-            cmake -B $BUILD_DIR $CONFIG_ALL_OPTIONS | Out-Host
+            if (!$is_wasm) {
+                cmake -B $BUILD_DIR $CONFIG_ALL_OPTIONS | Out-Host
+            } else {
+                emcmake cmake -B $BUILD_DIR $CONFIG_ALL_OPTIONS | Out-Host
+            }
             Set-Content $tempFile $lastWriteTime -NoNewline
         }
 

README_webgl.md

@@ -0,0 +1,17 @@
+# Axmol WASM
+
+Building axmol for target platform: webgl aka wasm.
+
+After setup, just run follow command:
+
+axmol build -p wasm
+
+## TODO
+
+```cpp
+#ifndef EMSCRIPTEN
+        const FT_Int spread = DistanceMapSpread;
+        FT_Property_Set(_FTlibrary, "sdf", "spread", &spread);
+        FT_Property_Set(_FTlibrary, "bsdf", "spread", &spread);
+#endif
+```

build.ps1

@@ -2,7 +2,7 @@
 # This script easy to build win32, linux, winuwp, ios, tvos, osx, android depends on $myRoot/1k/build1k.ps1
 # usage: pwsh build.ps1 -p <targetPlatform> -a <arch>
 # options
-#  -p: build target platform: win32,winuwp,linux,android,osx,ios,tvos,watchos
+#  -p: build target platform: win32,winuwp,linux,android,osx,ios,tvos,watchos,wasm
 #      for android: will search ndk in sdk_root which is specified by env:ANDROID_HOME first, 
 #      if not found, by default will install ndk-r16b or can be specified by option: -cc 'ndk-r23c'
 #  -a: build arch: x86,x64,armv7,arm64; for android can be list by ';', i.e: 'arm64;x64'

cmake/Modules/AXBuildHelpers.cmake

@@ -7,6 +7,10 @@ if(NOT PWSH_COMMAND)
     message(FATAL_ERROR "Please install it https://learn.microsoft.com/en-us/powershell/scripting/install/installing-powershell, and run CMake again.")
 endif()
 
+if(NOT DEFINED WASM)
+    set(WASM FALSE CACHE BOOL "")
+endif()
+
 # copy resource `FILES` and `FOLDERS` to TARGET_FILE_DIR/Resources
 function(ax_sync_target_res ax_target)
     set(options SYM_LINK)
@@ -33,7 +37,7 @@ function(ax_sync_target_res ax_target)
         get_filename_component(link_folder_abs ${opt_LINK_TO} ABSOLUTE)
         add_custom_command(TARGET ${sync_target_name} POST_BUILD
             COMMAND ${PWSH_COMMAND} ARGS ${_AX_ROOT}/cmake/sync_folder.ps1
-                -s ${cc_folder} -d ${link_folder_abs} -l ${opt_SYM_LINK}
+                -s ${cc_folder} -d ${link_folder_abs} -l ${opt_SYM_LINK} -wasm "${WASM}"
         )
     endforeach()
 endfunction()
@@ -72,18 +76,18 @@ function(ax_sync_lua_scripts ax_target src_dir dst_dir)
     if(MSVC)
         add_custom_command(TARGET ${luacompile_target} POST_BUILD
             COMMAND ${PWSH_COMMAND} ARGS ${_AX_ROOT}/cmake/sync_folder.ps1
-                -s ${src_dir} -d ${dst_dir}
+                -s ${src_dir} -d ${dst_dir} -wasm "${WASM}"
         )
     else()
         if("${CMAKE_BUILD_TYPE}" STREQUAL "")
             add_custom_command(TARGET ${luacompile_target} POST_BUILD
                 COMMAND ${PWSH_COMMAND} ARGS ${_AX_ROOT}/cmake/sync_folder.ps1
-                -s ${src_dir} -d ${dst_dir}
+                -s ${src_dir} -d ${dst_dir} -wasm "${WASM}"
             )
         else()
             add_custom_command(TARGET ${luacompile_target} POST_BUILD
                 COMMAND ${PWSH_COMMAND} ARGS ${_AX_ROOT}/cmake/sync_folder.ps1
-                    -s ${src_dir} -d ${dst_dir}
+                    -s ${src_dir} -d ${dst_dir} -wasm "${WASM}"
             )
         endif()
     endif()

cmake/Modules/AXConfigDefine.cmake

@@ -147,6 +147,8 @@ function(use_ax_compile_define target)
         target_compile_definitions(${target} PUBLIC _GNU_SOURCE)
     elseif(ANDROID)
         target_compile_definitions(${target} PUBLIC USE_FILE32API)
+    elseif(EMSCRIPTEN)
+        ax_config_pred(${target} AX_USE_ANGLE)
     elseif(WINDOWS)
         ax_config_pred(${target} AX_USE_ANGLE)
         ax_config_pred(${target} AX_ENABLE_VLC_MEDIA)
@@ -187,6 +189,11 @@ endfunction()
 # 	endif()
 # endif()
 
+if(EMSCRIPTEN)
+    set(CMAKE_C_FLAGS  "-s USE_LIBJPEG=1 -s USE_LIBPNG=1 -s USE_ZLIB=1 -s USE_FREETYPE=1")
+    set(CMAKE_CXX_FLAGS  "-s USE_LIBJPEG=1 -s USE_LIBPNG=1 -s USE_ZLIB=1 -s USE_FREETYPE=1")
+endif()
+
 # Try enable asm & nasm compiler support
 set(can_use_assembler TRUE)
 enable_language(ASM)

cmake/Modules/AXPlatform.cmake

@@ -38,6 +38,10 @@ elseif(${CMAKE_SYSTEM_NAME} MATCHES "Linux")
         set(LINUX TRUE)
         set(PLATFORM_FOLDER linux)
     endif()
+elseif(${CMAKE_SYSTEM_NAME} MATCHES "Emscripten")
+     set(EMSCRIPTEN TRUE)
+     set(WASM TRUE)
+     set(PLATFORM_FOLDER emscripten)
 elseif(${CMAKE_SYSTEM_NAME} MATCHES "Darwin")
     set(APPLE TRUE)
     set(MACOSX TRUE)
@@ -91,6 +95,9 @@ elseif(MACOSX)
 elseif(LINUX)
     set(platform_name linux)
     set(platform_spec_path linux)
+elseif(EMSCRIPTEN)
+    set(platform_name emscripten)
+    set(platform_spec_path emscripten)
 endif()
 
 set(platform_spec_path "${_path_prefix}${platform_spec_path}")

cmake/sync_folder.ps1

@@ -5,17 +5,27 @@ param(
     [string]$destDir,
     [Parameter(Mandatory=$false, ValueFromPipeline=$true)]
     [PSDefaultValue(Value=$null)]
-    $linkOnly
+    $linkOnly,
+    $wasm = $null
 )
 
+
 function ParseBoolFuzzy($value) {
+    $value = "$value".ToLower()
     return $value.startsWith('1') -or $value.StartsWith('t') -or $value.StartsWith('y')
 }
 
+$wasm = ParseBoolFuzzy($wasm)
+
+if ($wasm) {
+    Write-Host "sync_folder.ps1: Skipping sync folder for target platform 'wasm'"
+    return 
+}
+
 # 0: windows, 1: linux, 2: macos
 $IsWin = $IsWindows -or ("$env:OS" -eq 'Windows_NT')
 
-$linkOnly = ParseBoolFuzzy("$linkOnly".ToLower())
+$linkOnly = ParseBoolFuzzy($linkOnly)
 
 # convert to native path style
 if ($IsWin) {
@@ -27,24 +37,24 @@ if ($IsWin) {
 }
 
 if(!$srcDir -or !(Test-Path $srcDir -PathType Container)) {
-    throw "The source directory $srcDir not exist"
+    throw "sync_folder.ps1: The source directory $srcDir not exist"
 }
 
 if (Test-Path $destDir -PathType Container) { # dest already exist
     if ($linkOnly) { # is symlink and dest exist
         $directoryInfo = (Get-Item $destDir)
         if ($directoryInfo.Target -eq $srcDir) {
-            Write-Host "Symlink $destDir ===> $($directoryInfo.Target) exists"
+            Write-Host "sync_folder.ps1: Symlink $destDir ===> $($directoryInfo.Target) exists"
             return
         }
-        Write-Host "Removing old link target $($directoryInfo.Target)"
+        Write-Host "sync_folder.ps1: Removing old link target $($directoryInfo.Target)"
         # Remove-Item -Path $destDir
         $directoryInfo.Delete($false)
     }
 }
 
 if ($linkOnly) {
-    Write-Host "Linking $srcDir to $destDir ..."
+    Write-Host "sync_folder.ps1: Linking $srcDir to $destDir ..."
     if ($IsWin) {
         cmd.exe /c mklink /J $destDir $srcDir
     }
@@ -54,7 +64,7 @@ if ($linkOnly) {
     }
 }
 else { # copy directory, remove first?
-    Write-Host "Copying $srcDir to $destDir ..."
+    Write-Host "sync_folder.ps1: Copying $srcDir to $destDir ..."
     if (!(Test-Path $destDir -PathType Container)) {
         Copy-Item $srcDir $destDir -Recurse -Force
     } else {

core/2d/FontFreeType.cpp

@@ -29,7 +29,9 @@ THE SOFTWARE.
 #include "2d/FontAtlas.h"
 #include "base/Director.h"
 #include "base/UTF8.h"
+#ifndef EMSCRIPTEN
 #include "freetype/ftmodapi.h"
+#endif
 #include "platform/FileUtils.h"
 #include "platform/FileStream.h"
 
@@ -124,9 +126,11 @@ bool FontFreeType::initFreeType()
         if (FT_Init_FreeType(&_FTlibrary))
             return false;
 
+#ifndef EMSCRIPTEN
         const FT_Int spread = DistanceMapSpread;
         FT_Property_Set(_FTlibrary, "sdf", "spread", &spread);
         FT_Property_Set(_FTlibrary, "bsdf", "spread", &spread);
+#endif
 
         _FTInitialized = true;
     }
@@ -413,12 +417,15 @@ unsigned char* FontFreeType::getGlyphBitmap(char32_t charCode,
 #endif
         if (FT_Load_Glyph(_fontFace, glyphIndex, FT_LOAD_RENDER | FT_LOAD_NO_AUTOHINT))
             break;
+
+#ifndef EMSCRIPTEN
         if (_distanceFieldEnabled && _fontFace->glyph->bitmap.buffer)
         {
             // Require freetype version > 2.11.0, because freetype 2.11.0 sdf has memory access bug, see:
             // https://gitlab.freedesktop.org/freetype/freetype/-/issues/1077
             FT_Render_Glyph(_fontFace->glyph, FT_Render_Mode::FT_RENDER_MODE_SDF);
         }
+#endif
 
         auto& metrics       = _fontFace->glyph->metrics;
         outRect.origin.x    = static_cast<float>(metrics.horiBearingX >> 6);

core/CMakeLists.txt

@@ -76,7 +76,7 @@ endif()
 
 message(STATUS "AX_ENABLE_VLC_MEDIA=${AX_ENABLE_VLC_MEDIA}")
 
-if(NOT APPLE)
+if(NOT APPLE AND (NOT EMSCRIPTEN))
     set(AX_USE_ALSOFT ON CACHE BOOL "" FORCE)
 else()
     option(AX_USE_ALSOFT "Use ALSOFT on apple" OFF)
@@ -105,13 +105,13 @@ option(AX_ENABLE_EXT_FAIRYGUI "Build extension FairyGUI" ON)
 option(AX_ENABLE_EXT_LIVE2D "Build extension Live2D" OFF)
 option(AX_ENABLE_EXT_EFFEKSEER "Build extension Effekseer" OFF)
 
-if((WINDOWS AND NOT WINRT) OR MACOSX OR LINUX OR ANDROID)
+if((WINDOWS AND NOT WINRT) OR MACOSX OR LINUX OR ANDROID OR EMSCRIPTEN)
   option(AX_ENABLE_EXT_IMGUI "Build extension ImGui" ON)
 else()
   set(AX_ENABLE_EXT_IMGUI OFF)
 endif()
 
-if (ANDROID)
+if (ANDROID OR EMSCRIPTEN)
     set(AX_USE_GLAD TRUE CACHE BOOL "Use glad for android GLESv3 support" FORCE)
     add_definitions(-DAX_USE_GLAD=1)
 endif()