<!DOCTYPE html>
<html>
<head>
<title>Adams Playground</title>
<meta name="generator" content="BBEdit 11.6" />
<script type="text/javascript" src="/js/ytautoplay.js" ></script>
<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.2.1/jquery.min.js"></script>
</head>
<!--the api specifies how it needs to be in the body tag, im not sure
if there is an external solutiuon to this-->
<body>
<script>
//class used from ecma 6 taught to me by Ben
//this is to avoid global variables to use multiple videos
class youtubeVideo {
//constructor takes a el for the first parameter
//takes the video id as the second parameter
//the third parameter is
constructor(eljselector, videoid, toggle) {
// https://developers.google.com/youtube/iframe_api_reference
//el is defined as a jQuery selector (getting the first in the array)
var el = $(eljselector).get(0);
//binding the player variable to the context of the class
//player defined as a YT class and player method.
this.player = new YT.Player( el, {
//videoid in constructor paramater used here
videoId: videoid,
//playersVars object with options
//autoplay yes, controls yes, related videos yes
playerVars: { 'autoplay': toggle, 'controls': 1, 'rel': 0 },
//events object options
});
}
}
//when the api has loaded create instance of my class
//taking the paramaters specified in the constructor
function onYouTubeIframeAPIReady() {
var toggle;
//change this id to the video you want to play
var vidid = "oHg5SJYRHA0"
var vidob = { vidid : 0 };
if (localStorage.getItem("store") && vidob.vidid == 1) {
toggle = 1;
console.log("this shouldn't play now");
}
else {
toggle = 1;
console.log("if the above condition isnt true, this should play now");
}
//create instances of the youtube video class.
new youtubeVideo(".my-class",...
Please Whitelist JSFiddle in your content blocker.
Help keep JSFiddle free for always by one of two ways:
Whitelist JSFiddle in your content blocker (two clicks)
Go PRO and get access to additional PRO features →
Join the 4+ million users, and keep the JSFiddle dream alive.
Ad-free
All ads in the editor and listing pages are turned completely off.
Use pre-released features
You get to try and use features (like the Palette Color Generator) months before everyone else.
Fiddle collections
Sort and categorize your Fiddles into multiple collections.
Private collections and fiddles
You can make as many Private Fiddles, and Private Collections as you wish!
Console
Debug your Fiddle with a minimal built-in JavaScript console.