From 05a49f0413232d2483e902089d2e9e99b40ce3b2 Mon Sep 17 00:00:00 2001 From: omar Date: Thu, 30 Jan 2020 17:15:11 +0100 Subject: [PATCH] Examples: Emscripten: Demonstrating embedding fonts in Makefile and code. (#2953) [@Oipo] --- docs/CHANGELOG.txt | 5 ++-- examples/example_emscripten/Makefile | 39 +++++++++++++++++++++------- examples/example_emscripten/main.cpp | 13 ++++++---- 3 files changed, 41 insertions(+), 16 deletions(-) diff --git a/docs/CHANGELOG.txt b/docs/CHANGELOG.txt index 6f73c077..9ee78e80 100644 --- a/docs/CHANGELOG.txt +++ b/docs/CHANGELOG.txt @@ -100,12 +100,13 @@ Other Changes: on Windows 7. You can instead try linking with Xinput9_1_0.lib instead. (#2716) - Backends: Glut: Improved FreeGLUT support for MinGW. (#3004) [@podsvirov] - Backends: Emscripten: Avoid forcefully setting IMGUI_DISABLE_FILE_FUNCTIONS. (#3005) [@podsvirov] -- Examples: Explicitly adding -DIMGUI_IMPL_OPENGL_LOADER_GL3W to Makefile to match linking +- Examples: OpenGL: Explicitly adding -DIMGUI_IMPL_OPENGL_LOADER_GL3W to Makefile to match linking settings (otherwise if another loader such as Glew is accessible, the OpenGL3 backend might automatically use it). (#2919, #2798) +- Examples: OpenGL: Added support for glbindings OpenGL loader. (#2870) [@rokups] +- Examples: Emscripten: Demonstrating embedding fonts in Makefile and code. (#2953) [@Oipo] - Examples: Metal: Wrapped main loop in @autoreleasepool block to ensure allocations get freed even if underlying system event loop gets paused due to app nap. (#2910, #2917) [@bear24rw] -- Examples: Added support for glbindings OpenGL loader. (#2870) [@rokups] ----------------------------------------------------------------------- diff --git a/examples/example_emscripten/Makefile b/examples/example_emscripten/Makefile index f5b7369a..9833270e 100644 --- a/examples/example_emscripten/Makefile +++ b/examples/example_emscripten/Makefile @@ -1,8 +1,10 @@ # # Makefile to use with emscripten # See https://emscripten.org/docs/getting_started/downloads.html -# for installation instructions. This Makefile assumes you have -# loaded emscripten's environment. +# for installation instructions. +# +# This Makefile assumes you have loaded emscripten's environment. +# (On Windows, you may need to execute emsdk_env.bat or encmdprompt.bat ahead) # # Running `make` will produce three files: # - example_emscripten.html @@ -13,7 +15,6 @@ CC = emcc CXX = em++ - EXE = example_emscripten.html SOURCES = main.cpp SOURCES += ../imgui_impl_sdl.cpp ../imgui_impl_opengl3.cpp @@ -21,21 +22,41 @@ SOURCES += ../../imgui.cpp ../../imgui_demo.cpp ../../imgui_draw.cpp ../../imgui OBJS = $(addsuffix .o, $(basename $(notdir $(SOURCES)))) UNAME_S := $(shell uname -s) -EMS = -s USE_SDL=2 -s WASM=1 +##--------------------------------------------------------------------- +## EMSCRIPTEN OPTIONS +##--------------------------------------------------------------------- + +EMS += -s USE_SDL=2 -s WASM=1 EMS += -s ALLOW_MEMORY_GROWTH=1 EMS += -s DISABLE_EXCEPTION_CATCHING=1 -s NO_EXIT_RUNTIME=0 EMS += -s ASSERTIONS=1 -EMS += -s NO_FILESYSTEM=1 -DIMGUI_DISABLE_FILE_FUNCTIONS -# Uncomment next line to fix possible rendering bugs with emscripten version older then 1.39.0 (https://github.com/ocornut/imgui/issues/2877) + +# Uncomment next line to fix possible rendering bugs with Emscripten version older then 1.39.0 (https://github.com/ocornut/imgui/issues/2877) #EMS += -s BINARYEN_TRAP_MODE=clamp #EMS += -s SAFE_HEAP=1 ## Adds overhead -CPPFLAGS = -I../ -I../../ +# Emscripten allows preloading a file or folder to be accessible at runtime. +# The Makefile for this example project suggests embedding the misc/fonts/ folder into our application, it will then be accessible as "/fonts" +# See documentation for more details: https://emscripten.org/docs/porting/files/packaging_files.html +# (Default value is 0. Set to 1 to enable file-system and include the misc/fonts/ folder as part of the build.) +USE_FILE_SYSTEM ?= 0 +ifeq ($(USE_FILE_SYSTEM), 0) +EMS += -s NO_FILESYSTEM=1 -DIMGUI_DISABLE_FILE_FUNCTIONS +endif +ifeq ($(USE_FILE_SYSTEM), 1) +LDFLAGS += --no-heap-copy --preload-file ../../misc/fonts@/fonts +endif + +##--------------------------------------------------------------------- +## FINAL BUILD FLAGS +##--------------------------------------------------------------------- + +CPPFLAGS += -I../ -I../../ #CPPFLAGS += -g CPPFLAGS += -Wall -Wformat -Os CPPFLAGS += $(EMS) -LIBS = $(EMS) -LDFLAGS = --shell-file shell_minimal.html +LIBS += $(EMS) +LDFLAGS += --shell-file shell_minimal.html ##--------------------------------------------------------------------- ## BUILD RULES diff --git a/examples/example_emscripten/main.cpp b/examples/example_emscripten/main.cpp index d9a6406d..f0eb3a2b 100644 --- a/examples/example_emscripten/main.cpp +++ b/examples/example_emscripten/main.cpp @@ -83,13 +83,16 @@ int main(int, char**) // - The fonts will be rasterized at a given size (w/ oversampling) and stored into a texture when calling ImFontAtlas::Build()/GetTexDataAsXXXX(), which ImGui_ImplXXXX_NewFrame below will call. // - Read 'docs/FONTS.txt' for more instructions and details. // - Remember that in C/C++ if you want to include a backslash \ in a string literal you need to write a double backslash \\ ! + // - Emscripten allows preloading a file or folder to be accessible at runtime. See Makefile for details. //io.Fonts->AddFontDefault(); - //io.Fonts->AddFontFromFileTTF("../../misc/fonts/Roboto-Medium.ttf", 16.0f); - //io.Fonts->AddFontFromFileTTF("../../misc/fonts/Cousine-Regular.ttf", 15.0f); - //io.Fonts->AddFontFromFileTTF("../../misc/fonts/DroidSans.ttf", 16.0f); - //io.Fonts->AddFontFromFileTTF("../../misc/fonts/ProggyTiny.ttf", 10.0f); - //ImFont* font = io.Fonts->AddFontFromFileTTF("c:\\Windows\\Fonts\\ArialUni.ttf", 18.0f, NULL, io.Fonts->GetGlyphRangesJapanese()); +#ifndef IMGUI_DISABLE_FILE_FUNCTIONS + io.Fonts->AddFontFromFileTTF("fonts/Roboto-Medium.ttf", 16.0f); + //io.Fonts->AddFontFromFileTTF("fonts/Cousine-Regular.ttf", 15.0f); + //io.Fonts->AddFontFromFileTTF("fonts/DroidSans.ttf", 16.0f); + //io.Fonts->AddFontFromFileTTF("fonts/ProggyTiny.ttf", 10.0f); + //ImFont* font = io.Fonts->AddFontFromFileTTF("fonts/ArialUni.ttf", 18.0f, NULL, io.Fonts->GetGlyphRangesJapanese()); //IM_ASSERT(font != NULL); +#endif // This function call won't return, and will engage in an infinite loop, processing events from the browser, and dispatching them. emscripten_set_main_loop_arg(main_loop, NULL, 0, true);