public static void Main()
{
document.body.setAttribute("style", "margin: 0; overflow: hidden;");
var div = new HTMLDivElement();
div.setAttribute("style", "width: 960px; height: 540px;");
var button = new HTMLButtonElement();
button.innerHTML = "Run Game";
button.setAttribute("style", "width: 100%; height: 100%; background-color: rgb(100, 149, 237); color: rgb(255, 255, 255); font-size: 20px; border: 0;");
document.body.appendChild(div);
div.appendChild(button);
button.onclick = (ev) =>
{
var canvas = new HTMLCanvasElement();
canvas.width = 960;
canvas.height = 540;
canvas.id = "monogamecanvas";
div.removeChild(button);
div.appendChild(canvas);
_game = new Game1();
_game.Run();
canvas.focus();
};
}
public WebGameWindow(Game game)
{
_game = game;
_keys = new List <Keys>();
Keyboard.SetKeys(_keys);
_canvas = document.getElementById("monogamecanvas").As <HTMLCanvasElement>();
_canvas.tabIndex = 1000;
_canvas.focus();
// Disable selection
_canvas.style.userSelect = "none";
_canvas.style.webkitUserSelect = "none";
_canvas.style.msUserSelect = "none";
// TODO: Move "GL context" creation outside the game window
var possiblecontexts = new[] { "webgl", "experimental-webgl", "webkit-3d", "moz-webgl" };
foreach (var context in possiblecontexts)
{
try
{
WebHelper.gl = _canvas.getContext(context).As <WebGLRenderingContext>();
if (WebHelper.gl != null)
{
break;
}
}
catch { }
}
if (WebHelper.gl == null)
{
var d2d = _canvas.getContext("2d").As <CanvasRenderingContext2D>();
d2d.fillStyle = "#6495ED";
d2d.fillRect(0, 0, _canvas.width, _canvas.height);
d2d.fillStyle = "#000000";
d2d.font = "30px Arial";
d2d.textAlign = "center";
d2d.fillText("This device does not support WebGL :(", _canvas.width / 2, _canvas.height / 2);
throw new Exception("Failed to get WebGL context :|");
}
// Block context menu on the canvas element
_canvas.oncontextmenu += (e) => e.preventDefault();
// Connect events
_canvas.onmousemove += (e) => Canvas_MouseMove(e);
_canvas.onmousedown += (e) => Canvas_MouseDown(e);
_canvas.onmouseup += (e) => Canvas_MouseUp(e);
_canvas.onmousewheel += (e) => Canvas_MouseWheel(e);
_canvas.onkeydown += (e) => Canvas_KeyDown(e);
_canvas.onkeyup += (e) => Canvas_KeyUp(e);
_canvas.ontouchstart += (e) => Canvas_TouchStart(e);
_canvas.ontouchmove += (e) => Canvas_TouchMove(e);
_canvas.ontouchend += (e) => Canvas_TouchEnd(e);
_canvas.ontouchcancel += (e) => Canvas_TouchEnd(e);
document.addEventListener("webkitfullscreenchange", Document_FullscreenChange);
document.addEventListener("mozfullscreenchange", Document_FullscreenChange);
document.addEventListener("fullscreenchange", Document_FullscreenChange);
document.addEventListener("MSFullscreenChange", Document_FullscreenChange);
}