github.com/EngineerKamesh/gofullstack@v0.0.0-20180609171605-d41341d7d4ee/volume3/section2/3dgopher/static/3dgopherfinal.html (about)

     1  <!DOCTYPE html>
     2  <html lang="en">
     3  	<head>
     4  		<title>3D Gopher</title>
     5  		<meta charset="utf-8">
     6  		<meta name="viewport" content="width=device-width, user-scalable=no, minimum-scale=1.0, maximum-scale=1.0">
     7  		<style>
     8  			body {
     9  				font-family: Monospace;
    10  				background-color: #ffffff;
    11  				margin: 0px;
    12  				overflow: hidden;
    13  			}
    14  
    15  			#info {
    16  				color: #fff;
    17  				position: absolute;
    18  				top: 10px;
    19  				width: 100%;
    20  				text-align: center;
    21  				z-index: 100;
    22  				display:block;
    23  
    24  			}
    25  
    26  			a { color: skyblue }
    27  			.button { background:#999; color:#eee; padding:0.2em 0.5em; cursor:pointer }
    28  			.highlight { background:orange; color:#fff; }
    29  
    30  			span {
    31  				display: inline-block;
    32  				width: 60px;
    33  				float: left;
    34  				text-align: center;
    35  			}
    36  
    37  			canvas {
    38  				background-color: transparent;
    39  			}
    40  
    41  		</style>
    42  	</head>
    43  	<body>
    44  		<script src="/js/three.js"></script>
    45  		<script src="/js/OBJLoader.js"></script>
    46  			<script>
    47  
    48  
    49  function resizeCanvasToDisplaySize(canvas) {
    50    const width  = canvas.clientWidth;
    51    const height = canvas.clientHeight;
    52    if (canvas.width !== width || canvas.height !== height) {
    53      canvas.width  = width;
    54      canvas.height = height;
    55    }
    56  }
    57  
    58  function panCamera(camera, cameraTarget) {
    59  	var timer = Date.now() * 0.0005;
    60  	camera.position.x = Math.cos(timer) * 2.7 * -1;
    61  	camera.position.z = Math.sin(timer) * 2.7;
    62  	camera.lookAt( cameraTarget );
    63  }
    64  
    65  </script>
    66  
    67  	<script src="/js/3dgopherfinal.js"></script>
    68  
    69  	</body>
    70  </html>
    71