hw3
by Leoooo
HTML
<div id="info">hw2
<br>
demo<br>
<button id="play" style="width:20%">Play</button>
</div>
<script src="https://cdnjs.cloudflare.com/ajax/libs/three.js/84/three.min.js"></script>
<script src="https://threejs.org/examples/js/controls/OrbitControls.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/dat-gui/0.5/dat.gui.min.js"></script>
<script src="https://rawgit.com/jyunming-chen/tutsplus/master/js/text2D.js"></script>
<script src="https://code.jquery.com/jquery-2.1.4.min.js"></script>
<audio id="bgm" style="display:none">
<source src="sounds/scream.mp3" type='audio/mp3'>
</audio>
CSS
#info {
position: absolute;
top: 0px;
width: 100%;
padding: 10px;
text-align: center;
color: #ffffff
}
#gui {
position: absolute;
top: 00px;
left: 20px;
height: 1000px;
}
body {
overflow: hidden;
}
JavaScript
$('#play').click ( function()
{
isPaused = !isPaused;
if (isPaused)
{
$('#play').text ('play')
bgm.pause()
}
else
{
$('#play').text ('pause')
bgm.play()
}
});
var camera, scene, renderer;
var gcontrols; // for dat-gui
var clock = new THREE.Clock();
var ts = clock.getElapsedTime();
var intKey = [];
var body,leftupleg,leftlowleg,rightupleg,rightlowleg;
var text;
var leftuphand,leftlowhand,rightuphand,rightlowhand,head,light;
var isPaused=true;
var period =4.5,bgm;
var isDimming = true, soundVal = 1.0, sign = 1.0;
/*function toggle()
{
isDimming = !isDimming;
sign = isDimming ? -1 : 1;
}*/
var pose1
={
headupy:0,
heady:3,
headx:0,
headhigh:0,
bodyy: 0,
bodyhigh: 0,
bodyx: 0,
leftuphandx: 0,
leftlowhandx: 0,
leftuphandy: 0,
leftuphandz: 0,
rightuphandx: 0,
rightuphandy: 0,
rightuphandz: 0,
rightlowhandx:0,
leftuplegx: 0,
leftlowlegx: 0,
leftuplegy: 0,
leftuplegz: 0,
rightuplegy: 0,
rightuplegz: 0,
rightuplegx: 0,
rightlowlegx: 0,
};
var pose2={
headupy:0,
heady:3-1.60,
headx:0,
headhigh:-1.7485173238996987,
bodyy: -1.6,
bodyhigh: -1.7485173238996987,
bodyx: 0,
leftuphandx: -0.5447924253459577,
leftlowhandx: -0.5708042867547601,
leftuphandy: -0.1112614018659176,
leftuphandz: -0.08958485069191557,
rightuphandx: 0.4956820310061387,
rightuphandy: 0,
rightuphandz: 0,
rightlowhandx: -0.666181111920369,
leftuplegx: -0.4797627718239518,
leftlowlegx: 0.49610515728505533,
leftuplegy: 0,
leftuplegz: 0,
rightuplegy: 0,
rightuplegz: 0,
rightuplegx: 0.19221031457011062,
rightlowlegx: 0.42457253841084874,
};
var pose3={
headupy:0,
heady:3-1.6,
headx:6,
...