internal/uidriver/js: Implement {Set,}Fullscreen for browsers (#1623)

Closes #1611

internal/uidriver/js/ui_js.go

@@ -92,11 +92,36 @@ func (u *UserInterface) ScreenSizeInFullscreen() (int, int) {
 }
 
 func (u *UserInterface) SetFullscreen(fullscreen bool) {
-	// Do nothing
+	if !canvas.Truthy() {
+		return
+	}
+	if !document.Truthy() {
+		return
+	}
+	if fullscreen {
+		f := canvas.Get("requestFullscreen")
+		if !f.Truthy() {
+			f = canvas.Get("webkitRequestFullscreen")
+			return
+		}
+		f.Call("bind", canvas).Invoke()
+		return
+	}
+	f := document.Get("exitFullscreen")
+	if !f.Truthy() {
+		f = document.Get("webkitExitFullscreen")
+	}
+	f.Call("bind", document).Invoke()
 }
 
 func (u *UserInterface) IsFullscreen() bool {
+	if !document.Truthy() {
 		return false
+	}
+	if !document.Get("fullscreenElement").Truthy() && !document.Get("webkitFullscreenElement").Truthy() {
+		return false
+	}
+	return true
 }
 
 func (u *UserInterface) IsFocused() bool {
@@ -400,6 +425,10 @@ func init() {
 		js.Global().Get("console").Call("error", "pointerlockerror event is fired. 'sandbox=\"allow-pointer-lock\"' might be required. There is a known issue on Safari (hajimehoshi/ebiten#1604)")
 		return nil
 	}))
+	document.Call("addEventListener", "fullscreenerror", js.FuncOf(func(this js.Value, args []js.Value) interface{} {
+		js.Global().Get("console").Call("error", "fullscreenerror event is fired. This function on browsers must be called as a result of a gestural interaction or orientation change.")
+		return nil
+	}))
 }
 
 func setWindowEventHandlers(v js.Value) {

run.go

@@ -253,14 +253,14 @@ func SetCursorShape(shape CursorShapeType) {
 
 // IsFullscreen reports whether the current mode is fullscreen or not.
 //
-// IsFullscreen always returns false on browsers or mobiles.
+// IsFullscreen always returns false on mobiles.
 //
 // IsFullscreen is concurrent-safe.
 func IsFullscreen() bool {
 	return uiDriver().IsFullscreen()
 }
 
-// SetFullscreen changes the current mode to fullscreen or not on desktops.
+// SetFullscreen changes the current mode to fullscreen or not on desktops and browsers.
 //
 // In fullscreen mode, the game screen is automatically enlarged
 // to fit with the monitor. The current scale value is ignored.
@@ -268,7 +268,10 @@ func IsFullscreen() bool {
 // On desktops, Ebiten uses 'windowed' fullscreen mode, which doesn't change
 // your monitor's resolution.
 //
-// SetFullscreen does nothing on browsers or mobiles.
+// On browsers, triggering fullscreen requires a user gesture otherwise SetFullscreen does nothing but leave an error message in console.
+// This behaviour varies across browser implementations, your mileage may vary.
+//
+// SetFullscreen does nothing on mobiles.
 //
 // SetFullscreen does nothing on macOS when the window is fullscreened natively by the macOS desktop
 // instead of SetFullscreen(true).