{"id":28473749,"url":"https://github.com/joaopaulovieira/clappr-queue-plugin","last_synced_at":"2025-07-02T02:31:01.971Z","repository":{"id":57199403,"uuid":"308942302","full_name":"joaopaulovieira/clappr-queue-plugin","owner":"joaopaulovieira","description":"A queue plugin for Clappr Player to play videos in sequence.","archived":false,"fork":false,"pushed_at":"2021-04-18T01:24:37.000Z","size":26351,"stargazers_count":5,"open_issues_count":1,"forks_count":1,"subscribers_count":1,"default_branch":"main","last_synced_at":"2025-06-07T12:35:52.171Z","etag":null,"topics":["clappr","clappr-player","clappr-plugin","clappr-plugins","playlist","queue","queueing","sequence"],"latest_commit_sha":null,"homepage":"","language":"JavaScript","has_issues":true,"has_wiki":null,"has_pages":null,"mirror_url":null,"source_name":null,"license":"bsd-3-clause","status":null,"scm":"git","pull_requests_enabled":true,"icon_url":"https://github.com/joaopaulovieira.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":"2020-10-31T18:00:52.000Z","updated_at":"2024-12-11T17:33:11.000Z","dependencies_parsed_at":"2022-09-16T15:01:26.304Z","dependency_job_id":null,"html_url":"https://github.com/joaopaulovieira/clappr-queue-plugin","commit_stats":null,"previous_names":[],"tags_count":2,"template":false,"template_full_name":null,"purl":"pkg:github/joaopaulovieira/clappr-queue-plugin","repository_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/joaopaulovieira%2Fclappr-queue-plugin","tags_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/joaopaulovieira%2Fclappr-queue-plugin/tags","releases_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/joaopaulovieira%2Fclappr-queue-plugin/releases","manifests_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/joaopaulovieira%2Fclappr-queue-plugin/manifests","owner_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/owners/joaopaulovieira","download_url":"https://codeload.github.com/joaopaulovieira/clappr-queue-plugin/tar.gz/refs/heads/main","sbom_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/joaopaulovieira%2Fclappr-queue-plugin/sbom","host":{"name":"GitHub","url":"https://github.com","kind":"github","repositories_count":263063894,"owners_count":23408007,"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":["clappr","clappr-player","clappr-plugin","clappr-plugins","playlist","queue","queueing","sequence"],"created_at":"2025-06-07T12:30:27.514Z","updated_at":"2025-07-02T02:31:01.960Z","avatar_url":"https://github.com/joaopaulovieira.png","language":"JavaScript","funding_links":[],"categories":[],"sub_categories":[],"readme":"[![](https://data.jsdelivr.com/v1/package/npm/clappr-queue-plugin/badge)](https://www.jsdelivr.com/package/npm/clappr-queue-plugin)\n[![](https://img.shields.io/npm/v/clappr-queue-plugin.svg?style=flat-square)](https://npmjs.org/package/clappr-queue-plugin)\n[![](https://img.shields.io/npm/dt/clappr-queue-plugin.svg?style=flat-square)](https://npmjs.org/package/clappr-queue-plugin)\n[![npm bundle size](https://img.shields.io/bundlephobia/min/clappr-queue-plugin?style=flat-square)](https://bundlephobia.com/result?p=clappr-queue-plugin)\n![Coveralls github](https://img.shields.io/coveralls/github/joaopaulovieira/clappr-queue-plugin?style=flat-square)\n![Travis (.com)](https://img.shields.io/travis/com/joaopaulovieira/clappr-queue-plugin?style=flat-square)\n[![](https://img.shields.io/github/license/joaopaulovieira/clappr-context-menu-plugin?style=flat-square)](https://github.com/joaopaulovieira/clappr-context-menu-plugin/blob/master/LICENSE)\n\n# Clappr queue plugin\n\u003cdiv align=center\u003e\u003cimg src=\"./public/images/queue.gif\"\u003e\u003c/div\u003e\n\n## Demo\nhttps://joaopaulovieira.github.io/clappr-queue-plugin/\n\n## Table of Contents\n- [Features](https://github.com/joaopaulovieira/clappr-queue-plugin#Features)\n- [Usage](https://github.com/joaopaulovieira/clappr-queue-plugin#Usage)\n- [Configuration](https://github.com/joaopaulovieira/clappr-queue-plugin#Configuration)\n- [API Documentation](https://github.com/joaopaulovieira/clappr-queue-plugin#API-Documentation)\n- [Development](https://github.com/joaopaulovieira/clappr-queue-plugin#Development)\n\n## Features\n### :clapper: Play videos in sequence\nThe first media in the queue starts immediately after the current media ends. The plugin provides one API to play any media in the queue in any order you want.\n\n### :memo: Set configs at plugin initialization\nDefine if the queue plugin plays the next video or just load.\n\n### :toolbox: Update video queue dynamically\nUse the plugin or player reference to add/remove videos in the queue.\n\n## Usage\nYou can use it from JSDelivr:\n```\nhttps://cdn.jsdelivr.net/npm/clappr-queue-plugin@latest/dist/clappr-queue-plugin.min.js\n```\nor as an npm package:\n```properties\n# Using yarn\nyarn add clappr-queue-plugin\n\n# Using npm\nnpm i clappr-queue-plugin\n```\n\nThen just add the `QueuePlugin` into the list of plugins of your player instance and set the media(s) to play in sequence on `queue.nextVideos` config:\n```javascript\nvar player = new Clappr.Player({\n  source: 'http://your.video/here.mp4',\n  plugins: [QueuePlugin],\n  queue: { nextVideos: ['http://another.video/here.mp4'] },\n});\n```\n\n## Configuration\nThe options for the plugin go in the `queue` property as shown below:\n```javascript\nvar player = new Clappr.Player({\n  source: 'http://your.video/here.mp4',\n  plugins: [QueuePlugin],\n  queue: {\n    nextVideos: ['http://another.video/here.mp4'],\n    autoPlayNextVideo: true,\n  },\n});\n```\n\n### `nextVideos {Array}`\nAn array where each item should be one video source URL.\n\n### `autoPlayNextVideo {Boolean}`\nDefines if the queue plugin should play the media after it's loaded. The plugin does not mutate the Clappr option `autoPlay`.\n\n## API Documentation\n\n### Plugin API\n| method | arguments | description |\n|--------|:---------:|-------------|\n| `plugin.appendVideo` | `URL` or `[URL, ...]` | Adds the video URL(s) at the end of the queue. |\n| `plugin.prependVideo` | `URL` or `[URL, ...]` | Adds the video URL(s) at the top of the queue. |\n| `plugin.popVideo` |  | Removes the video URL at the end of the queue. |\n| `plugin.shiftVideo` |  | Removes the video URL at the top of the queue. |\n| `plugin.playNextVideo` |  | Load and play (accordingly `autoPlayNextVideo` value) the video URL at the top of the queue. |\n| `plugin.playPosition` | `Number (position of the queue array)` | Load and play (accordingly `autoPlayNextVideo` value) the video URL related to the position in the queue. |\n| `plugin.playItem` | `URL` | Load and play (accordingly `autoPlayNextVideo` value) if the video URL is registered into the queue. |\n| `plugin.shuffleItems` |  | Sort the items in the queue randomly. |\n\n| getter | description | Response |\n|--------|-------------|:--------:|\n| `plugin.videoQueue` | Returns the video queue. | `[URL, ...]` |\n\n### Player API\n| method | arguments | description |\n|--------|:---------:|-------------|\n| `player.appendVideoOnQueue` | `URL` or `[URL, ...]` | A external interface to use `appendVideo` via player instance. |\n| `player.prependVideoOnQueue` | `URL` or `[URL, ...]` | A external interface to use `prependVideo` via player instance. |\n| `player.popVideoFromQueue` |  | A external interface to use `popVideo` via player instance. |\n| `player.shiftVideoFromQueue` |  | A external interface to use `shiftVideo` via player instance. |\n| `player.playNextVideoOnQueue` |  | A external interface to use `playNextVideo` via player instance. |\n| `plugin.playQueuePosition` | `Number (position of the queue array)` | A external interface to use `playPosition` via player instance. |\n| `plugin.playQueueItem` | `URL` | A external interface to use `playItem` via player instance. |\n| `plugin.shuffleQueueItems` |  | A external interface to use `shuffleItems` via player instance. |\n\n| getter | description | Response |\n|--------|-------------|:--------:|\n| `player.getVideoQueue` | Returns the video queue. | `[URL, ...]` |\n\n## Development\nInstall dependencies: `npm install`\n\nRun: `npm start`\n\nTest: `npm test`\n\nLint: `npm run lint`\n\nBuild: `npm run build`\n\nMinified version: `npm run release`\n","project_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Fjoaopaulovieira%2Fclappr-queue-plugin","html_url":"https://awesome.ecosyste.ms/projects/github.com%2Fjoaopaulovieira%2Fclappr-queue-plugin","lists_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Fjoaopaulovieira%2Fclappr-queue-plugin/lists"}