0
You are pointing error in generateThumbnail and appendchild, I am trying to create thumbnails of each video, and their links are in the href of the tag a, I want you to create the canvas inside the tag a or li, I tried to create counting each one and running the function for each one, but returns me the error
var time = 6;
var video = document.createElement("video");
var thumbs = document.querySelectorAll("#playlist li a");
for (var x = 0; x < thumbs.length; x++) {
video.addEventListener('loadeddata', function() {
video.currentTime = time;
}, false);
video.addEventListener('seeked', function() {
generateThumbnail(time);
}, false);
video.preload = "auto";
video.src = thumbs[x].href;
function generateThumbnail() {
var c = document.createElement("canvas");
var ctx = c.getContext("2d");
c.width = 160;
c.height = 90;
ctx.drawImage(video, 0, 0, 160, 90);
thumbs[x].appendChild(c);
}
}
<ul id="playlist">
<li><a href="http://blogger.com/video-play.mp4?contentId=203ac83dcf157d32" download="video">video 1</a></li>
<li><a href="http://blogger.com/video-play.mp4?contentId=1dbd2acf80b18d44" download="video">video 2</a></li>
<li><a href="http://blogger.com/video-play.mp4?contentId=5777446bc907a2be" download="video">video 3</a></li>
</ul>
javascript by: Mark Vaaz
var time = 10;
var video = document.createElement("video");
var thumbs = document.querySelectorAll("#playlist li a");
function t1() {
video.currentTime = time;
}
function t2() {
generateThumbnail(time);
}
for (let x = 0; x < thumbs.length; x++) {
video.addEventListener('loadeddata', t1, false);
video.addEventListener('seeked', t2, false);
video.preload = "auto";
video.src = thumbs[x].href;
function generateThumbnail() {
var c = document.createElement("canvas");
var ctx = c.getContext("2d");
c.width = 160;
c.height = 90;
ctx.drawImage(video, 0, 0, 160, 90);
thumbs[x].appendChild(c);
};
}
His problem is that he’s only creating from the last link
Which error is pointed ? Can give more details?
– Máttheus Spoo
João, explains +- what you want to do because you are setting the events of the video player, calling Thumbs[x] but it is inaccessible, your mistake is to use the wrong way to do what you want to do
– Leonardo Bonetti
If you explain what you want to do there we can solve this problem, only with the error there is no way.
– Leonardo Bonetti
I added an explanation +- (sorry for the delay, life ta race here kkk)
– João Victor
You should not use a function inside the looping, instead declare and function outside the looping
– Mark Vaaz
I tried to change here, but I haven’t had time try something like that code
– Mark Vaaz
worked well but only shows for a single, does not generate the other links
– João Victor