youtube segment player

HTML

<div id="clicker">

</div>
<div id="player"></div>

CSS

html,
body {
  width: 100%;
  height: 100%;
}

#clicker {
  width: 100%;
  height: 100px;
  background: #000;
  color: white;
  margin: 0 auto;
  padding-top: 50px;
  text-align: center;
}

JavaScript

// 2. This code loads the IFrame Player API code asynchronously.
var tag = document.createElement('script');
tag.src = "//www.youtube.com/iframe_api";
var firstScriptTag = document.getElementsByTagName('script')[0];
firstScriptTag.parentNode.insertBefore(tag, firstScriptTag);

// 3. This function creates an <iframe> (and YouTube player)
//    after the API code downloads.
var player;

function onYouTubeIframeAPIReady() {
  player = new YT.Player('player', {
    height: '390',
    width: '640',
    events: {
      'onReady': onPlayerReady,
      'onStateChange': onPlayerStateChange
    }
  });
}
var videos = [{
  vid: '0EK6R2Xz3vo',
  startSeconds: 0,
  endSeconds: 166
  }, {
  vid: 'an2OcPiY-lM',
   startSeconds: 0,
  endSeconds: 228
}, {
  vid: '0EK6R2Xz3vo',
  startSeconds: 167,
  endSeconds: 186
}, {
  vid: 'R5CUEQpJ3jM',
  startSeconds: 0,
  endSeconds: 211
}, {
  vid: '0EK6R2Xz3vo',
  startSeconds: 186,
  endSeconds: 293
}, {
  vid: 'HQPheU9-TgM',
  startSeconds: 0,
  endSeconds: 202
}
,
{
  vid: '0EK6R2Xz3vo',
  startSeconds: 293,
  endSeconds: 346
}
,
{
  vid: 'T8BX__KPfjM',
  startSeconds: 0,
  endSeconds: 183
}
,
{
  vid: '0EK6R2Xz3vo',
  startSeconds: 346,
  endSeconds: 471
}
,
{
  vid: 'cByGJhPlHn0',
  startSeconds: 0,
  endSeconds: 223
}
,
{
  vid: '0EK6R2Xz3vo',
  startSeconds: 471,
  endSeconds: 732
}
,
{
  vid: 'mU0RelVJqBE',
  startSeconds: 0,
  endSeconds: 148
}
,
{
  vid: '0EK6R2Xz3vo',
  startSeconds: 732,
  endSeconds: 822
}
,
{
  vid: '3LlL8Htw40w',
  startSeconds: 0,
  endSeconds: 196
}
,
{
  vid: '0EK6R2Xz3vo',
  startSeconds: 822,
  endSeconds: 921
}
,
{
  vid: 'WNYQrwP0KC8',
  startSeconds: 0,
  endSeconds: 193
}

];

//292 sem,346 noe,471 sybila,732 donebe,822 //nezapomínej,921​ pocity
var index = 0;
// 4. The API will call this function when the video player is ready.
function onPlayerReady(event) {
  event.target.cueVideoById({
    videoId: videos[index].vid,
    startSeconds: videos[index].startSeconds,
    endSeconds:...