ebiten/internal/uidriver/js/ui_js.go

504 lines
12 KiB
Go
Raw Normal View History

2015-01-02 07:20:05 +01:00
// Copyright 2015 Hajime Hoshi
//
// Licensed under the Apache License, Version 2.0 (the "License");
// you may not use this file except in compliance with the License.
// You may obtain a copy of the License at
//
// http://www.apache.org/licenses/LICENSE-2.0
//
// Unless required by applicable law or agreed to in writing, software
// distributed under the License is distributed on an "AS IS" BASIS,
// WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
// See the License for the specific language governing permissions and
// limitations under the License.
package js
2015-01-02 07:20:05 +01:00
import (
"syscall/js"
"time"
2018-01-02 21:22:56 +01:00
2020-10-03 19:35:13 +02:00
"github.com/hajimehoshi/ebiten/v2/internal/devicescale"
"github.com/hajimehoshi/ebiten/v2/internal/driver"
"github.com/hajimehoshi/ebiten/v2/internal/graphicsdriver/opengl"
"github.com/hajimehoshi/ebiten/v2/internal/hooks"
"github.com/hajimehoshi/ebiten/v2/internal/jsutil"
"github.com/hajimehoshi/ebiten/v2/internal/restorable"
2015-01-02 07:20:05 +01:00
)
var (
stringNone = js.ValueOf("none")
stringTransparent = js.ValueOf("transparent")
)
type UserInterface struct {
runnableOnUnfocused bool
vsync bool
running bool
2020-02-09 15:03:03 +01:00
initFocused bool
sizeChanged bool
contextLost bool
lastDeviceScaleFactor float64
2019-04-06 16:03:21 +02:00
context driver.UIContext
input Input
2016-03-24 17:15:47 +01:00
}
2016-03-24 16:38:30 +01:00
var theUI = &UserInterface{
runnableOnUnfocused: true,
sizeChanged: true,
vsync: true,
initFocused: true,
}
2019-04-07 12:27:30 +02:00
func init() {
theUI.input.ui = theUI
}
func Get() *UserInterface {
return theUI
}
var (
window = js.Global().Get("window")
document = js.Global().Get("document")
canvas js.Value
requestAnimationFrame = js.Global().Get("requestAnimationFrame")
setTimeout = js.Global().Get("setTimeout")
go2cpp = js.Global().Get("go2cpp")
)
func (u *UserInterface) ScreenSizeInFullscreen() (int, int) {
return window.Get("innerWidth").Int(), window.Get("innerHeight").Int()
2018-05-04 09:09:55 +02:00
}
func (u *UserInterface) SetFullscreen(fullscreen bool) {
// Do nothing
}
func (u *UserInterface) IsFullscreen() bool {
return false
}
func (u *UserInterface) IsFocused() bool {
return u.isFocused()
}
func (u *UserInterface) SetRunnableOnUnfocused(runnableOnUnfocused bool) {
u.runnableOnUnfocused = runnableOnUnfocused
}
func (u *UserInterface) IsRunnableOnUnfocused() bool {
return u.runnableOnUnfocused
}
func (u *UserInterface) SetVsyncEnabled(enabled bool) {
u.vsync = enabled
}
func (u *UserInterface) IsVsyncEnabled() bool {
return u.vsync
}
func (u *UserInterface) CursorMode() driver.CursorMode {
if jsutil.Equal(canvas.Get("style").Get("cursor"), stringNone) {
return driver.CursorModeVisible
}
return driver.CursorModeHidden
2017-08-12 08:39:41 +02:00
}
func (u *UserInterface) SetCursorMode(mode driver.CursorMode) {
var visible bool
switch mode {
case driver.CursorModeVisible:
visible = true
case driver.CursorModeHidden:
visible = false
default:
return
}
if visible {
2016-09-03 10:17:54 +02:00
canvas.Get("style").Set("cursor", "auto")
} else {
canvas.Get("style").Set("cursor", "none")
}
}
func (u *UserInterface) DeviceScaleFactor() float64 {
return devicescale.GetAt(0, 0)
}
func (u *UserInterface) updateSize() {
a := u.DeviceScaleFactor()
if u.lastDeviceScaleFactor != a {
u.updateScreenSize()
}
u.lastDeviceScaleFactor = a
if u.sizeChanged {
u.sizeChanged = false
switch {
case document.Truthy():
body := document.Get("body")
bw := body.Get("clientWidth").Float()
bh := body.Get("clientHeight").Float()
u.context.Layout(bw, bh)
case go2cpp.Truthy():
w := go2cpp.Get("screenWidth").Float()
h := go2cpp.Get("screenHeight").Float()
u.context.Layout(w, h)
default:
// Node.js
u.context.Layout(640, 480)
}
}
}
func (u *UserInterface) suspended() bool {
if u.runnableOnUnfocused {
return false
}
return !u.isFocused()
}
func (u *UserInterface) isFocused() bool {
if !document.Call("hasFocus").Bool() {
return false
}
if document.Get("hidden").Bool() {
return false
}
return true
}
func (u *UserInterface) update() error {
if u.suspended() {
hooks.SuspendAudio()
2016-09-01 17:53:05 +02:00
return nil
}
hooks.ResumeAudio()
2020-12-20 10:17:08 +01:00
u.input.updateGamepads()
u.input.updateForGo2Cpp()
u.updateSize()
2020-04-02 17:06:42 +02:00
if err := u.context.Update(); err != nil {
2016-09-01 17:53:05 +02:00
return err
}
2016-09-01 17:53:05 +02:00
return nil
}
func (u *UserInterface) loop(context driver.UIContext) <-chan error {
u.context = context
errCh := make(chan error)
reqStopAudioCh := make(chan struct{})
resStopAudioCh := make(chan struct{})
var cf js.Func
f := func() {
if u.contextLost {
requestAnimationFrame.Invoke(cf)
return
}
if err := u.update(); err != nil {
close(reqStopAudioCh)
<-resStopAudioCh
errCh <- err
close(errCh)
return
2018-05-26 18:59:35 +02:00
}
if u.vsync {
requestAnimationFrame.Invoke(cf)
} else {
2018-07-14 16:47:31 +02:00
setTimeout.Invoke(cf, 0)
}
}
2020-05-18 21:08:30 +02:00
// TODO: Should cf be released after the game ends?
cf = js.FuncOf(func(this js.Value, args []js.Value) interface{} {
2020-05-18 21:08:30 +02:00
// f can be blocked but callbacks must not be blocked. Create a goroutine (#1161).
go f()
return nil
})
// Call f asyncly to be async since ch is used in f.
go f()
2015-01-02 07:20:05 +01:00
// Run another loop to watch suspended() as the above update function is never called when the tab is hidden.
// To check the document's visiblity, visibilitychange event should usually be used. However, this event is
// not reliable and sometimes it is not fired (#961). Then, watch the state regularly instead.
go func() {
defer close(resStopAudioCh)
const interval = 100 * time.Millisecond
t := time.NewTicker(interval)
defer func() {
t.Stop()
// This is a dirty hack. (*time.Ticker).Stop() just marks the timer 'deleted' [1] and
// something might run even after Stop. On Wasm, this causes an issue to execute Go program
// even after finishing (#1027). Sleep for the interval time duration to ensure that
// everything related to the timer is finished.
//
// [1] runtime.deltimer
time.Sleep(interval)
}()
for {
select {
case <-t.C:
if u.suspended() {
hooks.SuspendAudio()
} else {
hooks.ResumeAudio()
}
case <-reqStopAudioCh:
return
}
}
}()
return errCh
}
func init() {
// docuemnt is undefined on node.js
if !document.Truthy() {
return
}
if !document.Get("body").Truthy() {
ch := make(chan struct{})
window.Call("addEventListener", "load", js.FuncOf(func(this js.Value, args []js.Value) interface{} {
close(ch)
return nil
}))
<-ch
}
setWindowEventHandlers(window)
// Adjust the initial scale to 1.
// https://developer.mozilla.org/en/docs/Mozilla/Mobile/Viewport_meta_tag
meta := document.Call("createElement", "meta")
meta.Set("name", "viewport")
meta.Set("content", "width=device-width, initial-scale=1")
document.Get("head").Call("appendChild", meta)
canvas = document.Call("createElement", "canvas")
2015-01-02 08:48:07 +01:00
canvas.Set("width", 16)
canvas.Set("height", 16)
document.Get("body").Call("appendChild", canvas)
2015-01-05 14:22:47 +01:00
htmlStyle := document.Get("documentElement").Get("style")
2015-01-05 14:22:47 +01:00
htmlStyle.Set("height", "100%")
2015-01-05 16:44:39 +01:00
htmlStyle.Set("margin", "0")
htmlStyle.Set("padding", "0")
2015-01-05 14:22:47 +01:00
bodyStyle := document.Get("body").Get("style")
2015-01-05 14:22:47 +01:00
bodyStyle.Set("backgroundColor", "#000")
bodyStyle.Set("height", "100%")
2015-01-05 16:44:39 +01:00
bodyStyle.Set("margin", "0")
bodyStyle.Set("padding", "0")
2019-03-19 17:36:52 +01:00
2015-01-05 14:22:47 +01:00
canvasStyle := canvas.Get("style")
canvasStyle.Set("width", "100%")
canvasStyle.Set("height", "100%")
canvasStyle.Set("margin", "0")
canvasStyle.Set("padding", "0")
2015-01-05 14:22:47 +01:00
2015-01-02 16:52:49 +01:00
// Make the canvas focusable.
canvas.Call("setAttribute", "tabindex", 1)
canvas.Get("style").Set("outline", "none")
setCanvasEventHandlers(canvas)
}
func setWindowEventHandlers(v js.Value) {
v.Call("addEventListener", "resize", js.FuncOf(func(this js.Value, args []js.Value) interface{} {
theUI.updateScreenSize()
return nil
}))
v.Call("addEventListener", "gamepadconnected", js.FuncOf(func(this js.Value, args []js.Value) interface{} {
// Do nothing.
return nil
}))
}
func setCanvasEventHandlers(v js.Value) {
// Keyboard
v.Call("addEventListener", "keydown", js.FuncOf(func(this js.Value, args []js.Value) interface{} {
// Focus the canvas explicitly to activate tha game (#961).
v.Call("focus")
e := args[0]
// Don't 'preventDefault' on keydown events or keypress events wouldn't work (#715).
2020-12-20 10:17:08 +01:00
theUI.input.updateFromEvent(e)
return nil
}))
v.Call("addEventListener", "keypress", js.FuncOf(func(this js.Value, args []js.Value) interface{} {
e := args[0]
e.Call("preventDefault")
2020-12-20 10:17:08 +01:00
theUI.input.updateFromEvent(e)
return nil
}))
v.Call("addEventListener", "keyup", js.FuncOf(func(this js.Value, args []js.Value) interface{} {
e := args[0]
e.Call("preventDefault")
2020-12-20 10:17:08 +01:00
theUI.input.updateFromEvent(e)
return nil
}))
// Mouse
v.Call("addEventListener", "mousedown", js.FuncOf(func(this js.Value, args []js.Value) interface{} {
// Focus the canvas explicitly to activate tha game (#961).
v.Call("focus")
e := args[0]
e.Call("preventDefault")
2020-12-20 10:17:08 +01:00
theUI.input.updateFromEvent(e)
return nil
}))
v.Call("addEventListener", "mouseup", js.FuncOf(func(this js.Value, args []js.Value) interface{} {
e := args[0]
e.Call("preventDefault")
2020-12-20 10:17:08 +01:00
theUI.input.updateFromEvent(e)
return nil
}))
v.Call("addEventListener", "mousemove", js.FuncOf(func(this js.Value, args []js.Value) interface{} {
e := args[0]
e.Call("preventDefault")
2020-12-20 10:17:08 +01:00
theUI.input.updateFromEvent(e)
return nil
}))
v.Call("addEventListener", "wheel", js.FuncOf(func(this js.Value, args []js.Value) interface{} {
e := args[0]
e.Call("preventDefault")
2020-12-20 10:17:08 +01:00
theUI.input.updateFromEvent(e)
return nil
}))
// Touch
v.Call("addEventListener", "touchstart", js.FuncOf(func(this js.Value, args []js.Value) interface{} {
// Focus the canvas explicitly to activate tha game (#961).
v.Call("focus")
e := args[0]
e.Call("preventDefault")
2020-12-20 10:17:08 +01:00
theUI.input.updateFromEvent(e)
return nil
}))
v.Call("addEventListener", "touchend", js.FuncOf(func(this js.Value, args []js.Value) interface{} {
e := args[0]
e.Call("preventDefault")
2020-12-20 10:17:08 +01:00
theUI.input.updateFromEvent(e)
return nil
}))
v.Call("addEventListener", "touchmove", js.FuncOf(func(this js.Value, args []js.Value) interface{} {
e := args[0]
e.Call("preventDefault")
2020-12-20 10:17:08 +01:00
theUI.input.updateFromEvent(e)
return nil
}))
// Gamepad
v.Call("addEventListener", "contextmenu", js.FuncOf(func(this js.Value, args []js.Value) interface{} {
e := args[0]
e.Call("preventDefault")
return nil
2018-05-26 18:59:35 +02:00
}))
// Context
v.Call("addEventListener", "webglcontextlost", js.FuncOf(func(this js.Value, args []js.Value) interface{} {
e := args[0]
e.Call("preventDefault")
2019-04-07 03:58:11 +02:00
theUI.contextLost = true
restorable.OnContextLost()
return nil
2018-05-26 18:59:35 +02:00
}))
v.Call("addEventListener", "webglcontextrestored", js.FuncOf(func(this js.Value, args []js.Value) interface{} {
2019-04-07 03:58:11 +02:00
theUI.contextLost = false
return nil
2018-05-26 18:59:35 +02:00
}))
2015-01-02 07:20:05 +01:00
}
func (u *UserInterface) Run(context driver.UIContext) error {
if u.initFocused && window.Truthy() {
// Do not focus the canvas when the current document is in an iframe.
// Otherwise, the parent page tries to focus the iframe on every loading, which is annoying (#1373).
isInIframe := !jsutil.Equal(window.Get("location"), window.Get("parent").Get("location"))
if !isInIframe {
canvas.Call("focus")
}
2020-02-09 15:03:03 +01:00
}
u.running = true
2020-10-06 18:03:19 +02:00
return <-u.loop(context)
2015-02-09 02:25:00 +01:00
}
func (u *UserInterface) RunWithoutMainLoop(context driver.UIContext) {
panic("js: RunWithoutMainLoop is not implemented")
}
func (u *UserInterface) updateScreenSize() {
switch {
case document.Truthy():
body := document.Get("body")
bw := int(body.Get("clientWidth").Float() * u.DeviceScaleFactor())
bh := int(body.Get("clientHeight").Float() * u.DeviceScaleFactor())
canvas.Set("width", bw)
canvas.Set("height", bh)
case go2cpp.Truthy():
// TODO: Implement this
}
u.sizeChanged = true
2015-01-02 07:20:05 +01:00
}
2019-04-07 11:28:50 +02:00
func (u *UserInterface) SetScreenTransparent(transparent bool) {
if u.running {
panic("js: SetScreenTransparent can't be called after the main loop starts")
}
bodyStyle := document.Get("body").Get("style")
if transparent {
bodyStyle.Set("backgroundColor", "transparent")
} else {
bodyStyle.Set("backgroundColor", "#000")
}
}
func (u *UserInterface) IsScreenTransparent() bool {
bodyStyle := document.Get("body").Get("style")
return jsutil.Equal(bodyStyle.Get("backgroundColor"), stringTransparent)
}
2020-04-02 17:06:42 +02:00
func (u *UserInterface) ResetForFrame() {
u.updateSize()
u.input.resetForFrame()
}
2020-02-09 15:03:03 +01:00
func (u *UserInterface) SetInitFocused(focused bool) {
if u.running {
panic("ui: SetInitFocused must be called before the main loop")
}
u.initFocused = focused
}
2019-04-07 11:28:50 +02:00
func (u *UserInterface) Input() driver.Input {
return &u.input
2019-04-07 11:28:50 +02:00
}
2019-12-24 16:05:56 +01:00
func (u *UserInterface) Window() driver.Window {
return nil
}
func (*UserInterface) Graphics() driver.Graphics {
return opengl.Get()
}