GDQuest / learn-gdscript

Learn Godot's GDScript programming language from zero, right in your browser, for free.
https://gdquest.github.io/learn-gdscript/
Other
2.07k stars 153 forks source link

Change the full-screen button's icon when toggling full-screen from the browser (and not from the app) #272

Closed NathanLovato closed 2 years ago

NathanLovato commented 2 years ago

When the user toggles full-screen mode in their browser from outside the app's context, Godot doesn't know it and we can't update the full-screen toggle button.

image

This makes it stay in the same state until the user clicks it or toggles full-screen from the app.

The behavior may depend on the browser, but for example in brave, if a page is full-screen and you press F11, the browser itself will catch the event and toggle full-screen - it'll bypass the app.

@Xananax do you know if there's a way to get a full-screen toggled event from the browser in this case? In commit d92a7848d115a6d32cd863ad541d3c71a892c92d I worked around OS.window_fullscreen, which was giving unreliable results in the browser and caused bug #226. We could hook into a JavaScript event, if it exists, to emit the Events.fullscreen_toggled signal when toggled from outside the app.

YuriSizov commented 2 years ago

https://developer.mozilla.org/en-US/docs/Web/API/Document/fullscreenchange_event

Xananax commented 2 years ago

I'll do the wiring

NathanLovato commented 2 years ago

Thanks!

Xananax commented 2 years ago

The wiring is available in #278: Browser does tell Godot fullscreen happened/was exited.

However, in view of #208, additional changes are proposed in the same PR. If the additional changes are to be rejected, then we only need to pull out the javascript files (bootstrap.js and bootstrap.d.ts), and add this code to Globals.gd:

var _js_on_fullscreen_ref: JavaScriptObject

func _init() -> void:
    if not OS.has_feature('JavaScript'):
        return
    _js_on_fullscreen_ref = JavaScript.create_callback(self, "_on_js_fullscreen")
    var GDQUEST := JavaScript.get_interface("GDQUEST")
    # warning-ignore:unsafe_property_access
    GDQUEST.events.onFullScreen.connect(_js_on_fullscreen_ref)

func _on_js_fullscreen(_args: Array) -> void:
    var is_it: bool = _args[0];
    print("fullscreen set from JS: %s"%[is_it])
    Events.emit_signal("fullscreen_toggled")