Skip to content

Instantly share code, notes, and snippets.

@rikonor
Last active September 21, 2016 22:58
Show Gist options
  • Save rikonor/5e271c8c17a4930a0a4a507a6949a30e to your computer and use it in GitHub Desktop.
Save rikonor/5e271c8c17a4930a0a4a507a6949a30e to your computer and use it in GitHub Desktop.
Expand gifv links in github comments
// Override github CSP
function overrideGithubCSP() {
var mediaHosts = [
'http://i.imgur.com',
'https://i.imgur.com'
].join(' ');
function overrideDetails(details) {
for (var i = 0; i < details.responseHeaders.length; i++) {
var isCSPHeader = /content-security-policy/i.test(details.responseHeaders[i].name);
if (isCSPHeader) {
var csp = details.responseHeaders[i].value;
csp = csp.replace('media-src', 'media-src ' + mediaHosts);
details.responseHeaders[i].value = csp;
}
}
return { responseHeaders: details.responseHeaders };
}
var filter = {
urls: ['https://github.com/*'],
types: ["main_frame", "sub_frame"]
};
var ctxs = ['blocking', 'responseHeaders'];
chrome.webRequest.onHeadersReceived.addListener(overrideDetails, filter, ctxs);
}
overrideGithubCSP();
var gifvRegex = /^http.*gifv$/i;
function buildGifvVideoEmbed(gifvLink) {
var defaultVideo = "https://i.imgur.com/kMEYLEY.gifv";
// validate the given link
if (!gifvLink.match(gifvRegex)) {
console.log("Not a valid gifv link, falling back to default video..");
gifvLink = defaultVideo;
}
gifvLink = gifvLink.replace("gifv", "mp4");
console.log("Using " + gifvLink);
var sourceElem = document.createElement("source");
sourceElem.setAttribute("src", gifvLink);
sourceElem.setAttribute("type", "video/mp4");
var videoElem = document.createElement("video");
videoElem.appendChild(sourceElem);
// Set attrs
videoElem.setAttribute("muted", "");
videoElem.setAttribute("loop", "");
videoElem.setAttribute("poster", "");
videoElem.className = "res-media-zoomable";
videoElem.style["max-width"] = "1440px";
videoElem.style["max-height"] = "320px";
return videoElem;
}
function replaceGifvLinks(comments) {
console.log("Searching for comments in current page..")
var comments = document.getElementsByClassName("comment-body");
if (comments.length === 0) {
console.log("No comments found..");
return;
}
var comment = comments[0];
// Search for <a> tags
var anchors = comment.getElementsByTagName("a");
if (anchors.length === 0) {
console.log("No links in comment..");
return;
}
var anchor = anchors[0];
if (!anchor.href.match(gifvRegex)) {
console.log("Not a gifv link..");
return
}
// Add an element after the link
var newVideo = buildGifvVideoEmbed(anchor.href);
comment.appendChild(newVideo);
// Start all videos
newVideo.play();
}
console.log("replacing gifs");
replaceGifvLinks();
{
"manifest_version": 2,
"name": "github gifv support",
"description": "Add gifv support to github comments",
"version": "1.0",
"browser_action": {
"default_title": "Expend gifv files"
},
"permissions": [
"activeTab",
"webRequest",
"webRequestBlocking",
"https://github.com/*"
],
"background": {
"scripts": ["background.js"],
"persistent": true
},
"content_scripts": [
{
"matches": ["https://github.com/*"],
"js": ["gifv.js"]
}
]
}
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment