|
<!DOCTYPE html> |
|
<html> |
|
<head> |
|
<meta http-equiv="Content-type" content="text/html; charset=utf-8"/> |
|
<title>gl-avatar-three-js</title> |
|
|
|
<style> |
|
body { |
|
font-family: Monospace; |
|
|
|
margin: 0px; |
|
width: 100%; |
|
height: 100%; |
|
overflow: hidden; |
|
} |
|
#info { |
|
color: #808080; |
|
position: absolute; |
|
top: 10px; |
|
width: 100%; |
|
text-align: center; |
|
z-index: 100; |
|
display:block; |
|
} |
|
#container { |
|
position: absolute; |
|
top: 0px; |
|
width:100%; |
|
height:100%; |
|
z-index: -1; |
|
} |
|
#controls { |
|
position: absolute; |
|
width: 200px; |
|
bottom: 0px; |
|
left: 0px; |
|
padding: 10px; |
|
background-color: White; |
|
font: 13px "Lucida Grande", Lucida, Verdana, sans-serif; |
|
} |
|
#controls > div { |
|
margin-bottom: 8px; |
|
} |
|
#controls hr { |
|
border: 0px; |
|
height: 1px; |
|
margin-bottom: 10px; |
|
background-color: #bbb; |
|
} |
|
#info a, .button { |
|
color: #f00; |
|
font-weight: bold; |
|
text-decoration: underline; |
|
cursor: pointer |
|
} |
|
</style> |
|
</head> |
|
<body> |
|
|
|
<a href="https://github.com/shrekshao/gltf-avatar-threejs"><img style="position: absolute; top: 0; left: 0; border: 0;" src="https://s3.amazonaws.com/github/ribbons/forkme_left_white_ffffff.png" alt="Fork me on GitHub"></a> |
|
<div id="container"> |
|
<canvas id ="canvas"></canvas> |
|
</div> |
|
|
|
<a id="downloadLink" hidden>download</a> |
|
|
|
<script type="text/javascript" src="build-viewer/AvatarViewer.js"></script> |
|
|
|
<script type="text/javascript"> |
|
|
|
var viewer = new AvatarViewer.Viewer(); |
|
console.log('aaaaaaaaa'); |
|
console.log(AvatarViewer.AvatarSystem); |
|
viewer.init(document.getElementById('canvas')); |
|
</script> |
|
|
|
</body> |
|
</html> |
