diff --git a/.gitignore b/.gitignore
index ceaea36..64fc9a4 100644
--- a/.gitignore
+++ b/.gitignore
@@ -129,4 +129,4 @@ dist
 .yarn/build-state.yml
 .yarn/install-state.gz
 .pnp.*
-
+.DS_store
diff --git a/README.md b/README.md
index 2f14d82..d0adf3f 100644
--- a/README.md
+++ b/README.md
@@ -1,2 +1,3 @@
 # ytdlp-bot-chromeaddon
 
+I mean it's almost selfexplained what this is for and what it does.
\ No newline at end of file
diff --git a/pack.sh b/pack.sh
new file mode 100644
index 0000000..ead0063
--- /dev/null
+++ b/pack.sh
@@ -0,0 +1,2 @@
+#!/bin/sh
+# TODO
\ No newline at end of file
diff --git a/src/assets/icon.jpg b/src/assets/icon.jpg
new file mode 100644
index 0000000..a668c96
Binary files /dev/null and b/src/assets/icon.jpg differ
diff --git a/src/manifest.json b/src/manifest.json
new file mode 100644
index 0000000..48bdc82
--- /dev/null
+++ b/src/manifest.json
@@ -0,0 +1,33 @@
+{
+    "manifest_version": 3,
+    "name": "DC-YTDLP",
+    "description": "--",
+    "version": "1.0",
+    "action": {
+      "default_popup": "views/popup.html",
+      "default_icon": "assets/icon.jpg"
+    },
+    "icons":{
+      "16":"assets/icon.jpg",
+      "48":"assets/icon.jpg",
+      "128":"assets/icon.jpg"
+    },
+    "side_panel":{
+        "default_path":"views/sidepanel.html"
+    },
+    "permissions":[
+        "storage",
+        "sidePanel",
+        "activeTab",
+        "tabs"
+    ],
+    "content_scripts": [
+        {
+          "js": ["scripts/com.youtube.js"],
+          "matches": [
+            "https://www.youtube.com/*",
+            "https://youtube.com/*"
+          ]
+        }
+      ]
+  }
\ No newline at end of file
diff --git a/src/scripts/com.youtube.js b/src/scripts/com.youtube.js
new file mode 100644
index 0000000..5436207
--- /dev/null
+++ b/src/scripts/com.youtube.js
@@ -0,0 +1,22 @@
+setTimeout(function(){
+    let menu = document.getElementById("center");
+    let dl_send = document.createElement("button");
+    dl_send.innerText = "TEst";
+    //menu.append(dl_send)
+
+    dl_send.addEventListener("click",sendLink);
+
+    async function sendLink(){
+        let url = window.location;
+        let u = (await chrome.storage.sync.get("settings_url")).settings_url;
+        alert(url);
+        fetch(u,{
+            method:"POST",
+            body:{
+                url:url,
+                type:"mp3"
+            }
+        })
+    }
+},2000)
+
diff --git a/src/scripts/popup.js b/src/scripts/popup.js
new file mode 100644
index 0000000..1912241
--- /dev/null
+++ b/src/scripts/popup.js
@@ -0,0 +1,45 @@
+let btn_sendURL;
+let btn_sendURL_mp4;
+let alertBox;
+
+function startUp() {
+    btn_sendURL = document.getElementById("sendURL");
+    btn_sendURL_mp4 = document.getElementById("sendURL_mp4");
+    alertBox = document.getElementById("alerts")
+
+    btn_sendURL.addEventListener("click", sendURL);
+    btn_sendURL_mp4.addEventListener("click", sendURL_mp4)
+}
+
+async function sendURL() {
+    sendLink("mp3");
+}
+async function sendURL_mp4() {
+    sendLink("mp4");
+}
+
+async function sendLink(type) {
+    let tab = await chrome.tabs.query({ windowType: "normal", active: true });
+    let url = tab[0].url;
+    let u = (await chrome.storage.sync.get("settings_url")).settings_url;
+    //alert(url);
+    let resp = await fetch(`${u}/getSong`, {
+        method: "POST",
+        headers: {
+            "content-type": "application/puppy+json",
+            // 'Content-Type': 'application/x-www-form-urlencoded',
+        },
+        body: JSON.stringify({
+            url: url,
+            type: type
+        })
+    });
+    let json_resp = await resp.json();
+    alertBox.innerHTML = `<div class="alert">${json_resp.text}</div>`;
+    btn_sendURL.disabled = true;
+    btn_sendURL_mp4.disabled = true;
+
+}
+
+
+startUp();
\ No newline at end of file
diff --git a/src/scripts/settings.js b/src/scripts/settings.js
new file mode 100644
index 0000000..c71f8df
--- /dev/null
+++ b/src/scripts/settings.js
@@ -0,0 +1,31 @@
+let urlField;
+let saveButton;
+let testButton;
+
+async function startUp(){
+    urlField = document.getElementById("url");
+    saveButton = document.getElementById("save");
+    testButton = document.getElementById("testButton")
+    
+    saveButton.addEventListener("click",saveSettings)
+    testButton.addEventListener("click",Test)
+
+    urlField.value = (await chrome.storage.sync.get("settings_url")).settings_url;
+}
+
+function saveSettings(){
+    let tmp_val = urlField.value;
+
+    chrome.storage.sync.set({ "settings_url": tmp_val });
+    alert(`Save - ${tmp_val}`);
+}
+
+function Test(){
+    chrome.tabs.query({active: true, lastFocusedWindow: true}, tabs => {
+        let url = tabs[0].url;
+        alert(url);
+        // use `url` here inside the callback because it's asynchronous!
+    });
+}
+
+startUp();
\ No newline at end of file
diff --git a/src/views/popup.html b/src/views/popup.html
new file mode 100644
index 0000000..ad7b8d4
--- /dev/null
+++ b/src/views/popup.html
@@ -0,0 +1,47 @@
+<!DOCTYPE html>
+<html lang="en">
+
+<head>
+    <meta charset="UTF-8">
+    <meta name="viewport" content="width=device-width, initial-scale=1.0">
+    <title>Hi</title>
+    <style>
+        html {
+            min-height: 50px;
+            min-width: 300px;
+            background:#121212;
+        }
+        button{
+            width:calc(100% - 10px);
+            padding:5px;
+            margin:5px;
+            background-color:#00A6A6;
+            color:#FFF;
+            transition: cubic-bezier(0.075, 0.82, 0.165, 1) .5s;
+        }
+        button:hover{
+            transition: cubic-bezier(0.075, 0.82, 0.165, 1) .5s;
+            text-decoration: underline;
+            background-color: #009696;
+        }
+        button:disabled{
+            background-color: #676767;
+        }
+        .alert{
+            border: 1px solid #DD0000;
+            background-color: #414141;
+            color: #FFF;
+        }
+    </style>
+</head>
+
+<body>
+    <button id="sendURL">Send URL - get MP3</button>
+    <button id="sendURL_mp4">Send URL - get MP4</button>
+    <div id="alerts">
+
+    </div>
+    <script src="../scripts/popup.js"></script>
+</body>
+
+</html>
\ No newline at end of file
diff --git a/src/views/sidepanel.html b/src/views/sidepanel.html
new file mode 100644
index 0000000..e186619
--- /dev/null
+++ b/src/views/sidepanel.html
@@ -0,0 +1,24 @@
+<!DOCTYPE html>
+<html lang="en">
+<head>
+    <meta charset="UTF-8">
+    <meta name="viewport" content="width=device-width, initial-scale=1.0">
+    <title>Document</title>
+    <style>
+        html{min-height:300px;min-width:600px}
+        body{
+            width:600px;
+            min-width: 600px;
+        }
+    </style>
+</head>
+<body>
+    <div>
+        URL:<input type="text" id="url"><button id="save">Save</button>
+
+        <br/>
+        <button id="testButton">Test</button>
+    </div>
+    <script src="../scripts/settings.js"></script>
+</body>
+</html>
\ No newline at end of file