Update index.html

index.html

@@ -44,8 +44,32 @@
   </li>
 </ul>
 
-<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>
+
+<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>