diff --git a/README.md b/README.md
index ad509a3..2948588 100644
--- a/README.md
+++ b/README.md
@@ -1,19 +1,35 @@
-Tube Archivist Companion for your Browser
+Browser Extension for Tube Archivist
## Core Functionality
-A browser extension to bridge YouTube with [Tube Archivist](https://github.com/tubearchivist/tubearchivist). This extension allows you to do the following:
-- Add your Tube Archivist connection details in the addon popup
-- Add a download button to the popup for YouTube links
-- Add a subscribe button to subscribe to channels and playlists
+This is a browser extension to bridge YouTube with [Tube Archivist](https://github.com/tubearchivist/tubearchivist), your self hosted YouTube media server.
+- Add your Tube Archivist connection details in the addon popup.
+- On YouTube video pages, inject a download button to download that video and a subscribe button to subscribe to that channel.
+- On YouTube channel pages, inject a button to subscribe to the channel or download the complete channel.
+- Throughout most places, hover over the top left corner of a video thumbnail to reveal a download button for that video.
- Sync your cookies for yt-dlp.
-
+## Screenshots
+
+Popup to enter your connection details.
+
+
+
+Button injected on video page to download the video or subscribe to the channel.
+
+
+
+Download button injected showing when hovering over top left corned of thumbnail
+
+
+
+Channel button injected to subscribe or download whole channel, video download button showing when hovering over topleft corner of thumbnail.
+
## Install
- Firefox: The addon is available on the [Extension store](https://addons.mozilla.org/addon/tubearchivist-companion/).
@@ -23,35 +39,36 @@ A browser extension to bridge YouTube with [Tube Archivist](https://github.com/t
After a new release here on GitHub, you'll get updates automatically in your browser. Due to the verification process, for Firefox this usually takes 1-2 hours, for Chrome 2-3 days.
## Permissions
-- **Access your data for www.youtube.com**: Needed for the addon to know your current page on YouTube to send the link to Tube Archivist.
-- **Storage**: Needed to store your connection details, needed to store your last visited YouTube link within the browser.
+- **Access your data for www.youtube.com**: Needed to inject download and subscribe buttons directly into the page.
+- **Storage**: Needed to store your connection details.
- **Cookie**: Needed to read your cookies for youtube.com to access restricted videos.
## Setup
-- **URL**: This is where your Tube Archivist instance is located. Can be a host name or a IP address, use a full URL with protocol, e.g. *http://*.
-- **Port**: Network port of TA.
-- **API key**: You can find your API key on the settings page of your Tube Archivist instance.
+- **URL**: This is where your Tube Archivist instance is located. Can be a host name or an IP address. Add the port if needed at the end, e.g. `:8000`.
+- **API key**: You can find your API key on the settings page of your Tube Archivist instance.
A green checkmark will appear next to the *Save* button if your connection is working.
## Options
-- **Sync YouTube cookies**: Send your cookies to TubeArchivist to use for yt-dlp requests.
+- **Sync YouTube cookies**: Send your cookies to TubeArchivist to use for yt-dlp requests.
## Test this extension
Use the correct manifest file for your browser. Either rename the browser specific file to `manifest.json` before loading the addon or symlink it to the correct location, e.g. `ln -s manifest-firefox.json manifest.json`.
- Firefox
- Open `about:debugging#/runtime/this-firefox`
- Click on *Load Temporary Add-on*
- - Select the *manifest.json* file to load the addon.
+ - Select the *manifest.json* file to load the addon.
+ - You can *inspect* background.js by lunching the debug tools from there.
- Chrome / Chromium
- Open `chrome://extensions/`
- Toggle *Developer mode* on top right
- Click on *Load unpacked*
- Open the folder containing the *manifest.json* file.
+ - Click on *Service Worker* to open the dev tools at background.js.
## Compatibility
-- Verify that you are running the latest version of Tube Archivist as the API is under development and will change.
-- For testing this extension between releases, use the *unstable* builds of Tube Archivist, only for your tesing environment.
+- Verify that you are running the [latest version](https://github.com/tubearchivist/tubearchivist/releases/latest) of Tube Archivist as the API is under development and will change.
+- For testing this extension between releases, use the *unstable* builds of Tube Archivist, only for your testing environment.
## Roadmap
Join us on [Discord](https://discord.gg/AFwz8nE7BK) and help us improve and extend this project. This is a list of planned features, in no particular order:
@@ -60,3 +77,4 @@ Join us on [Discord](https://discord.gg/AFwz8nE7BK) and help us improve and exte
- [ ] Implement download/subscribe button for playlists
- [ ] Implement download button for videos on playlist
- [ ] Error handling for connection errors
+- [X] Dynamically inject buttons with mutation observer
diff --git a/assets/icon-128x128.png b/assets/icon-128x128.png
new file mode 100644
index 0000000..cefd1ee
Binary files /dev/null and b/assets/icon-128x128.png differ
diff --git a/assets/screenshot-channel.png b/assets/screenshot-channel.png
new file mode 100644
index 0000000..007d6ad
Binary files /dev/null and b/assets/screenshot-channel.png differ
diff --git a/assets/screenshot-search.png b/assets/screenshot-search.png
new file mode 100644
index 0000000..955ddee
Binary files /dev/null and b/assets/screenshot-search.png differ
diff --git a/assets/screenshot-video.png b/assets/screenshot-video.png
new file mode 100644
index 0000000..b6bcfb5
Binary files /dev/null and b/assets/screenshot-video.png differ
diff --git a/assets/screenshot.png b/assets/screenshot.png
index 43d3387..9a542c5 100644
Binary files a/assets/screenshot.png and b/assets/screenshot.png differ
diff --git a/assets/social-preview-1400x560.png b/assets/social-preview-1400x560.png
index 0da72d6..b1be592 100644
Binary files a/assets/social-preview-1400x560.png and b/assets/social-preview-1400x560.png differ
diff --git a/assets/social-preview-440x280.png b/assets/social-preview-440x280.png
index 7e1cd85..87187e0 100644
Binary files a/assets/social-preview-440x280.png and b/assets/social-preview-440x280.png differ
diff --git a/assets/social-preview-920x680.png b/assets/social-preview-920x680.png
index b73b19c..c18f1ef 100644
Binary files a/assets/social-preview-920x680.png and b/assets/social-preview-920x680.png differ
diff --git a/assets/social-preview.png b/assets/social-preview.png
index c400131..91fb382 100644
Binary files a/assets/social-preview.png and b/assets/social-preview.png differ
diff --git a/assets/tube-archivist-companion-banner.png b/assets/tube-archivist-companion-banner.png
index cecdc7a..564e7d5 100644
Binary files a/assets/tube-archivist-companion-banner.png and b/assets/tube-archivist-companion-banner.png differ
