asgardius/virtualx-engine
1
0
Fork 0
Code Issues Pull requests Projects Releases Packages Wiki Activity Actions

Merge pull request #42266 from Faless/js/3.0_sync_fs_size_handlers

Browse source 
[3.2] [HTML5] Synchronous main, better persistence, handlers fixes, optional full screen.
This commit is contained in:
Rémi Verschelde 2020-10-02 16:23:35 +02:00 committed by GitHub
commit 7ef6aa7342
No known key found for this signature in database
GPG key ID: 4AEE18F83AFDEB23
7 changed files with 201 additions and 108 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

29
misc/dist/html/full-size.html vendored
View file

@ -146,6 +146,7 @@ $GODOT_HEAD_INCLUDE
const EXECUTABLE_NAME = '$GODOT_BASENAME';
const MAIN_PACK = '$GODOT_BASENAME.pck';
const INDETERMINATE_STATUS_STEP_MS = 100;
const FULL_WINDOW = $GODOT_FULL_WINDOW;
var canvas = document.getElementById('canvas');
var statusProgress = document.getElementById('status-progress');
@ -155,6 +156,9 @@ $GODOT_HEAD_INCLUDE
var initializing = true;
var statusMode = 'hidden';
var lastWidth = 0;
var lastHeight = 0;
var lastScale = 0;
var animationCallbacks = [];
function animate(time) {
@ -164,16 +168,23 @@ $GODOT_HEAD_INCLUDE
requestAnimationFrame(animate);
function adjustCanvasDimensions() {
var scale = window.devicePixelRatio || 1;
var width = window.innerWidth;
var height = window.innerHeight;
canvas.width = width * scale;
canvas.height = height * scale;
canvas.style.width = width + "px";
canvas.style.height = height + "px";
const scale = window.devicePixelRatio || 1;
if (lastWidth != window.innerWidth || lastHeight != window.innerHeight || lastScale != scale) {
lastScale = scale;
lastWidth = window.innerWidth;
lastHeight = window.innerHeight;
canvas.width = Math.floor(lastWidth * scale);
canvas.height = Math.floor(lastHeight * scale);
canvas.style.width = lastWidth + "px";
canvas.style.height = lastHeight + "px";
}
}
if (FULL_WINDOW) {
animationCallbacks.push(adjustCanvasDimensions);
adjustCanvasDimensions();
} else {
engine.setCanvasResizedOnStart(true);
}
animationCallbacks.push(adjustCanvasDimensions);
adjustCanvasDimensions();
setStatusMode = function setStatusMode(mode) {

20
platform/javascript/engine/engine.js
View file

@ -33,6 +33,7 @@ Function('return this')()['Engine'] = (function() {
this.resizeCanvasOnStart = false;
this.onExecute = null;
this.onExit = null;
this.persistentPaths = [];
};
Engine.prototype.init = /** @param {string=} basePath */ function(basePath) {
@ -56,12 +57,14 @@ Function('return this')()['Engine'] = (function() {
config['locateFile'] = Utils.createLocateRewrite(loadPath);
config['instantiateWasm'] = Utils.createInstantiatePromise(loadPromise);
Godot(config).then(function(module) {
me.rtenv = module;
if (unloadAfterInit) {
unload();
}
resolve();
config = null;
module['initFS'](me.persistentPaths).then(function(fs_err) {
me.rtenv = module;
if (unloadAfterInit) {
unload();
}
resolve();
config = null;
});
});
});
return initPromise;
@ -220,6 +223,10 @@ Function('return this')()['Engine'] = (function() {
this.rtenv['copyToFS'](path, buffer);
}
Engine.prototype.setPersistentPaths = function(persistentPaths) {
this.persistentPaths = persistentPaths;
};
// Closure compiler exported engine methods.
/** @export */
Engine['isWebGLAvailable'] = Utils.isWebGLAvailable;
@ -241,5 +248,6 @@ Function('return this')()['Engine'] = (function() {
Engine.prototype['setOnExecute'] = Engine.prototype.setOnExecute;
Engine.prototype['setOnExit'] = Engine.prototype.setOnExit;
Engine.prototype['copyToFS'] = Engine.prototype.copyToFS;
Engine.prototype['setPersistentPaths'] = Engine.prototype.setPersistentPaths;
return Engine;
})();

2
platform/javascript/export/export.cpp
View file

@ -254,6 +254,7 @@ void EditorExportPlatformJavaScript::_fix_html(Vector<uint8_t> &p_html, const Re
current_line = current_line.replace("$GODOT_BASENAME", p_name);
current_line = current_line.replace("$GODOT_PROJECT_NAME", ProjectSettings::get_singleton()->get_setting("application/config/name"));
current_line = current_line.replace("$GODOT_HEAD_INCLUDE", p_preset->get("html/head_include"));
current_line = current_line.replace("$GODOT_FULL_WINDOW", p_preset->get("html/full_window_size") ? "true" : "false");
current_line = current_line.replace("$GODOT_DEBUG_ENABLED", p_debug ? "true" : "false");
str_export += current_line + "\n";
}
@ -290,6 +291,7 @@ void EditorExportPlatformJavaScript::get_export_options(List<ExportOption> *r_op
r_options->push_back(ExportOption(PropertyInfo(Variant::BOOL, "vram_texture_compression/for_mobile"), false)); // ETC or ETC2, depending on renderer
r_options->push_back(ExportOption(PropertyInfo(Variant::STRING, "html/custom_html_shell", PROPERTY_HINT_FILE, "*.html"), ""));
r_options->push_back(ExportOption(PropertyInfo(Variant::STRING, "html/head_include", PROPERTY_HINT_MULTILINE_TEXT), ""));
r_options->push_back(ExportOption(PropertyInfo(Variant::BOOL, "html/full_window_size"), true));
r_options->push_back(ExportOption(PropertyInfo(Variant::STRING, "custom_template/release", PROPERTY_HINT_GLOBAL_FILE, "*.zip"), ""));
r_options->push_back(ExportOption(PropertyInfo(Variant::STRING, "custom_template/debug", PROPERTY_HINT_GLOBAL_FILE, "*.zip"), ""));
}

70
platform/javascript/javascript_main.cpp
View file

@ -50,6 +50,12 @@ extern "C" EMSCRIPTEN_KEEPALIVE void _drop_files_callback(char *p_filev[], int p
os->get_main_loop()->drop_files(files);
}
extern "C" EMSCRIPTEN_KEEPALIVE void _request_quit_callback(char *p_filev[], int p_filec) {
if (os && os->get_main_loop()) {
os->get_main_loop()->notification(MainLoop::NOTIFICATION_WM_QUIT_REQUEST);
}
}
void exit_callback() {
emscripten_cancel_main_loop(); // After this, we can exit!
Main::cleanup();
@ -88,12 +94,27 @@ void main_loop_callback() {
/* clang-format on */
os->get_main_loop()->finish();
os->finalize_async(); // Will add all the async finish functions.
/* clang-format off */
EM_ASM({
Promise.all(Module.async_finish).then(function() {
Module.async_finish = [];
return new Promise(function(accept, reject) {
if (!Module.idbfs) {
accept();
return;
}
FS.syncfs(function(error) {
if (error) {
err('Failed to save IDB file system: ' + error.message);
}
accept();
});
});
}).then(function() {
ccall("cleanup_after_sync", null, []);
});
});
/* clang-format on */
}
}
@ -101,13 +122,8 @@ extern "C" EMSCRIPTEN_KEEPALIVE void cleanup_after_sync() {
emscripten_set_main_loop(exit_callback, -1, false);
}
extern "C" EMSCRIPTEN_KEEPALIVE void main_after_fs_sync(char *p_idbfs_err) {
// Set IDBFS status
String idbfs_err = String::utf8(p_idbfs_err);
if (!idbfs_err.empty()) {
print_line("IndexedDB not available: " + idbfs_err);
}
os->set_idb_available(idbfs_err.empty());
int main(int argc, char *argv[]) {
os = new OS_JavaScript(argc, argv);
// Set canvas ID
char canvas_ptr[256];
@ -127,40 +143,22 @@ extern "C" EMSCRIPTEN_KEEPALIVE void main_after_fs_sync(char *p_idbfs_err) {
/* clang-format on */
setenv("LANG", locale_ptr, true);
Main::setup2();
// Set IDBFS status
os->set_idb_available((bool)EM_ASM_INT({ return Module.idbfs }));
Main::setup(argv[0], argc - 1, &argv[1]);
// Ease up compatibility.
ResourceLoader::set_abort_on_missing_resources(false);
Main::start();
os->get_main_loop()->init();
// Expose method for requesting quit.
EM_ASM({
Module['request_quit'] = function() {
ccall("_request_quit_callback", null, []);
};
});
emscripten_set_main_loop(main_loop_callback, -1, false);
// Immediately run the first iteration.
// We are inside an animation frame, we want to immediately draw on the newly setup canvas.
main_loop_callback();
emscripten_resume_main_loop();
}
int main(int argc, char *argv[]) {
// Create and mount userfs immediately.
EM_ASM({
FS.mkdir('/userfs');
FS.mount(IDBFS, {}, '/userfs');
});
os = new OS_JavaScript(argc, argv);
Main::setup(argv[0], argc - 1, &argv[1], false);
emscripten_set_main_loop(main_loop_callback, -1, false);
emscripten_pause_main_loop(); // Will need to wait for FS sync.
// Sync from persistent state into memory and then
// run the 'main_after_fs_sync' function.
/* clang-format off */
EM_ASM({
FS.syncfs(true, function(err) {
requestAnimationFrame(function() {
ccall('main_after_fs_sync', null, ['string'], [err ? err.message : ""]);
});
});
});
/* clang-format on */
return 0;
// Continued async in main_after_fs_sync() from the syncfs() callback.
}

75
platform/javascript/native/utils.js
View file

@ -28,6 +28,38 @@
/* SOFTWARE OR THE USE OR OTHER DEALINGS IN THE SOFTWARE. */
/*************************************************************************/
Module['initFS'] = function(persistentPaths) {
FS.mkdir('/userfs');
FS.mount(IDBFS, {}, '/userfs');
function createRecursive(dir) {
try {
FS.stat(dir);
} catch (e) {
if (e.errno !== ERRNO_CODES.ENOENT) {
throw e;
}
FS.mkdirTree(dir);
}
}
persistentPaths.forEach(function(path) {
createRecursive(path);
FS.mount(IDBFS, {}, path);
});
return new Promise(function(resolve, reject) {
FS.syncfs(true, function(err) {
if (err) {
Module.idbfs = false;
console.log("IndexedDB not available: " + err.message);
} else {
Module.idbfs = true;
}
resolve(err);
});
});
};
Module['copyToFS'] = function(path, buffer) {
var p = path.lastIndexOf("/");
var dir = "/";
@ -37,7 +69,7 @@ Module['copyToFS'] = function(path, buffer) {
try {
FS.stat(dir);
} catch (e) {
if (e.errno !== ERRNO_CODES.ENOENT) { // 'ENOENT', see https://github.com/emscripten-core/emscripten/blob/master/system/lib/libc/musl/arch/emscripten/bits/errno.h
if (e.errno !== ERRNO_CODES.ENOENT) {
throw e;
}
FS.mkdirTree(dir);
@ -202,3 +234,44 @@ Module.drop_handler = (function() {
});
}
})();
function EventHandlers() {
function Handler(target, event, method, capture) {
this.target = target;
this.event = event;
this.method = method;
this.capture = capture;
}
var listeners = [];
function has(target, event, method, capture) {
return listeners.findIndex(function(e) {
return e.target === target && e.event === event && e.method === method && e.capture == capture;
}) !== -1;
}
this.add = function(target, event, method, capture) {
if (has(target, event, method, capture)) {
return;
}
listeners.push(new Handler(target, event, method, capture));
target.addEventListener(event, method, capture);
};
this.remove = function(target, event, method, capture) {
if (!has(target, event, method, capture)) {
return;
}
target.removeEventListener(event, method, capture);
};
this.clear = function() {
listeners.forEach(function(h) {
h.target.removeEventListener(h.event, h.method, h.capture);
});
listeners.length = 0;
};
}
Module.listeners = new EventHandlers();

109
platform/javascript/os_javascript.cpp
View file

@ -101,7 +101,7 @@ bool OS_JavaScript::check_size_force_redraw() {
if (last_width != canvas_width || last_height != canvas_height) {
last_width = canvas_width;
last_height = canvas_height;
// Update the framebuffer size and for redraw.
// Update the framebuffer size for redraw.
emscripten_set_canvas_element_size(canvas_id.utf8().get_data(), canvas_width, canvas_height);
return true;
}
@ -159,7 +159,11 @@ void OS_JavaScript::set_window_size(const Size2 p_size) {
emscripten_exit_soft_fullscreen();
window_maximized = false;
}
emscripten_set_canvas_element_size(canvas_id.utf8().get_data(), p_size.x, p_size.y);
double scale = EM_ASM_DOUBLE({
return window.devicePixelRatio || 1;
});
emscripten_set_canvas_element_size(canvas_id.utf8().get_data(), p_size.x * scale, p_size.y * scale);
emscripten_set_element_css_size(canvas_id.utf8().get_data(), p_size.x, p_size.y);
}
}
@ -1029,15 +1033,18 @@ Error OS_JavaScript::initialize(const VideoMode &p_desired, int p_video_driver,
#define SET_EM_CALLBACK(target, ev, cb) \
result = emscripten_set_##ev##_callback(target, NULL, true, &cb); \
EM_CHECK(ev)
#define SET_EM_WINDOW_CALLBACK(ev, cb) \
result = emscripten_set_##ev##_callback(EMSCRIPTEN_EVENT_TARGET_WINDOW, NULL, false, &cb); \
EM_CHECK(ev)
#define SET_EM_CALLBACK_NOTARGET(ev, cb) \
result = emscripten_set_##ev##_callback(NULL, true, &cb); \
EM_CHECK(ev)
// These callbacks from Emscripten's html5.h suffice to access most
// JavaScript APIs. For APIs that are not (sufficiently) exposed, EM_ASM
// is used below.
SET_EM_CALLBACK(EMSCRIPTEN_EVENT_TARGET_WINDOW, mousemove, mousemove_callback)
SET_EM_CALLBACK(id.get_data(), mousedown, mouse_button_callback)
SET_EM_CALLBACK(EMSCRIPTEN_EVENT_TARGET_WINDOW, mouseup, mouse_button_callback)
SET_EM_WINDOW_CALLBACK(mousemove, mousemove_callback)
SET_EM_WINDOW_CALLBACK(mouseup, mouse_button_callback)
SET_EM_CALLBACK(id.get_data(), wheel, wheel_callback)
SET_EM_CALLBACK(id.get_data(), touchstart, touch_press_callback)
SET_EM_CALLBACK(id.get_data(), touchmove, touchmove_callback)
@ -1055,38 +1062,30 @@ Error OS_JavaScript::initialize(const VideoMode &p_desired, int p_video_driver,
/* clang-format off */
EM_ASM({
Module.listeners = {};
// Bind native event listeners.
// Module.listeners, and Module.drop_handler are defined in native/utils.js
const canvas = Module['canvas'];
const send_notification = cwrap('send_notification', null, ['number']);
const notifications = arguments;
(['mouseover', 'mouseleave', 'focus', 'blur']).forEach(function(event, index) {
Module.listeners[event] = send_notification.bind(null, notifications[index]);
canvas.addEventListener(event, Module.listeners[event]);
Module.listeners.add(canvas, event, send_notification.bind(null, notifications[index]), true);
});
// Clipboard
const update_clipboard = cwrap('update_clipboard', null, ['string']);
Module.listeners['paste'] = function(evt) {
Module.listeners.add(window, 'paste', function(evt) {
update_clipboard(evt.clipboardData.getData('text'));
};
window.addEventListener('paste', Module.listeners['paste'], true);
Module.listeners['dragover'] = function(ev) {
}, false);
// Drag an drop
Module.listeners.add(canvas, 'dragover', function(ev) {
// Prevent default behavior (which would try to open the file(s))
ev.preventDefault();
};
// Drag an drop
Module.listeners['drop'] = Module.drop_handler; // Defined in native/utils.js
canvas.addEventListener('dragover', Module.listeners['dragover'], false);
canvas.addEventListener('drop', Module.listeners['drop'], false);
// Quit request
Module['request_quit'] = function() {
send_notification(notifications[notifications.length - 1]);
};
}, false);
Module.listeners.add(canvas, 'drop', Module.drop_handler, false);
},
MainLoop::NOTIFICATION_WM_MOUSE_ENTER,
MainLoop::NOTIFICATION_WM_MOUSE_EXIT,
MainLoop::NOTIFICATION_WM_FOCUS_IN,
MainLoop::NOTIFICATION_WM_FOCUS_OUT,
MainLoop::NOTIFICATION_WM_QUIT_REQUEST
MainLoop::NOTIFICATION_WM_FOCUS_OUT
);
/* clang-format on */
@ -1120,24 +1119,25 @@ void OS_JavaScript::resume_audio() {
}
}
extern "C" EMSCRIPTEN_KEEPALIVE void _idb_synced() {
OS_JavaScript::get_singleton()->idb_is_syncing = false;
}
bool OS_JavaScript::main_loop_iterate() {
if (is_userfs_persistent() && sync_wait_time >= 0) {
int64_t current_time = get_ticks_msec();
int64_t elapsed_time = current_time - last_sync_check_time;
last_sync_check_time = current_time;
sync_wait_time -= elapsed_time;
if (sync_wait_time < 0) {
/* clang-format off */
EM_ASM(
FS.syncfs(function(error) {
if (error) { err('Failed to save IDB file system: ' + error.message); }
});
);
/* clang-format on */
}
if (is_userfs_persistent() && idb_needs_sync && !idb_is_syncing) {
idb_is_syncing = true;
idb_needs_sync = false;
/* clang-format off */
EM_ASM(
FS.syncfs(function(error) {
if (error) {
err('Failed to save IDB file system: ' + error.message);
}
ccall("_idb_synced", 'void', [], []);
});
);
/* clang-format on */
}
if (emscripten_sample_gamepad_data() == EMSCRIPTEN_RESULT_SUCCESS)
@ -1152,9 +1152,8 @@ bool OS_JavaScript::main_loop_iterate() {
strategy.canvasResizedCallback = NULL;
emscripten_enter_soft_fullscreen(canvas_id.utf8().get_data(), &strategy);
} else {
emscripten_set_canvas_element_size(canvas_id.utf8().get_data(), windowed_size.width, windowed_size.height);
set_window_size(Size2(windowed_size.width, windowed_size.height));
}
emscripten_set_canvas_element_size(canvas_id.utf8().get_data(), windowed_size.width, windowed_size.height);
just_exited_fullscreen = false;
}
@ -1176,17 +1175,11 @@ void OS_JavaScript::delete_main_loop() {
}
void OS_JavaScript::finalize_async() {
/* clang-format off */
EM_ASM({
const canvas = Module['canvas'];
Object.entries(Module.listeners).forEach(function(kv) {
if (kv[0] == 'paste') {
window.removeEventListener(kv[0], kv[1], true);
} else {
canvas.removeEventListener(kv[0], kv[1]);
}
});
Module.listeners = {};
Module.listeners.clear();
});
/* clang-format on */
if (audio_driver_javascript) {
audio_driver_javascript->finish_async();
}
@ -1397,10 +1390,17 @@ int OS_JavaScript::get_power_percent_left() {
void OS_JavaScript::file_access_close_callback(const String &p_file, int p_flags) {
OS_JavaScript *os = get_singleton();
if (os->is_userfs_persistent() && p_file.begins_with("/userfs") && p_flags & FileAccess::WRITE) {
os->last_sync_check_time = OS::get_singleton()->get_ticks_msec();
// Wait five seconds in case more files are about to be closed.
os->sync_wait_time = 5000;
if (!(os->is_userfs_persistent() && p_flags & FileAccess::WRITE)) {
return; // FS persistence is not working or we are not writing.
}
bool is_file_persistent = p_file.begins_with("/userfs");
#ifdef TOOLS_ENABLED
// Hack for editor persistence (can we track).
is_file_persistent = is_file_persistent || p_file.begins_with("/home/web_user/");
#endif
if (is_file_persistent) {
os->idb_needs_sync = true;
}
}
@ -1445,7 +1445,8 @@ OS_JavaScript::OS_JavaScript(int p_argc, char *p_argv[]) {
swap_ok_cancel = false;
idb_available = false;
sync_wait_time = -1;
idb_needs_sync = false;
idb_is_syncing = false;
if (AudioDriverJavaScript::is_available()) {
audio_driver_javascript = memnew(AudioDriverJavaScript);

4
platform/javascript/os_javascript.h
View file

@ -71,8 +71,7 @@ class OS_JavaScript : public OS_Unix {
bool swap_ok_cancel;
bool idb_available;
int64_t sync_wait_time;
int64_t last_sync_check_time;
bool idb_needs_sync;
static EM_BOOL fullscreen_change_callback(int p_event_type, const EmscriptenFullscreenChangeEvent *p_event, void *p_user_data);
@ -110,6 +109,7 @@ protected:
public:
String canvas_id;
bool idb_is_syncing;
void finalize_async();
bool check_size_force_redraw();