Chapter/timestamp support

[rigelk]

nota: this issue is the result of preliminary discussion that happened on framacolibri [in french]. Thanks to HerrNaja, Pouhiou and Chenille33!

Hello all,

Adding chapters to a video could be of great use for authors that want to pinpoint specific parts of a video:

• [x] much like in YT's use use case, where chapters are non-existant but timestamps can be reached via a GET attribute (e.g.: http://pouhioutube.com/masupervideo?t=6m22s ). Authors typically add the url(s) of each "chapter" with the corresponding parameters in the description afterwards. This isn't ideal but should definitely be easy to implement and put us on par with YT featurewise.

• [ ] with a WebVTT file given alongside the upload, or when editing the video object after the upload. (standard way to do, but the .vtt file has to be done beforehand in an editor…).

• [ ] with a simple timestamp given alongside the upload or when editing the video object after the upload. (simple to implement, as a third party plugin exists for video.js)

  

For either of the last two options, a visual way to make them stand out would be most welcome by authors. It would also put emphasis on structured videos:

I found this already implemented in chemoish/videojs-chapter-thumbnails's third party plugin for video.js.

[kevATin]

A while ago I started using SponsorBlock (https://github.com/ajayyy/SponsorBlock) and I thought to myself about how chapters could be used for so much more.

For example each chapter could (or would have to) be assigned to a chapter type by the uploader. Each video can have any number of chapters and chapters of the same type. These types could be: Intro (could be used for user/channel/series/etc intro(s); generally before the content chapters) Content (intended for any chapters featuring the video's main content) Outro (could be used for user/channel/series/etc outro(s); generally after the content chapters) Advertisement (could be used for sponsor spots or similar) Bumper (could be used for breaks between content chapters that are not advertisement, eg like those chibi mini clips some anime have; Wikipedia Miscellaneous (anything else that doesn't fit the other types) If we want to get really fancy we could also have a "Previously-On"-one , and a "Next-Time-On"-one.

The chapter list of a video could then look like this: XYZ_Group Intro (type intro) XYZ_Creator Intro (type intro) Introduction (type content) Theory (type content) Sponsor Spot A (type advertisement) Sponsor Spot B (type advertisement) Experiment (type content) XYZ_Creator Outro (type outro)

By categorizing chapters like this we can give users the ability to select which parts they want to see and which they don't. Users could for example set that they want to automatically skip all intro, outro, and advertisement chapters. Or just advertisements, or just intros, etc. This could then also be customized on a per channel basis. For example maybe you want to see intros and outros by default but have seen the ones from channel XYZ so often that they're annoying so you skip them. Or maybe you want to support a specific content creator so you choose to watch their advertisements.

Should there be separate types for sponsor ads, and personal ads (aka "buy my merch", "support me on patreon", etc)? Should there be a chapter type for self promotion like "follow me on twitter", "subscribe, like, comment", etc, or should that fall under personal ads, or none at all?

Instance administrators could require uploaders to mark all their intros, outros, and advertisements with the appropriate chapters. Monetization plugins that insert advertisements into videos could also work together with this system. Like said before, viewers could then skip ads, or not skip ads for creators they want to support.

Chapters that are set to skip based on your current settings should probably be shown in a different color on the video timeline. If a video has chapters that are skipped, the "new" time of the video should be shown next to the actual/full video length. A thought that occurred to me was to not even download chapters that a user has set to skip. But I believe this would be the wrong choice, because in the vast majority of cases it will only be rather small parts of the video that are skipped. Of course these would add up over time, but I am not sure if this is significant. Any effects on the webtorrent feature would also have to be considered. Also this could potentially mess with video pre-loading; what if a user decides that they want to jump right into a chapter that they skipped? That part would have to be loaded on the fly, giving the user loading times.

This might also be relevant to #473 since it could be used to mark individual chapters as sponsored ads.

[trymeouteh]

This is a new thing on YouTube and would be cool to see on Peertube for any video or audio. If Peertube could also get the chapters from the file when uploaded and allow the uploader to create and delete chapters would be cool.

[samlich]

I've created a plugin to do this https://www.npmjs.com/package/peertube-plugin-chapters (although you'll have to wait for v0.1.4 to be indexed by PeerTube as v0.1.3 doesn't have the dist folder). Chapters are entered in the plugins settings tab when editing a video. It uses video.js's chapter support which has a menu in the video menu bar.

It has SponsorBlock-like tags, in that they are flagged for other plugins. It does not show them in different colors on the timeline. I think it would make more sense to add segmented timeline support to video.js. The coloring could maybe be part of video.js, or part of this plugin.

It doesn't support uploading a vtt at the moment, although support can easily be added as it creates a WebVTT from the input.

Edit: And the validation and preview does not currently work on the publish page, but does work on the update page. Not sure why yet.

[quicktrick]

Hi @samlich! Is there any working example where to see your plugin in production? Does it work in embedded videos as well?

Edit I found a working link in the issues on your GitHub. The plugin works in the embedded videos, too.

[samlich]

Hi @samlich! Is there any working example where to see your plugin in production? Does it work in embedded videos as well?

I should probably put that somewhere, thanks for pointing that out. I'll embed a video in the readme in the next update, and on the webpage which I seem to have not linked anywhere in the repo.

[0lhi]

I would like it a lot if PeerTube would support Chapters via ffmetadatafiles:

;FFMETADATA1
major_brand=isom
minor_version=512
compatible_brands=isomiso2avc1mp41
encoder=Lavf58.29.100

[CHAPTER]
TIMEBASE=1/1000
START=0
END=3036999
title=1st Stream

[CHAPTER]
TIMEBASE=1/1000
START=3037000
END=6963999
title=2nd Stream

[CHAPTER]
TIMEBASE=1/1000
START=6964000
END=8097999
title=3rd Stream

That has the advantage that it can be included into the .mp4 directly, so a User who downloads the Video will have the Chapters available in a local video player.

Here https://ikyle.me/blog/2020/add-mp4-chapters-ffmpeg it's described how to add it with ffmpeg easily:

ffmpeg -i INPUT.mp4 -i FFMETADATAFILE -map_metadata 1 -codec copy OUTPUT.mp4

[abcdw]

There is already complete #1312, which adds hyperlinks for timecodes in the description. It would be really cool to generate chapters from those timestamps and have visual marks on progress line with small tooltip/label about a chapter.

[Chocobozzz]

Hi,

This feature is planned in our 2023 roadmap: https://joinpeertube.org/news/roadmap-v6 If you want to help to fund this feature, you can make a donation on https://support.joinpeertube.org

[Chocobozzz]

This feature has been implemented in https://github.com/Chocobozzz/PeerTube/commit/77b70702d2193d78bf6fbd07f0fc7335e34957f8 and will be available in PeerTube 6 planned at the end of the year :tada:

Chapters can be set using the web interface:

If not explicitly set by the user, PeerTube will try to import chapters from the video file (mkv for example) or from the remote website (using youtube-dl/yt-dlp).

Chapters are displayed in the player progress bar, on hover: