I have an array of strings, and I want to define each of these strings a value. A simple illustration would be
varString = "Hello";
eval(varString + " = 9");
console.log(Hello);
Where I am expecting to get back 9 for Hello. Which is obviously working. But I am wondering if there is a neater version of that!
Now, you might be wondering why I am doing so! The main reason is that I am trying to "setPlaybackRate" for several embedded youtube videos in my HTML.
var player;
function onYouTubeIframeAPIReady() {
for (let index = 0; index < IDYT.length; index++) {
element = IDYT[index];
object1 = Objects1(youtubeVideo[index], YTtime[index]);
player = new YT.Player(element, object1);
}
}
where as you can see player is defined outside the function onYouTubeIframeAPIReady() each of Objects1 function and the IDYT are defined as follow
function Objects1(videoId1, startID1) {
let object1 = {
height: "315",
width: "560",
videoId: videoId1,
playerVars: {
autoplay: 0,
loop: 1,
start: startID1,
// mute: 1,
},
events: {
onStateChange: Test1,
},
};
return object1;
}
and
let IDYT = ["player", "player1"];
let youtubeVideo = ["00vnln25HBg", "E-xMXv3L5L8"];
let YTtime = [20, 456];
But the problem is when the event is initiated i.e. the function onPlayerStateChange given by:
function onPlayerStateChange() {
player.setPlaybackRate(1.5);
}
Only the last youtube video is having set playback rate of 1.5 which I did not expect. I think this is mainly that only the last player variable is defined. If I was able to do a loop of strings that are changed to variables that might help. I would really appreciate if you may give me guidance on how to solve this issue.
Many thanks in advance.
Helpful Links: https://developers.google.com/youtube/iframe_api_reference
Yes your intuition is correct that only the last player is being changed because others are overridden by the next player.
A very simplistic solution would be to have a players array maintained.
const players = [];
function onYouTubeIframeAPIReady() {
for (let index = 0; index < IDYT.length; index++) {
element = IDYT[index];
object1 = Objects1(youtubeVideo[index], YTtime[index]);
players.push(new YT.Player(element, object1));
}
}
// .....
// ......
function onPlayerStateChange() {
players.forEach((player) => player.setPlaybackRate(1.5));
}