The captain’s disciple algorithm course was too hard, so he had to watch the replay of each lesson repeatedly for several times. However, there was no video clip information when watching the replay, so he could not accurately find the position of a certain knowledge point he wanted to watch
I noticed that the video play page had a section for details of the clip, but I never saw the content inside
And then I thought, well, for all the lessons I’ve taken, I think I should give something back
If there is no money, then help the great saint to move bricks and make the video clip function, ha ha ha
So, it’s a shame.
Warehouse address github.com/MaShizhen/k…
Function demonstration
Obtain video clip information from warehouse and display. Click to rewind the playback
Click the + sign above to add a clip
The added fragment will be stored in localStorage and can be deleted
Click the image sharing icon 2 to automatically copy the fragment information.
Plug-in development and usage processes
- Run the project
yarn
npm run dev
Copy the code-
Open chrome extension Manager chrome://extensions/
-
Click on the upper left corner [Load unzipped extension] and then select the project root directory
-
Open classes course page, learn.kaikeba.com/video/xxxxx…
TODO LIST
- During the live broadcast, obtain the live broadcast time and maintain the fragment information
- The video progress bar displays clips
- Github CI, automatically merge fragment information
supplement
This is just the beginning. Plugin features and video clip data still need to be maintained by the community and students
Fragment data maintenance
The course directory stores fragment data and can be created by itself according to courses, chapters and summaries
The data format of the fragment file is
{
"id": "The value after the video id, i.e. https://learn.kaikeba.com/video/" ,
"fragments": [{"title": "Fragment Name"."timestamp": 100}}]Copy the code