Create a gist now

Instantly share code, notes, and snippets.

@kaganjd /index.js
Last active May 31, 2016

What would you like to do?
adding comments to min-vid core as a learning exercise
/*
* originally from https://github.com/meandavejustice/min-vid
*
* This Source Code is subject to the terms of the Mozilla Public License
* version 2.0 (the 'License'). You can obtain a copy of the License at
* http://mozilla.org/MPL/2.0/.
*/
// More on querystring and panel:
// https://developer.mozilla.org/en-US/Add-ons/SDK/High-Level_APIs/querystring
// https://developer.mozilla.org/en-US/Add-ons/SDK/High-Level_APIs/panel
const getVideoId = require('get-video-id');
const qs = require('sdk/querystring');
var panel = require("sdk/panel").Panel({ // Gets the SDK panel module
contentURL: "./default.html", // Declares panel content as default.html
contentScriptFile: "./controls.js", // Declares panel script as controls.js
width: 300,
height: 250,
position: {
bottom: 10,
left: 10
}
});
var { getActiveView } = require("sdk/view/core");
getActiveView(panel).setAttribute("noautohide", true);
// More on port (enables communication between scripts):
// https://developer.mozilla.org/en-US/Add-ons/SDK/Guides/Content_Scripts/using_port
panel.port.on('link', opts => { // Port.on receives input from user (how do you know to use 'opts' here?); corresponding content.js function is self.port.emit(link)
var title = opts.title;
if (title === 'send-to-tab') { // If user selects "send-to-tab"
const pageUrl = getPageUrl(url); // Declare pageUrl as getPageUrl function --> see getPageUrl function
if (pageUrl) require('sdk/tabs').open(pageUrl); // does this mean 'If pageUrl contains data' or 'If pageUrl = true' then 'put the URL in a tab'?
else console.log('could not parse page url for ', url); // Otherwise, log this note
panel.hide(); // Either way, hide the panel
} else if (title === 'close') { // If user selects "close"
updatePanel(''); // See updatePanel function
panel.hide(); // Hide the panel
}
});
// More on indexOf:
// https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/String/indexOf
function getPageUrl(url) {
let pageUrl = ''; // Declare pageUrl as a blank string
if (url.indexOf('youtube')) { // If url contains 'youtube'
pageUrl = 'https://youtube.com/watch?v=' + getVideoId(url); // pageUrl is 'string' + getVideoId
} else if(url.indexOf('vimeo')) { // If url contains 'vimeo'
pageUrl = 'https://vimeo.com/video/' + getVideoId(url); // pageUrl is 'string' + getVideoId
}
return pageUrl; // return the new pageUrl
}
var cm = require("sdk/context-menu");
cm.Item({
label: "Send to mini player",
context: cm.SelectorContext('[href*="youtube.com"], [href*="youtu.be"]'),
contentScript: "self.on('click', function (node, data) {" +
" self.postMessage(node.href);" +
"});",
onMessage: function(url) {
updatePanel(constructYoutubeEmbedUrl(url));
}
});
cm.Item({
label: "Send to mini player",
context: cm.SelectorContext('[href*="vimeo.com"]'),
contentScript: "self.on('click', function (node, data) {" +
" self.postMessage(node.href);" +
"});",
onMessage: function(url) {
updatePanel(constructVimeoEmbedUrl(url));
}
});
function updatePanel(url) {
panel.port.emit('set-video', url); // Port sends message to content script, controls.js, to set-video; corresponding function in controls.js is self.port.on('set-video', url)
panel.show(); // Show panel
}
function constructVimeoEmbedUrl(url) {
const params = qs.stringify({
autoplay: 1,
badge: 0,
byline: 0,
portrait: 0,
title: 0
});
return 'https://player.vimeo.com/video/' + getVideoId(url) + '?' + params;
}
// More on get-video-id on npm:
// https://www.npmjs.com/package/get-video-id
function constructYoutubeEmbedUrl(url) {
const params = qs.stringify({ // how do you know to include all this stuff? youtube iframe api?
autoplay: 0,
showinfo: 0,
controls: 0,
enablejsapi: 1,
modestbranding: 1
});
return "https://www.youtube.com/embed/" + getVideoId(url) + '?' + params;
}
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment