Skip to content

Instantly share code, notes, and snippets.

@low-ghost
Last active August 29, 2015 14:15
Show Gist options
  • Save low-ghost/74f84c8b876f6e4bbf77 to your computer and use it in GitHub Desktop.
Save low-ghost/74f84c8b876f6e4bbf77 to your computer and use it in GitHub Desktop.
Vanilla JS utils and example usage with the Brightcove API for IE 8 compatibility
//borrowed this indexOf polyfill from MDN
if (!Array.prototype.indexOf){
Array.prototype.indexOf = function(elt /*, from*/){
var len = this.length >>> 0;
var from = Number(arguments[1]) || 0;
from = (from < 0) ? Math.ceil(from) : Math.floor(from);
if (from < 0)
from += len;
for (; from < len; from++){
if (from in this && this[from] === elt)
return from;
}
return -1;
};
}
var utils = (function(){
return {
ajaxGet: function(url, cb, passVar){
var request = new XMLHttpRequest();
request.open('GET', url, true);
request.onreadystatechange = function(){
if (this.readyState === 4) {
if (this.status >= 200 && this.status < 400)
cb(request.responseText, passVar);
else
console.log("Something went wrong with the XMLHttpRequest!\nERROR: " + this.status);
}
};
request.send();
},
addListener: function(obj, type, fn){
if (obj.attachEvent){
obj['e'+type+fn] = fn;
obj[type+fn] = function(){
obj['e'+type+fn](window.event);
}
obj.attachEvent('on'+type, obj[type+fn]);
} else
obj.addEventListener(type, fn, false);
},
containsAll: function(haystack, needles){
var i = needles.length;
while (i--){
if (haystack.indexOf(needles[i]) === -1)
return false;
}
return true;
},
/*getChildren: function(el){
var children = [], i = el.children.length;
while (i--){
if (el.children[i].nodeType != 8)
children.unshift(el.children[i]);
}
return children;
},*/
ready: function(fn){
if (document.readyState != 'loading')
fn();
else if (document.addEventListener)
document.addEventListener('DOMContentLoaded', fn);
else {
document.attachEvent('onreadystatechange', function() {
if (document.readyState != 'loading')
fn();
});
}
},
wait: (function(originalArr, callback){
var self = this;
self.eventsArray = [];
self.varObj = {};
self.originalArr = originalArr;
return function(variable, functionName){
self.eventsArray.push(functionName);
self.varObj[functionName] = variable;
if (utils.containsAll(self.eventsArray, self.originalArr))
callback(self.varObj);
};
}),
}
})();
var BCL = {
onTemplateLoaded: function(id){
var api = brightcove.api,
modules = api.modules.APIModules;
this.player = api.getExperience(id);
this.exp = this.player.getModule(modules.EXPERIENCE);
this.con = this.player.getModule(modules.CONTENT);
},
onTemplateReady: function(){
BCL.videoPlayer = BCL.player.getModule(brightcove.api.modules.APIModules.VIDEO_PLAYER);
BCL.videoPlayer.getCurrentVideo(BCL.callbacks.temp);
},
callbacks: {
json: function(data){
var fake = document.createElement('div');
fake.innerHTML = data;
var json = JSON.parse(fake.getElementsByTagName('script')[0].innerHTML);
wait(json, "json");
},
ready: function(){
var links = document.getElementById("links");
wait(links, "ready");
},
temp: function(dto){
wait(dto.id, "temp");
},
loadLinks: function(varObj){
var linkData = varObj.json[varObj.temp],
i = linkData && linkData.length,
template = "";
while (i--)
template += '<li><a href="' + linkData[i].href + '" target="_blank">' + linkData[i].text + '</a></li>';
varObj.ready.innerHTML = template.length && template || "There are no links yet for this video";
},
executeAndListen: function(obj){
BCL.callbacks.loadLinks(obj);
//add event listener to player for change event
utils.addListener(BCL.videoPlayer, brightcove.api.events.MediaEvent.CHANGE, BCL.callbacks.loadLinks(obj));
}
}
};
//call immediately
var wait = new utils.wait(["json", "ready", "temp"], BCL.callbacks.executeAndListen);
utils.ajaxGet("some/url/json.html", BCL.callbacks.json);
utils.ready(BCL.callbacks.ready);
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment