play = function() {
    var vidElem;
    vidElem = document.getElementById('explainMov');
    // vidElem.currentTime = 0;
    vidElem.play();
}

pause = function() {
    var vidElem;
    vidElem = document.getElementById('explainMov');
    // vidElem.currentTime = 0;
    vidElem.pause();
}

explain = function() {
    // alert("add code later");
    var timeSlice, vidElem;
    timeSlice = document.getElementById('menu2').value;
    vidElem = document.getElementById('explainMov');
    vidElem.currentTime = timeSlice;
    vidElem.play();  // optional
}

window.addEventListener('DOMContentLoaded', function() {
    document.getElementById('playButton').addEventListener('click', play);
    document.getElementById('pauseButton').addEventListener('click', pause);
    document.getElementById('exButton').addEventListener('click', explain);

    var video = document.getElementById('explainMov');
    track = video.addTextTrack("subtitles");
    track.mode = 'showing';

    cue1 = new VTTCue(2, 10, "Near the beginning...");
    track.addCue(cue1);

    // set up caption Button
    var capButton = document.getElementById('captionButton');
    capButton.addEventListener('click', function() {
        // write code that adds the given caption to the video
        
        var startTime = document.getElementById('startTimeBox').value;
        var endTime = document.getElementById('endTimeBox').value;
        var captionText = document.getElementById('captionBox').value;
        mycue = new VTTCue(startTime, endTime, captionText);
        track.addCue(mycue); // track is already defined outside of function
    });
})