godotengine
/
godot
1
0
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity

[HTML5] Editor video driver option. Replace canvas on exit. 

Default is "Auto", but can be forced to a specific WebGL version if the
automatic detection fails.

The game and editor canvas are now replaced with a new one in the exit
hooks. This helps the browser do some context cleanup, and allow us to
create a new context of a different type (WebGL/WebGL2).
This commit is contained in:
Fabio Alessandrelli 2021-09-20 14:47:55 +02:00
parent 9471de7e00
commit 9de577ba12
1 changed files with 30 additions and 12 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

42
misc/dist/html/editor.html vendored
View File

@ -14,7 +14,7 @@
<meta name="apple-mobile-web-app-status-bar-style" content="black-translucent" />
<meta name="msapplication-starturl" content="/latest" />
<meta property="og:site_name" content="Godot Engine Web Editor" />
<meta property="og:url" name="twitter:url" content="https://editor.godotengine.org/releases/latest/" />
<meta property="og:url" name="twitter:url" content="https://editor.godotengine.org/releases/latest/" />
<meta property="og:title" name="twitter:title" content="Free and open source 2D and 3D game engine" />
<meta property="og:description" name="twitter:description" content="Use the Godot Engine editor directly in your web browser, without having to install anything." />
<meta property="og:image" name="twitter:image" content="https://godotengine.org/themes/godotengine/assets/og_image.png" />
@ -269,11 +269,6 @@
<div id="tabs">
<div id="tab-loader">
<div style="color: #e0e0e0;" id="persistence">
<label for="videoMode" style="display: none;">Select video driver:</label><br />
<select id="videoMode" style="display: none;">
<option value="GLES2" selected="selected">WebGL</option>
<option value="GLES3">WebGL 2</option>
</select>
<br />
<img src="logo.svg" alt="Godot Engine logo" width="1024" height="414" style="width: auto; height: auto; max-width: 85%; max-height: 250px" />
<br />
@ -283,6 +278,14 @@
<br />
<br />
<br />
<label for="videoMode" style="margin-right: 1rem">Video driver:</label>
<select id="videoMode">
<option value="" selected="selected">Auto</option>
<option value="GLES2">WebGL</option>
<option value="GLES3">WebGL 2</option>
</select>
<br />
<br />
<label for="zip-file" style="margin-right: 1rem">Preload project ZIP:</label> <input id="zip-file" type="file" name="files" style="margin-bottom: 1rem"/>
<br />
<a href="demo.zip">(Try this for example)</a>
@ -348,7 +351,7 @@
var game = null;
var setStatusMode;
var setStatusNotice;
var video_driver = "GLES2";
var video_driver = "";
function clearPersistence() {
function deleteDB(path) {
@ -479,6 +482,15 @@
animationCallbacks.push(adjustCanvasDimensions);
adjustCanvasDimensions();
function replaceCanvas(from) {
const out = document.createElement("canvas");
out.id = from.id;
out.tabIndex = from.tabIndex;
from.parentNode.replaceChild(out, from);
lastScale = 0;
return out;
}
setStatusMode = function setStatusMode(mode) {
if (statusMode === mode || !initializing)
return;
@ -534,6 +546,7 @@
'canvas': gameCanvas,
'canvasResizePolicy': 1,
'onExit': function () {
gameCanvas = replaceCanvas(gameCanvas);
setGameTabEnabled(false);
showTab('editor');
game = null;
@ -548,7 +561,7 @@
const is_editor = args.filter(function(v) { return v == '--editor' || v == '-e' }).length != 0;
const is_project_manager = args.filter(function(v) { return v == '--project-manager' }).length != 0;
const is_game = !is_editor && !is_project_manager;
if (is_project_manager) {
if (video_driver) {
args.push('--video-driver', video_driver);
}
if (is_game) {
@ -561,7 +574,7 @@
showTab('game');
game.init().then(function() {
requestAnimationFrame(function() {
game.start({'args': args}).then(function() {
game.start({'args': args, 'canvas': gameCanvas}).then(function() {
gameCanvas.focus();
});
});
@ -576,7 +589,7 @@
showTab('loader');
setLoaderEnabled(true);
};
editor.start({'args': args, 'persistentDrops': is_project_manager});
editor.start({'args': args, 'persistentDrops': is_project_manager, 'canvas': editorCanvas});
});
}, 0);
OnEditorExit = null;
@ -603,6 +616,7 @@
'canvas': editorCanvas,
'canvasResizePolicy': 0,
'onExit': function() {
editorCanvas = replaceCanvas(editorCanvas);
if (OnEditorExit) {
OnEditorExit();
}
@ -634,10 +648,14 @@
} catch(e) {
// File exists
}
//selectVideoMode();
selectVideoMode();
showTab('editor');
setLoaderEnabled(false);
editor.start({'args': ['--project-manager', '--video-driver', video_driver], 'persistentDrops': true}).then(function() {
const args = ['--project-manager'];
if (video_driver) {
args.push('--video-driver', video_driver);
}
editor.start({'args': args, 'persistentDrops': true}).then(function() {
setStatusMode('hidden');
initializing = false;
});