ebiten/internal/ui/ui_js.go

361 lines
9.0 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.
// +build js
2015-01-27 14:02:23 +01:00
package ui
2015-01-02 07:20:05 +01:00
import (
2015-01-05 14:22:47 +01:00
"strconv"
"strings"
2016-02-20 18:15:14 +01:00
"github.com/gopherjs/gopherjs/js"
"github.com/hajimehoshi/ebiten/internal/opengl"
2015-01-02 07:20:05 +01:00
)
var canvas *js.Object
2015-01-02 07:20:05 +01:00
type userInterface struct {
scale float64
deviceScale float64
sizeChanged bool
windowFocus bool
2016-03-24 17:15:47 +01:00
}
2016-03-24 16:38:30 +01:00
var currentUI = &userInterface{
sizeChanged: true,
windowFocus: true,
}
2015-02-10 02:44:58 +01:00
// NOTE: This returns true even when the browser is not active.
func shown() bool {
2015-01-08 15:45:30 +01:00
return !js.Global.Get("document").Get("hidden").Bool()
}
func SetScreenSize(width, height int) bool {
return currentUI.setScreenSize(width, height, currentUI.scale)
}
func SetScreenScale(scale float64) bool {
2016-09-02 16:38:02 +02:00
width, height := currentUI.size()
return currentUI.setScreenSize(width, height, scale)
}
2016-09-02 16:38:02 +02:00
func ScreenScale() float64 {
return currentUI.scale
}
func SetFullscreen(fullscreen bool) bool {
// TODO: Implement
return false
}
func IsFullscreen() bool {
// TODO: Implement
return false
}
func ScreenOffset() (float64, float64) {
return 0, 0
}
func adjustCursorPosition(x, y int) (int, int) {
return x, y
}
2016-09-03 10:17:54 +02:00
func SetCursorVisibility(visibility bool) {
if visibility {
canvas.Get("style").Set("cursor", "auto")
} else {
canvas.Get("style").Set("cursor", "none")
}
}
2016-09-02 18:06:16 +02:00
func (u *userInterface) actualScreenScale() float64 {
2016-06-18 19:59:17 +02:00
return u.scale * u.deviceScale
}
2016-09-01 17:53:05 +02:00
func (u *userInterface) update(g GraphicsContext) error {
if !u.windowFocus {
2016-09-01 17:53:05 +02:00
return nil
}
if opengl.GetContext().IsContextLost() {
opengl.GetContext().RestoreContext()
g.Invalidate()
}
2016-05-19 17:15:05 +02:00
currentInput.updateGamepads()
if u.sizeChanged {
u.sizeChanged = false
w, h := u.size()
g.SetSize(w, h, u.actualScreenScale())
2016-09-01 17:53:05 +02:00
return nil
}
2016-09-01 17:53:05 +02:00
if err := g.Update(); err != nil {
return err
}
return nil
}
2016-09-01 19:31:03 +02:00
func (u *userInterface) loop(g GraphicsContext) error {
ch := make(chan error)
2016-09-01 17:53:05 +02:00
var f func()
f = func() {
go func() {
if err := u.update(g); err != nil {
ch <- err
close(ch)
return
}
js.Global.Get("window").Call("requestAnimationFrame", f)
}()
}
2016-09-01 17:53:05 +02:00
f()
return <-ch
2015-01-02 07:20:05 +01:00
}
func touchEventToTouches(e *js.Object) []touch {
scale := currentUI.scale
j := e.Get("targetTouches")
rect := canvas.Call("getBoundingClientRect")
left, top := rect.Get("left").Int(), rect.Get("top").Int()
t := make([]touch, j.Get("length").Int())
for i := 0; i < len(t); i++ {
jj := j.Call("item", i)
t[i].id = jj.Get("identifier").Int()
2016-06-18 19:59:17 +02:00
t[i].x = int(float64(jj.Get("clientX").Int()-left) / scale)
t[i].y = int(float64(jj.Get("clientY").Int()-top) / scale)
}
return t
}
2016-07-23 13:25:52 +02:00
func init() {
if err := initialize(); err != nil {
panic(err)
}
}
func initialize() error {
2015-01-27 14:02:23 +01:00
// Do nothing in node.js.
2015-01-13 16:18:36 +01:00
if js.Global.Get("require") != js.Undefined {
2016-07-23 13:25:52 +02:00
return nil
2015-01-13 16:18:36 +01:00
}
2015-01-09 17:02:26 +01:00
2015-01-02 08:48:07 +01:00
doc := js.Global.Get("document")
window := js.Global.Get("window")
if doc.Get("body") == nil {
ch := make(chan struct{})
window.Call("addEventListener", "load", func() {
close(ch)
})
<-ch
}
window.Call("addEventListener", "focus", func() {
currentUI.windowFocus = true
})
window.Call("addEventListener", "blur", func() {
currentUI.windowFocus = false
})
// Adjust the initial scale to 1.
// https://developer.mozilla.org/en/docs/Mozilla/Mobile/Viewport_meta_tag
meta := doc.Call("createElement", "meta")
meta.Set("name", "viewport")
meta.Set("content", "width=device-width, initial-scale=1")
doc.Get("head").Call("appendChild", meta)
2015-01-02 08:48:07 +01:00
canvas = doc.Call("createElement", "canvas")
canvas.Set("width", 16)
canvas.Set("height", 16)
doc.Get("body").Call("appendChild", canvas)
2015-01-05 14:22:47 +01:00
htmlStyle := doc.Get("documentElement").Get("style")
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 := doc.Get("body").Get("style")
bodyStyle.Set("backgroundColor", "#000")
bodyStyle.Set("position", "relative")
bodyStyle.Set("height", "100%")
2015-01-05 16:44:39 +01:00
bodyStyle.Set("margin", "0")
bodyStyle.Set("padding", "0")
// TODO: This is OK as long as the game is in an independent iframe.
// What if the canvas is embedded in a HTML directly?
doc.Get("body").Call("addEventListener", "click", func() {
2015-01-06 20:39:33 +01:00
canvas.Call("focus")
})
2015-01-05 14:22:47 +01:00
canvasStyle := canvas.Get("style")
canvasStyle.Set("position", "absolute")
2015-01-02 16:52:49 +01:00
// Make the canvas focusable.
canvas.Call("setAttribute", "tabindex", 1)
canvas.Get("style").Set("outline", "none")
// Keyboard
canvas.Call("addEventListener", "keydown", func(e *js.Object) {
2015-01-15 14:28:05 +01:00
e.Call("preventDefault")
if e.Get("code") == js.Undefined {
// Assume that UA is Safari.
code := e.Get("keyCode").Int()
currentInput.keyDownSafari(code)
return
}
code := e.Get("code").String()
2016-05-19 17:15:05 +02:00
currentInput.keyDown(code)
2015-01-02 16:52:49 +01:00
})
canvas.Call("addEventListener", "keyup", func(e *js.Object) {
2015-01-15 14:28:05 +01:00
e.Call("preventDefault")
if e.Get("code") == js.Undefined {
// Assume that UA is Safari.
code := e.Get("keyCode").Int()
currentInput.keyUpSafari(code)
}
code := e.Get("code").String()
2016-05-19 17:15:05 +02:00
currentInput.keyUp(code)
2015-01-02 16:52:49 +01:00
})
// Mouse
canvas.Call("addEventListener", "mousedown", func(e *js.Object) {
2015-01-15 14:28:05 +01:00
e.Call("preventDefault")
button := e.Get("button").Int()
2016-05-19 17:15:05 +02:00
currentInput.mouseDown(button)
setMouseCursorFromEvent(e)
})
canvas.Call("addEventListener", "mouseup", func(e *js.Object) {
2015-01-15 14:28:05 +01:00
e.Call("preventDefault")
button := e.Get("button").Int()
2016-05-19 17:15:05 +02:00
currentInput.mouseUp(button)
setMouseCursorFromEvent(e)
})
canvas.Call("addEventListener", "mousemove", func(e *js.Object) {
e.Call("preventDefault")
setMouseCursorFromEvent(e)
})
canvas.Call("addEventListener", "contextmenu", func(e *js.Object) {
2015-01-15 14:28:05 +01:00
e.Call("preventDefault")
})
// Touch
canvas.Call("addEventListener", "touchstart", func(e *js.Object) {
e.Call("preventDefault")
currentInput.updateTouches(touchEventToTouches(e))
})
canvas.Call("addEventListener", "touchend", func(e *js.Object) {
e.Call("preventDefault")
currentInput.updateTouches(touchEventToTouches(e))
})
canvas.Call("addEventListener", "touchmove", func(e *js.Object) {
e.Call("preventDefault")
currentInput.updateTouches(touchEventToTouches(e))
})
// Gamepad
window.Call("addEventListener", "gamepadconnected", func(e *js.Object) {
// Do nothing.
})
canvas.Call("addEventListener", "webglcontextlost", func(e *js.Object) {
e.Call("preventDefault")
})
canvas.Call("addEventListener", "webglcontextrestored", func(e *js.Object) {
// Do nothing.
})
2016-07-23 13:25:52 +02:00
return nil
2015-01-02 07:20:05 +01:00
}
func setMouseCursorFromEvent(e *js.Object) {
2016-03-24 17:15:47 +01:00
scale := currentUI.scale
rect := canvas.Call("getBoundingClientRect")
x, y := e.Get("clientX").Int(), e.Get("clientY").Int()
x -= rect.Get("left").Int()
y -= rect.Get("top").Int()
2016-06-18 19:59:17 +02:00
currentInput.setMouseCursor(int(float64(x)/scale), int(float64(y)/scale))
}
2016-03-24 17:15:47 +01:00
func devicePixelRatio() float64 {
ratio := js.Global.Get("window").Get("devicePixelRatio").Float()
if ratio == 0 {
ratio = 1
}
return ratio
}
2016-09-02 17:00:44 +02:00
func RunMainThreadLoop(ch <-chan error) error {
return <-ch
2016-05-06 05:23:48 +02:00
}
2016-09-02 17:20:05 +02:00
func Run(width, height int, scale float64, title string, g GraphicsContext) error {
u := currentUI
2015-01-05 14:08:22 +01:00
doc := js.Global.Get("document")
doc.Set("title", title)
2015-02-09 02:25:00 +01:00
u.setScreenSize(width, height, scale)
canvas.Call("focus")
if err := opengl.Init(); err != nil {
2016-07-23 15:17:36 +02:00
return err
}
2016-09-01 19:31:03 +02:00
return u.loop(g)
2015-02-09 02:25:00 +01:00
}
func (u *userInterface) size() (width, height int) {
2016-09-02 18:06:16 +02:00
a := u.actualScreenScale()
2015-02-09 16:10:50 +01:00
if a == 0 {
2015-02-19 18:01:56 +01:00
// a == 0 only on the initial state.
2015-02-09 16:10:50 +01:00
return
}
width = int(canvas.Get("width").Float() / a)
height = int(canvas.Get("height").Float() / a)
2015-02-09 16:10:50 +01:00
return
}
func isSafari() bool {
ua := js.Global.Get("navigator").Get("userAgent").String()
if !strings.Contains(ua, "Safari") {
return false
}
if strings.Contains(ua, "Chrome") {
return false
}
return true
}
2016-06-18 19:59:17 +02:00
func (u *userInterface) setScreenSize(width, height int, scale float64) bool {
2015-02-09 16:10:50 +01:00
w, h := u.size()
2016-03-24 17:15:47 +01:00
s := u.scale
2015-02-09 16:10:50 +01:00
if w == width && h == height && s == scale {
return false
2015-02-09 02:25:00 +01:00
}
2016-03-24 17:15:47 +01:00
u.scale = scale
// CSS imageRendering seems useful to enlarge the screen,
// but doesn't work in some cases (#306):
// * Chrome just after restoring the lost context
// * Safari
// Let's use the pixel ratio as it is here.
u.deviceScale = devicePixelRatio()
2016-09-02 18:06:16 +02:00
canvas.Set("width", int(float64(width)*u.actualScreenScale()))
canvas.Set("height", int(float64(height)*u.actualScreenScale()))
2015-01-05 14:22:47 +01:00
canvasStyle := canvas.Get("style")
2016-06-18 19:59:17 +02:00
cssWidth := int(float64(width) * scale)
cssHeight := int(float64(height) * scale)
canvasStyle.Set("width", strconv.Itoa(cssWidth)+"px")
canvasStyle.Set("height", strconv.Itoa(cssHeight)+"px")
2015-01-10 11:59:47 +01:00
// CSS calc requires space chars.
2015-02-14 15:23:11 +01:00
canvasStyle.Set("left", "calc((100% - "+strconv.Itoa(cssWidth)+"px) / 2)")
canvasStyle.Set("top", "calc((100% - "+strconv.Itoa(cssHeight)+"px) / 2)")
u.sizeChanged = true
2015-02-09 02:25:00 +01:00
return true
2015-01-02 07:20:05 +01:00
}