0032315: Configuration, CMake - fix building Draw Harness plugins as static libraries
[occt.git] / samples / webgl / occt-webgl-sample.html
1 <!DOCTYPE html>
2 <html lang=en-us>
3 <head>
4 <meta charset=utf-8><meta content="text/html; charset=utf-8" http-equiv=Content-Type>
5 <link rel="shortcut icon" href="lamp.ico" type="image/x-icon" />
6 <title>OCCT WebGL Viewer Sample</title>
7 </head>
8 <body>
9
10 <h2>OCCT WebGL Viewer Sample</h2>
11 <div>
12   <canvas id=occViewerCanvas oncontextmenu=event.preventDefault() tabindex=-1 style="border:0 none;background-color:#000" width="409" height="409"></canvas>
13   <img id=occlogo src="OCC_logo.png" style="position: absolute; left: 20px; top: 0px; z-index: 2;" />
14 </div>
15
16 <div>
17   <label for="fileInput">Choose BREP file to upload: </label><input type="file" id="fileInput" accept=".brep">
18   <input type="button" value="Clear All" onclick="OccViewerModule.removeAllObjects()">
19   <input type="button" value="Fit All"   onclick="OccViewerModule.fitAllObjects(true)">
20 </div>
21 <h4>Console output:</h4>
22 <p id="output"></p>
23 <script>
24 //! Resize canvas to fit into window.
25 function updateCanvasSize()
26 {
27   // size of canvas in logical (density-independent) units
28   var aSizeX = Math.min (window.innerWidth,  window.screen.availWidth);
29   var aSizeY = Math.min (window.innerHeight, window.screen.availHeight);
30   aSizeX = Math.max (300, aSizeX - 30);
31   aSizeY = Math.max (300, aSizeY / 2);
32   occViewerCanvas.style.width  = aSizeX + "px";
33   occViewerCanvas.style.height = aSizeY + "px";
34
35   // drawing buffer size (aka backing store)
36   var aDevicePixelRatio = window.devicePixelRatio || 1;
37   occViewerCanvas.width  = aSizeX * aDevicePixelRatio;
38   occViewerCanvas.height = aSizeY * aDevicePixelRatio;
39
40   occlogo.style.top = (aSizeY - 30) + "px";
41 }
42 window.onresize = updateCanvasSize;
43 updateCanvasSize();
44
45 //! Check browser support.
46 function isWasmSupported()
47 {
48   try {
49     if (typeof WebAssembly === "object"
50      && typeof WebAssembly.instantiate === "function") {
51       const aDummyModule = new WebAssembly.Module (Uint8Array.of (0x0, 0x61, 0x73, 0x6d, 0x01, 0x00, 0x00, 0x00));
52       if (aDummyModule instanceof WebAssembly.Module)
53       {
54         return new WebAssembly.Instance(aDummyModule) instanceof WebAssembly.Instance;
55       }
56     }
57   } catch (e) {}
58   return false;
59 }
60 if (!isWasmSupported())
61 {
62   var anElement = document.getElementById('output');
63   anElement.innerHTML += "Browser is too old - WebAssembly support is missing!<br>Please check updates or install a modern browser.<br>";
64 }
65
66 //! Handle file uploading.
67 fileInput.onchange = function()
68 {
69   if (fileInput.files.length == 0) { return; }
70   // Warning! Entire file is pre-loaded into memory.
71   var aFile = fileInput.files[0];
72   var aReader = new FileReader();
73   aReader.onload = function()
74   {
75     var aDataArray = new Uint8Array (aReader.result);
76     const aDataBuffer = OccViewerModule._malloc (aDataArray.length);
77     OccViewerModule.HEAPU8.set (aDataArray, aDataBuffer);
78     OccViewerModule.openFromMemory (aFile.name, aDataBuffer, aDataArray.length, true);
79     //OccViewerModule._free (aDataBuffer); will be freed by called method
80     OccViewerModule.displayGround (true);
81   };
82   aReader.readAsArrayBuffer(aFile);
83 };
84 </script>
85 <script type="text/javascript" src="occt-webgl-sample.js" charset="utf-8"></script>
86 </body>
87 </html>