index.html 1.6 KB

12345678910111213141516171819202122232425262728293031323334353637383940414243444546474849505152535455565758596061626364
  1. <!DOCTYPE html>
  2. <html lang="en">
  3. <head>
  4. <title>three.js</title>
  5. <meta charset="utf-8">
  6. <meta name="generator" content="Three.js Editor">
  7. <meta name="viewport" content="width=device-width, user-scalable=no, minimum-scale=1.0, maximum-scale=1.0">
  8. <style>
  9. body {
  10. font-family: Helvetica, Arial, sans-serif;
  11. font-size: 12px;
  12. background-color: #000;
  13. margin: 0px;
  14. overflow: hidden;
  15. }
  16. #edit {
  17. position: absolute;
  18. bottom: 20px;
  19. right: 20px;
  20. padding: 8px;
  21. text-decoration: none;
  22. background-color: #fff;
  23. color: #555;
  24. opacity: 0.5;
  25. }
  26. #edit:hover {
  27. opacity: 1;
  28. }
  29. </style>
  30. </head>
  31. <body ontouchstart="">
  32. <script src="js/three.min.js"></script>
  33. <script src="js/app.js"></script>
  34. <!-- includes -->
  35. <script>
  36. var loader = new THREE.FileLoader();
  37. loader.load( 'app.json', function ( text ) {
  38. var player = new APP.Player();
  39. player.load( JSON.parse( text ) );
  40. player.setSize( window.innerWidth, window.innerHeight );
  41. player.play();
  42. document.body.appendChild( player.dom );
  43. window.addEventListener( 'resize', function () {
  44. player.setSize( window.innerWidth, window.innerHeight );
  45. } );
  46. if ( location.search === '?edit' ) {
  47. var button = document.createElement( 'a' );
  48. button.id = 'edit';
  49. button.href = 'https://threejs.org/editor/#file=' + location.href.split( '/' ).slice( 0, - 1 ).join( '/' ) + '/app.json';
  50. button.target = '_blank';
  51. button.textContent = 'EDIT';
  52. document.body.appendChild( button );
  53. }
  54. } );
  55. </script>
  56. </body>
  57. </html>