Spaces:
Running
Running
File size: 2,861 Bytes
9c8c89a bae70b4 d6ade35 4b3360a bae70b4 9c8c89a d6ade35 c6064ad 9c8c89a a9d5892 deb197e ef0377b a9d5892 deb197e ef0377b 9c8c89a 9618536 3d6dcf5 64fb01f eef1266 3d6dcf5 64fb01f 629f772 3d6dcf5 9c8c89a db081f4 9c8c89a |
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 32 33 34 35 36 37 38 39 40 41 42 43 44 45 46 47 48 49 50 51 52 53 54 55 56 57 58 59 60 61 62 63 64 65 66 67 68 69 70 71 72 73 74 75 76 |
<!DOCTYPE html>
<html>
<head>
<!-- Metadata -->
<meta charset="utf-8">
<title>¿Title?</title>
<!-- Bootstrap CSS files-->
<link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/[email protected]/dist/css/bootstrap.min.css" integrity="sha384-Gn5384xqQ1aoWXA+058RXPxPg6fy4IWvTNh0E263XmFcJlSAwiGgFAW/dAiS6JXm" crossorigin="anonymous">
<!-- Google web fonts -->
<link href="https://fonts.googleapis.com/css?family=Open+Sans:300,400,400i,600,700" rel="stylesheet">
<link href="https://fonts.googleapis.com/css?family=Montserrat:400,400i,500,500i,600" rel="stylesheet">
<!-- Personal styles -->
<link rel="stylesheet" href="./css/main.css">
</head>
<body>
<audio controls id="speakera" width="360">
<source src="https://huggingface.co/spaces/clr/prosaln/resolve/main/full_conversations/0f2c315c-affa-4552-9f36-f6b3bbac49d4/speaker_a_convo_0f2c315c-affa-4552-9f36-f6b3bbac49d4.wav">
</audio>
<audio controls id="speakerb" width="360">
<source src="https://huggingface.co/spaces/clr/prosaln/resolve/main/full_conversations/0f2c315c-affa-4552-9f36-f6b3bbac49d4/speaker_b_convo_0f2c315c-affa-4552-9f36-f6b3bbac49d4.wav">
</audio>
<ul id="convo-list">
<li class="row">
<div class="text"><span name="utterance" beg="124000" end="133000"><span class="movcontrol">▶</span> line one longer longer
</span></div>
</li><li class="row">
<div class="text"><p>line two</p></div>
</li><li class="row">
<div class="text"><p>line three</p></div>
</li><li class="row">
<div class="text"><span name="utterance" beg="244000" end="255000">line four <span class="movcontrol">▶</span></span></div>
</li><li class="row">
<div class="text"><p>line 5</p></div>
</li><li class="row">
<div class="text"><p>line six shouls also be quite long i suppose</p></div>
</li><li class="row">
<div class="text"><p>line seven as well can get long</p></div>
</li>
</ul>
<audio id="sample" src="./full_conversations/b107d272-73c7-45d2-af9e-9ded79697fd3/speaker_a_convo_b107d272-73c7-45d2-af9e-9ded79697fd3.wav" controls preload></audio>
<a href="javascript:playSegment(0.0, 13.0);">Play1</a>
<a href="javascript:playSegment(130.0, 140.0);">Play2</a>
<script>
var audio = document.getElementById('sample');
var segmentEnd;
audio.addEventListener('timeupdate', function (){
if (segmentEnd && audio.currentTime >= segmentEnd) {
audio.pause();
}
console.log(audio.currentTime);
}, false);
function playSegment(startTime, endTime){
segmentEnd = endTime;
audio.currentTime = startTime;
audio.play();
}
</script>
<!--<script src="https://code.jquery.com/jquery-3.3.1.slim.min.js" integrity="sha384-q8i/X+965DzO0rT7abK41JStQIAqVgRVzpbzo5smXKp4YfRvH+8abtTE1Pi6jizo" crossorigin="anonymous"></script>
<script type="text/javascript" src="./js/js.php"></script>-->
</body>
</html>
|