diff --git a/extension/popup.js b/extension/popup.js index 6129efb..7043bfe 100644 --- a/extension/popup.js +++ b/extension/popup.js @@ -182,6 +182,8 @@ document.addEventListener("DOMContentLoaded", async () => { function createButtons(result) { let download = document.getElementById("download"); + let linkType = document.createElement("h3"); + linkType.innerText = result.youtube.type.charAt(0).toUpperCase() + result.youtube.type.slice(1); let title = document.createElement("p"); title.innerText = result.youtube.title; @@ -199,6 +201,7 @@ function createButtons(result) { subscribeButton.setAttribute("data-id", result.youtube.url); subscribeButton.addEventListener("click", function(){subscribeEvent()}, false); + download.appendChild(linkType); download.appendChild(title); download.appendChild(downloadButton); download.appendChild(subscribeButton); diff --git a/extension/script.js b/extension/script.js index 9057bc5..caa6da3 100644 --- a/extension/script.js +++ b/extension/script.js @@ -22,12 +22,41 @@ function getBrowser() { } +function detectUrlType(url) { + + const videoRe = new RegExp(/^https:\/\/(www\.)?(youtube.com\/watch\?v=|youtu\.be\/)\w{11}/); + if (videoRe.test(url)) { + return "video" + } + const channelRe = new RegExp(/^https:?\/\/www\.?youtube.com\/c|channel|user\/\w+(\/|featured|videos)?$/); + if (channelRe.test(url)) { + return "channel" + } + const playlistRe = new RegExp(/^https:\/\/(www\.)?youtube.com\/playlist\?list=/); + if (playlistRe.test(url)) { + return "playlist" + } + + return false + +} + + function sendUrl() { + let url = document.URL + + let urlType = detectUrlType(url); + if (urlType == false) { + console.log("not relevant") + return + } + let payload = { "youtube": { - "url": document.URL, - "title": document.title + "url": url, + "title": document.title, + "type": urlType, } } console.log("youtube link: " + JSON.stringify(payload)); diff --git a/extension/style.css b/extension/style.css index e272579..5da5b34 100644 --- a/extension/style.css +++ b/extension/style.css @@ -8,6 +8,10 @@ body { min-width: 300px; max-width: 400px; } +.h3 { + font-family: Sen-bold, sans-serif; + text-transform: capitalize; +} hr { height: 1px; color: white;