2018-02-05 16:16:41 +01:00
|
|
|
<!DOCTYPE html>
|
|
|
|
|
<html>
|
|
|
|
|
<head>
|
|
|
|
|
<meta charset="utf-8">
|
|
|
|
|
<title>skinview3d examples</title>
|
|
|
|
|
<style>
|
2018-02-12 07:02:47 +01:00
|
|
|
body, html { background: #444444; color: #fff; }
|
|
|
|
|
canvas { border: 1px solid white; }
|
2018-02-11 17:01:28 +01:00
|
|
|
</style>
|
|
|
|
|
</head>
|
|
|
|
|
<body>
|
|
|
|
|
<br>
|
|
|
|
|
<div id="skin_container"></div>
|
2018-02-05 16:16:41 +01:00
|
|
|
|
2018-02-11 17:01:28 +01:00
|
|
|
<p> Animate:
|
|
|
|
|
<button type="button" onclick="walk()">Walk</button>
|
|
|
|
|
<button type="button" onclick="run()">Run!</button>
|
|
|
|
|
<button type="button" onclick="rotate()">Rotate</button>
|
|
|
|
|
<button type="button" onclick="pause()">Pause / Resume</button>
|
|
|
|
|
<button type="button" onclick="initSkinViewer()">Reset</button>
|
|
|
|
|
<br>
|
|
|
|
|
Global Animation Speed: x<input type="text" id="speed" value="1" title="1 for default" size="5"></input>
|
|
|
|
|
<button type="button" onclick="setGlobalAnimationSpeed()">Set</button>
|
|
|
|
|
</p>
|
2018-02-05 16:16:41 +01:00
|
|
|
|
2018-02-11 17:01:28 +01:00
|
|
|
<p> Animation Mouse Control:
|
2018-02-12 07:02:47 +01:00
|
|
|
<input type="checkbox" id="rotate" checked="checked" onclick="control.enableRotate = this.checked"><label for="rotate">Enable Rotate</label>
|
|
|
|
|
<input type="checkbox" id="zoom" checked="checked" onclick="control.enableZoom = this.checked"><label for="zoom">Enable Zoom</label>
|
|
|
|
|
<input type="checkbox" id="pan" onclick="control.enablePan = this.checked"><label for="pan">Enable Pan</label>
|
2018-02-11 17:01:28 +01:00
|
|
|
</p>
|
2018-02-05 16:16:41 +01:00
|
|
|
|
2018-02-11 17:01:28 +01:00
|
|
|
<p> Width: <input type="text" id="width" value="600" size="5"></input>
|
|
|
|
|
Height: <input type="text" id="height" value="600" size="5"></input>
|
|
|
|
|
<button type="button" onclick="resizeSkinViewer()">Change Size</button>
|
|
|
|
|
</p>
|
2018-02-05 16:16:41 +01:00
|
|
|
|
2018-02-11 17:01:28 +01:00
|
|
|
<p> Skin Url:
|
|
|
|
|
<input type="text" id="skin_url" value="img/hatsune_miku.png"></input>
|
|
|
|
|
<input type="checkbox" id="alex" checked="checked" onclick="initSkinViewer()">
|
|
|
|
|
<label for="alex">Load alex(slim) model</label><br>
|
|
|
|
|
Cape Url:
|
|
|
|
|
<input type="text" id="cape_url" value="img/mojang_cape.png"></input>
|
|
|
|
|
<button type="button" onclick="hotReloadTextures()">Load Textures</button>
|
|
|
|
|
</p>
|
|
|
|
|
|
|
|
|
|
<p> All textures available to load:
|
|
|
|
|
<ul>
|
|
|
|
|
<li>img/1_8_texturemap_redux.png</li>
|
|
|
|
|
<li>img/cape.png</li>
|
|
|
|
|
<li>img/Hacksore.png</li>
|
|
|
|
|
<li>img/haka.png</li>
|
|
|
|
|
<li>img/hatsune_miku.png</li>
|
|
|
|
|
<li>img/ironman_hd.png</li>
|
|
|
|
|
<li>img/mojang_cape.png</li>
|
|
|
|
|
<li>img/sethbling.png</li>
|
|
|
|
|
</ul>
|
|
|
|
|
</p>
|
|
|
|
|
|
2018-05-13 06:10:38 +02:00
|
|
|
<script type="text/javascript" src="https://cdnjs.cloudflare.com/ajax/libs/three.js/92/three.min.js"></script>
|
2018-02-12 07:35:33 +01:00
|
|
|
<script type="text/javascript" src="js/build/skinview3d.min.js"></script>
|
2018-02-12 07:02:47 +01:00
|
|
|
<script type="text/javascript" src="js/example.js"></script>
|
2018-02-11 17:01:28 +01:00
|
|
|
<script>
|
|
|
|
|
initSkinViewer();
|
|
|
|
|
walk();
|
|
|
|
|
</script>
|
2018-02-05 16:16:41 +01:00
|
|
|
</body>
|
|
|
|
|
</html>
|
