FLTK logo

[fltk.coredev] Re: Wasm again

FLTK matrix user chat room
(using Element browser app)   FLTK gitter user chat room   GitHub FLTK Project   FLTK News RSS Feed  
  FLTK Apps      FLTK Library      Forums      Links     Login 
 All Forums  |  Back to fltk.coredev  ]
 
Previous Message ]New Message | Reply ]Next Message ]

Re: Wasm again Mo_Al_ Dec 11, 2020  
  updated patch
The previous didn't track the Fl_PicoSDL_Image_Surface_Driver.cxx
The generated .html file can be run using:
emrun fltk.html
Or through any server application.
Using cmake, you would have to pass " -s WASM=1 -s USE_SDL=2 -s USE_FREETYPE=1" as CMAKE_CXX_FLAGS and  "--shell-file shell_minimal.html" as CMAKE_EXE_LINKER_FLAGS. Then:
target_link_libraries(myapp PRIVATE fltk)
set_target_properties(myapp PROPERTIES SUFFIX .html)


On Saturday, December 12, 2020 at 2:08:35 AM UTC+3 Mo_Al_ wrote:
Hello
I was able to get the PicoSDL driver to target wasm:

The changes I had to do are attached in the patch. Some are quite intrusive, like adding the Fl_PicoSDL_Window_Driver as a friend class to Fl_Window.

Keyboards events aren't handled, it's missing the mapping between SDL and FLTK keys.

To build wasm fltk app:
- Install emscripten
- cd fltk
- git apply /path/to/wasm.patch
- emcmake cmake -Bbin -DFLTK_BUILD_TEST=OFF && cmake --build bin --parallel
- cp bin/libs/libfltk* $EMSDK/upstream/emscripten/cache/wasm/
- mkdir $EMSDK/upstream/emscripten/system/include/FL
- cp bin/FL/* $EMSDK/upstream/emscripten/system/include/FL/
- cp FL/* $EMSDK/upstream/emscripten/system/include/FL/

Now you can build with em++ or emcmake whatever.
The emscripten_set_main_loop_arg() needs to be called. The sample program is something like:
#include <FL/Fl.H>
#include <FL/Fl_Window.H>
#include <FL/Fl_Button.H>
#include <FL/Fl_Box.H>
#include <emscripten.h>

void main_loop(void *) {
    Fl::wait();
}

void cb(Fl_Widget *w, void *data) {
    ((Fl_Box*)data)->color(FL_RED);
    Fl::redraw();
}

int main() {
    auto win = new Fl_Window(600, 400);
    auto box = new Fl_Box(40, 40, 520, 220, "Hello from FLTK 1.4");
    box->box(FL_SHADOW_BOX);
    box->labelsize(16);
    auto but = new Fl_Button(260, 300, 80, 40, "Click me");
    win->end();
    win->show();
    but->callback(cb, box);
    emscripten_set_main_loop_arg(main_loop, NULL, 0, true);
}

Using em++, this can be built:
em++ -o fltk.html main.cpp -s WASM=1 -s USE_SDL=2 -s USE_FREETYPE=1 -lfltk --shell-file shell_minimal.html

--
You received this message because you are subscribed to the Google Groups "fltk.coredev" group.
To unsubscribe from this group and stop receiving emails from it, send an email to fltkcoredev+unsubscribe@googlegroups.com.
To view this discussion on the web visit https://groups.google.com/d/msgid/fltkcoredev/f5f87676-9cba-46e1-8adc-a8f01602cf1dn%40googlegroups.com.
Direct Link to Message ]
 
     
Previous Message ]New Message | Reply ]Next Message ]
 
 

Comments are owned by the poster. All other content is copyright 1998-2024 by Bill Spitzak and others. This project is hosted by The FLTK Team. Please report site problems to 'erco@seriss.com'.