1
0
mirror of https://git.dev.opencascade.org/repos/occt.git synced 2025-04-08 18:40:55 +03:00
occt/samples/webgl/occt-webgl-sample.html
kgv 5de4b704fe 0032065: Samples - use MODULARIZE within WebGL sample
Fixed multitouch input.

Module is now exported with global functions hidden via MODULARIZE
as global object OccViewerModule created by createOccViewerModule().
Global Module setup has been moved to occt-webgl-viewer.js.

Use EMSCRIPTEN_KEEPALIVE attribute istead of listing C functions via EXTRA_EXPORTED_RUNTIME_METHODS.
WasmOcctView now exports static methods as Module functions using EMSCRIPTEN_BINDINGS.

Standard_ASSERT_DBGBREAK_() is now defined using emscripten_debugger().
2021-01-22 19:03:14 +03:00

88 lines
3.2 KiB
HTML

<!DOCTYPE html>
<html lang=en-us>
<head>
<meta charset=utf-8><meta content="text/html; charset=utf-8" http-equiv=Content-Type>
<link rel="shortcut icon" href="lamp.ico" type="image/x-icon" />
<title>OCCT WebGL Viewer Sample</title>
</head>
<body>
<h2>OCCT WebGL Viewer Sample</h2>
<div>
<canvas id=occViewerCanvas oncontextmenu=event.preventDefault() tabindex=-1 style="border:0 none;background-color:#000" width="409" height="409"></canvas>
<img id=occlogo src="OCC_logo.png" style="position: absolute; left: 20px; top: 0px; z-index: 2;" />
</div>
<div>
<label for="fileInput">Choose BREP file to upload: </label><input type="file" id="fileInput" accept=".brep">
<input type="button" value="Clear All" onclick="OccViewerModule.removeAllObjects()">
<input type="button" value="Fit All" onclick="OccViewerModule.fitAllObjects(true)">
</div>
<h4>Console output:</h4>
<p id="output"></p>
<script>
//! Resize canvas to fit into window.
function updateCanvasSize()
{
// size of canvas in logical (density-independent) units
var aSizeX = Math.min (window.innerWidth, window.screen.availWidth);
var aSizeY = Math.min (window.innerHeight, window.screen.availHeight);
aSizeX = Math.max (300, aSizeX - 30);
aSizeY = Math.max (300, aSizeY / 2);
occViewerCanvas.style.width = aSizeX + "px";
occViewerCanvas.style.height = aSizeY + "px";
// drawing buffer size (aka backing store)
var aDevicePixelRatio = window.devicePixelRatio || 1;
occViewerCanvas.width = aSizeX * aDevicePixelRatio;
occViewerCanvas.height = aSizeY * aDevicePixelRatio;
occlogo.style.top = (aSizeY - 30) + "px";
}
window.onresize = updateCanvasSize;
updateCanvasSize();
//! Check browser support.
function isWasmSupported()
{
try {
if (typeof WebAssembly === "object"
&& typeof WebAssembly.instantiate === "function") {
const aDummyModule = new WebAssembly.Module (Uint8Array.of (0x0, 0x61, 0x73, 0x6d, 0x01, 0x00, 0x00, 0x00));
if (aDummyModule instanceof WebAssembly.Module)
{
return new WebAssembly.Instance(aDummyModule) instanceof WebAssembly.Instance;
}
}
} catch (e) {}
return false;
}
if (!isWasmSupported())
{
var anElement = document.getElementById('output');
anElement.innerHTML += "Browser is too old - WebAssembly support is missing!<br>Please check updates or install a modern browser.<br>";
}
//! Handle file uploading.
fileInput.onchange = function()
{
if (fileInput.files.length == 0) { return; }
// Warning! Entire file is pre-loaded into memory.
var aFile = fileInput.files[0];
var aReader = new FileReader();
aReader.onload = function()
{
var aDataArray = new Uint8Array (aReader.result);
const aDataBuffer = OccViewerModule._malloc (aDataArray.length);
OccViewerModule.HEAPU8.set (aDataArray, aDataBuffer);
OccViewerModule.openFromMemory (aFile.name, aDataBuffer, aDataArray.length, true);
//OccViewerModule._free (aDataBuffer); will be freed by called method
OccViewerModule.displayGround (true);
};
aReader.readAsArrayBuffer(aFile);
};
</script>
<script type="text/javascript" src="occt-webgl-sample.js" charset="utf-8"></script>
</body>
</html>