Floating Video / Picture-in-Picture Mode Extension Chrome

Seamless video experience with floating video mode.

Latest Version

Version

0.0.0.1

Update

August 26, 2024

Size

6.12MiB

Developer

Floating Video / Picture-in-Picture Mode Extension

Seamless video experience with floating video mode. Simply click on the icon in your browser to begin. It is draggable, resizable, has a play/pause button, an exit button, and a return to tab button.

It uses built-in Google Chrome PIP API, so it should work on every website. However, unlike https://github.com/GoogleChromeLabs/picture-in-picture-chrome-extension, we do not run trackers that collects and sends data to Google Analytics or run pop-ups. Google tracks various user interactions such as page views, events, transactions, and social interactions on a website ultimately to improve their application, however, my code has removed all of that. Feel free to take a look at both -- the code is very similar (I ended up borrowing their variable names and structure after writing the first working draft of my code.)

Many websites use this type of code to support their own PIP player.

You don't have to give me credit for using this code.
https://github.com/jacobluanjohnston/Picture-in-Picture-Mode-for-Google-Chrome

Source Manifest.json

{"update_url": "https://clients2.google.com/service/update2/crx", "manifest_version": 3, "name": "Floating Video / Picture-in-Picture Mode", "description": "Seamless video experience with floating video mode.", "version": "0.0.0.1", "icons": { "64": "icons/icon64.png", "128": "icons/icon128.png" }, "action": { "default_icon": { "64": "icons/icon64.png", "128": "icons/icon128.png" } }, "commands": { "_execute_action": { "suggested_key": { "windows": "Alt+P", "mac": "Alt+P", "chromeos": "Alt+P", "linux": "Alt+P" } } }, "background": { "service_worker": "background.js" }, "content_scripts": [ { "matches": [""], "js": ["script.js"], "all_frames": true, "run_at": "document_start" } ], "host_permissions": [""], "permissions": ["scripting", "storage", "system.display"]}