threepipe
You can not select more than 25 topics Topics must start with a letter or number, can include dashes ('-') and can be up to 35 characters long.

index.html 2.3KB

12345678910111213141516171819202122232425262728293031323334353637383940414243444546474849505152535455565758596061626364
  1. <!DOCTYPE html>
  2. <html lang="en">
  3. <head>
  4. <meta charset="UTF-8">
  5. <title>Clear + Reimport Test with config</title>
  6. <meta name="viewport" content="width=device-width, initial-scale=1">
  7. <!-- Import maps polyfill -->
  8. <!-- Remove this when import maps will be widely supported -->
  9. <script async src="https://unpkg.com/es-module-shims@1.6.3/dist/es-module-shims.js"></script>
  10. <script type="importmap">
  11. {
  12. "imports": {
  13. "threepipe": "./../../dist/index.mjs"
  14. }
  15. }
  16. </script>
  17. <style id="example-style">
  18. html, body, #canvas-container, #mcanvas {
  19. width: 100%;
  20. height: 100%;
  21. margin: 0;
  22. overflow: hidden;
  23. }
  24. </style>
  25. <script type="module" src="../examples-utils/global-loading.mjs"></script>
  26. <script type="module" src="../examples-utils/simple-code-preview.mjs"></script>
  27. <script id="example-script" type="module">
  28. import {_testFinish, _testStart, ThreeViewer, timeout, Color} from 'threepipe'
  29. const viewer = new ThreeViewer({canvas: document.getElementById('mcanvas')})
  30. async function init() {
  31. viewer.deleteImportedViewerConfigOnLoad = true
  32. viewer.deleteImportedViewerConfigOnLoadWait = 2000
  33. const model3 = await viewer.load('https://asset-samples.threepipe.org/demos/classic-watch.glb')
  34. console.log(model3.children.length)
  35. viewer.scene.backgroundColor = new Color(0x000000)
  36. await timeout(500)
  37. viewer.scene.clearSceneModels()
  38. await timeout(500)
  39. // should load white bg
  40. const model4 = await viewer.load('https://asset-samples.threepipe.org/demos/classic-watch.glb')
  41. console.log(model3.children.length, model4.children.length)
  42. viewer.scene.backgroundColor = new Color(0xff0000)
  43. await timeout(500)
  44. viewer.scene.clearSceneModels()
  45. await timeout(500)
  46. // should not change bg with console warn
  47. const model5 = await viewer.load('https://asset-samples.threepipe.org/demos/classic-watch.glb')
  48. }
  49. _testStart()
  50. init().finally(_testFinish)
  51. </script>
  52. </head>
  53. <body>
  54. <div id="canvas-container">
  55. <canvas id="mcanvas"></canvas>
  56. </div>
  57. </body>