{"id":14385056,"url":"https://github.com/chemoish/videojs-chapter-thumbnails","last_synced_at":"2026-03-07T05:05:44.458Z","repository":{"id":57392242,"uuid":"40207129","full_name":"chemoish/videojs-chapter-thumbnails","owner":"chemoish","description":"Video.js plugin for supporting chapter thumbnails","archived":false,"fork":false,"pushed_at":"2018-02-05T04:33:17.000Z","size":21053,"stargazers_count":30,"open_issues_count":5,"forks_count":14,"subscribers_count":5,"default_branch":"master","last_synced_at":"2025-05-17T20:18:17.394Z","etag":null,"topics":[],"latest_commit_sha":null,"homepage":null,"language":"JavaScript","has_issues":true,"has_wiki":null,"has_pages":null,"mirror_url":null,"source_name":null,"license":"mit","status":null,"scm":"git","pull_requests_enabled":true,"icon_url":"https://github.com/chemoish.png","metadata":{"files":{"readme":"README.md","changelog":null,"contributing":null,"funding":null,"license":"LICENSE","code_of_conduct":null,"threat_model":null,"audit":null,"citation":null,"codeowners":null,"security":null,"support":null}},"created_at":"2015-08-04T20:21:02.000Z","updated_at":"2023-06-24T16:20:46.000Z","dependencies_parsed_at":"2022-09-09T22:04:38.173Z","dependency_job_id":null,"html_url":"https://github.com/chemoish/videojs-chapter-thumbnails","commit_stats":null,"previous_names":[],"tags_count":21,"template":false,"template_full_name":null,"purl":"pkg:github/chemoish/videojs-chapter-thumbnails","repository_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/chemoish%2Fvideojs-chapter-thumbnails","tags_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/chemoish%2Fvideojs-chapter-thumbnails/tags","releases_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/chemoish%2Fvideojs-chapter-thumbnails/releases","manifests_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/chemoish%2Fvideojs-chapter-thumbnails/manifests","owner_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/owners/chemoish","download_url":"https://codeload.github.com/chemoish/videojs-chapter-thumbnails/tar.gz/refs/heads/master","sbom_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/chemoish%2Fvideojs-chapter-thumbnails/sbom","host":{"name":"GitHub","url":"https://github.com","kind":"github","repositories_count":260672266,"owners_count":23044769,"icon_url":"https://github.com/github.png","version":null,"created_at":"2022-05-30T11:31:42.601Z","updated_at":"2022-07-04T15:15:14.044Z","host_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub","repositories_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories","repository_names_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repository_names","owners_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/owners"}},"keywords":[],"created_at":"2024-08-28T18:01:54.303Z","updated_at":"2026-03-07T05:05:44.422Z","avatar_url":"https://github.com/chemoish.png","language":"JavaScript","readme":"# videojs-chapter-thumbnails\n\n[![Build Status](https://travis-ci.org/chemoish/videojs-chapter-thumbnails.svg)](https://travis-ci.org/chemoish/videojs-chapter-thumbnails)\n\n\u003e Video.js plugin for supporting **WebVTT** chapter thumbnails.\n\n![Example](https://github.com/chemoish/videojs-chapter-thumbnails/blob/master/asset/img/example.png?raw=true)\n\n## Getting Started\n\n#### Include\n\n```html\n\u003c!-- optional: default styles --\u003e\n\u003clink href=\"/path/to/videojs.chapter-thumbnails.min.css\" rel=\"stylesheet\"\u003e\n\n\u003cscript src=\"/path/to/videojs.chapter-thumbnails.min.js\"\u003e\u003c/script\u003e\n```\n\n#### Enable\n\n```js\nvideojs('player_id').chapter_thumbnails({\n  src: '/path/to/chapters.vtt'\n});\n```\n\n\u003e Note: There are multiple ways to enable plugins. For more information, please visit [Video.js](https://github.com/videojs/video.js).\n\n## Options\n\n#### label\n\nType: `string`  \nDefault: `English`\n\n#### language\n\nType: `string`  \nDefault: `en`\n\n#### src\n\nType: `string`\n\n#### template\n\nType: `Function`  \nDefault:\n\n```js\ntemplate(cue = {}, textTrack) {\n  let cueText;\n\n  // NOTE: if `cue.text` isn't parseable, just send it through instead of blowing up.\n  // DRAGON: this probably opens up a possible script injection\n  try {\n    cueText = JSON.parse(cue.text || '{}');\n  } catch (e) {\n    cueText = cue.text;\n  }\n\n  const {\n    image,\n    title,\n  } = cueText;\n\n  const template = document.createElement('div');\n  template.className = 'vjs-chapters-thumbnails-item';\n\n  if (image) {\n    const img = document.createElement('img');\n    img.className = 'vjs-chapters-thumbnails-item-image';\n    img.src = image;\n\n    template.appendChild(img);\n  }\n\n  if (title) {\n    const span = document.createElement('span');\n    span.className = 'vjs-chapters-thumbnails-item-title';\n    span.innerHTML = title;\n\n    template.appendChild(span);\n  }\n\n  return template;\n},\n```\n\nProvides for custom chapter templating. Must return either `HTMLElement` or `string`.\n\n## Example WebVTT file\n\n\u003e Define chapters plugin by specifying a [WebVTT](http://dev.w3.org/html5/webvtt/) spec.\n\n```\nWEBVTT\n\nChapter 1\n00:00:00.000 --\u003e 00:00:10.000\n{\n  \"title\":\"Chapter 1\",\n  \"image\":\"asset/img/chapter_1.png\"\n}\n```\n\n## Contributing + Example\n\n```bash\nnpm install -g grunt-cli\n\nnpm install\n\nnpm start\n```\n\n## License\n\nCode licensed under [The MIT License](https://github.com/chemoish/videojs-chapter-thumbnails/blob/master/LICENSE).\n","funding_links":[],"categories":["JavaScript"],"sub_categories":[],"project_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Fchemoish%2Fvideojs-chapter-thumbnails","html_url":"https://awesome.ecosyste.ms/projects/github.com%2Fchemoish%2Fvideojs-chapter-thumbnails","lists_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Fchemoish%2Fvideojs-chapter-thumbnails/lists"}