Skip to content

Firefox/Chrome extension to loop specified sections of videos. (Otherwise known as Video Section Loop)

License

Notifications You must be signed in to change notification settings

aprestoes/loopcontrol

Repository files navigation

Loop Control (Video Section Loop)

What does it do?

This extension loops user-specified sections of videos AND audio (enabled in settings). Instead of looping just from the end back to the beginning of the video, you can loop between any two points. Create a gif-like effect just within your browser!

Why?

Watching a cooking video/tricky guitar tutorial/play-of-the-game/awesome performance? Use Loop Control to only watch the parts you want.

How?

All HTML5 videos will display a moveable and hideable controller that indicates if loops are currently toggled on or off. Here you can set the start and end times of the sections you want to loop.

loopcontrol-example

You can also manually toggle LoopControl by right-clicking the video and selecting loop.

Default Keybindings (targets the last video controller you interacted with): Q - Set loop start E - Set loop end R - Toggle loop H - Hide controller

Development is focused primarily on Firefox.

Installation

Install from Addons.Mozilla.Org (AMO)

Install through the official Firefox Add-ons Web Store link.

Firefox Temporary Add-on (For testing purposes)

  1. Download this repo as a .zip file
  2. Unzip the file. The folder is loopcontrol-main
  3. Add the following to the file manifest.json (id value is arbitrary but must be unique):
"browser_specific_settings": {
    "gecko": {
      "id": "@aprestoes"
    }
  },
  1. In Firefox, go to about:debugging
  2. Click on This Firefox -> Load Temporary Add-on
  3. Select manifest.json within the loopcontrol-main folder

Chrome Temporary Add-on (For testing purposes)

  1. Download this repo as a .zip file
  2. Unzip the file. The folder is loopcontrol-main
  3. In Chrome, go to chrome://extensions
  4. Enable Developer Mode in the top-right
  5. Click 'Load unpacked extension...'
  6. Select the loopcontrol-main folder

Testing

  1. Change into the project directory with cd loopcontrol
  2. Install test dependencies with npm install
  3. Run the automated Jest tests with npm test

To-do

  • Remember video loop times
  • Switch to Manifest v3 once Firefox Stable implements it. Or make separate repo? Chrome Web Store only accept manifest v3.

Credit

Huge thanks to Video Speed Controller, the Firefox fork (seemingly abandoned) and the more updated gediminasel fork with a few helpful fixes. The loop UI and settings pages were adapted from these extensions.

Credit to Samplelib's videos for the test .mp4.

Extension icon created by Pixel perfect - Flaticon

Mockup assets used in extension listings from MockupDen and Shaping Rain

About

Firefox/Chrome extension to loop specified sections of videos. (Otherwise known as Video Section Loop)

Topics

Resources

License

Stars

Watchers

Forks