{"id":28490975,"url":"https://github.com/videojs/videojs-contextmenu-ui","last_synced_at":"2025-07-07T18:31:15.293Z","repository":{"id":45364253,"uuid":"63101450","full_name":"videojs/videojs-contextmenu-ui","owner":"videojs","description":"A cross-device context menu UI for video.js players.","archived":false,"fork":false,"pushed_at":"2022-12-16T20:12:26.000Z","size":2156,"stargazers_count":27,"open_issues_count":3,"forks_count":15,"subscribers_count":30,"default_branch":"main","last_synced_at":"2025-06-08T07:44:10.256Z","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":"other","status":null,"scm":"git","pull_requests_enabled":true,"icon_url":"https://github.com/videojs.png","metadata":{"files":{"readme":"README.md","changelog":"CHANGELOG.md","contributing":"CONTRIBUTING.md","funding":null,"license":"LICENSE","code_of_conduct":null,"threat_model":null,"audit":null,"citation":null,"codeowners":null,"security":null,"support":null}},"created_at":"2016-07-11T20:54:19.000Z","updated_at":"2025-02-12T10:49:52.000Z","dependencies_parsed_at":"2023-01-29T16:00:56.036Z","dependency_job_id":null,"html_url":"https://github.com/videojs/videojs-contextmenu-ui","commit_stats":null,"previous_names":[],"tags_count":14,"template":false,"template_full_name":null,"purl":"pkg:github/videojs/videojs-contextmenu-ui","repository_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/videojs%2Fvideojs-contextmenu-ui","tags_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/videojs%2Fvideojs-contextmenu-ui/tags","releases_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/videojs%2Fvideojs-contextmenu-ui/releases","manifests_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/videojs%2Fvideojs-contextmenu-ui/manifests","owner_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/owners/videojs","download_url":"https://codeload.github.com/videojs/videojs-contextmenu-ui/tar.gz/refs/heads/main","sbom_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/videojs%2Fvideojs-contextmenu-ui/sbom","host":{"name":"GitHub","url":"https://github.com","kind":"github","repositories_count":264130500,"owners_count":23562039,"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":"2025-06-08T07:30:56.261Z","updated_at":"2025-07-07T18:31:15.288Z","avatar_url":"https://github.com/videojs.png","language":"JavaScript","funding_links":[],"categories":[],"sub_categories":[],"readme":"# videojs-contextmenu-ui\n\n[![Build Status](https://travis-ci.org/brightcove/videojs-contextmenu-ui.svg?branch=master)](https://travis-ci.org/brightcove/videojs-contextmenu-ui)\n[![Greenkeeper badge](https://badges.greenkeeper.io/brightcove/videojs-contextmenu-ui.svg)](https://greenkeeper.io/)\n[![Slack Status](http://slack.videojs.com/badge.svg)](http://slack.videojs.com)\n\n[![NPM](https://nodei.co/npm/videojs-contextmenu-ui.png?downloads=true\u0026downloadRank=true)](https://nodei.co/npm/videojs-contextmenu-ui/)\n\nA cross-device context menu UI for video.js players.\n\n\u003e **Note:** Versions 4.x and lower of this plugin depended on the [videojs-contextmenu][contextmenu] plugin, but that plugin is not included with it. It must be included separately.\n\u003e\n\u003e Versions 5.x and newer does not use the videojs-contextmenu plugin, so do not include it. Versions 5.x and newer rely on the native `contextmenu` event.\n\nMaintenance Status: Stable\n\n\u003c!-- START doctoc generated TOC please keep comment here to allow auto update --\u003e\n\u003c!-- DON'T EDIT THIS SECTION, INSTEAD RE-RUN doctoc TO UPDATE --\u003e\n\n\n- [Installation](#installation)\n- [Usage](#usage)\n- [Options](#options)\n  - [`content`](#content)\n  - [`keepInside`](#keepinside)\n  - [`excludeElements`](#excludeelements)\n- [Inclusion](#inclusion)\n  - [`\u003cscript\u003e` Tag](#script-tag)\n  - [CommonJS/Browserify](#commonjsbrowserify)\n  - [RequireJS/AMD](#requirejsamd)\n- [License](#license)\n\n\u003c!-- END doctoc generated TOC please keep comment here to allow auto update --\u003e\n\n\n## Installation\n\n```sh\nnpm install --save videojs-contextmenu-ui\n```\n\n## Usage\n\nThe plugin is invoked as a method of a video.js `Player` object:\n\n```js\nplayer.contextmenuUI();\n```\n\nOnce the plugin is invoked, a modal will appear with a list of links when the `contextmenu` event is triggered on the `Player` object.\n\n## Options\n\nOptions may be passed to the plugin in a plain object:\n\n```js\nplayer.contextmenuUI({\n  content: [{\n\n    // A plain old link.\n    href: 'https://www.brightcove.com/',\n    label: 'Brightcove'\n  }, {\n\n    // A link with a listener. Its `href` will automatically be `#`.\n    label: 'Example Link',\n    listener: function() {\n      alert('you clicked the example link!');\n    }\n  }]\n});\n```\n\n### `content`\n\n**Required**\n**Type**: Array\n\nThe plugin requires that `content` be passed as an array. If it is not, an error will be thrown. The array should contain any number of objects which define a series of links that appear in the modal. These objects support the following properties:\n\n- `href`: Defines the value of the `href` attribute of the generated link.\n- `listener`: A function which will be bound to the `click` event of the generated link.\n- `label`: Text for the link.\n\n### `keepInside`\n\n**Type**: Boolean\n\nIf `true` (default), the context menu will be kept within the bounds of the player. If `false`, it may extend outside. When set to `false`, the menu would still stay within the player if the menu would otherwise extend outside the document body, including fullscreen players and players in an iframe.\n\n### `excludeElements`\n\n**Type**: Function\n**Parameters**: The DOM element that is being targeted\n**Returns**: Boolean | Returns `true` if the targeted element should be excluded from displaying context menu\n\nDefines which elements should be excluded from displaying the context menu. `input` and `textarea` elements are excluded by the default function.\n\n```js\nplayer.contextmenuUI({\n  ...\n  excludeElements: (targetEl) =\u003e {\n    const tagName = targetEl.tagName.toLowerCase();\n\n    return tagName === 'input';\n  }\n});\n```\n\n## Inclusion\n\nTo include videojs-contextmenu-ui on your website or web application, use any of the following methods.\n\n### `\u003cscript\u003e` Tag\n\nThis is the simplest case. Get the script in whatever way you prefer and include the plugin _after_ you include [video.js][videojs], so that the `videojs` global is available.\n\n```html\n\u003cscript src=\"//path/to/video.min.js\"\u003e\u003c/script\u003e\n\u003cscript src=\"//path/to/videojs-contextmenu-ui.min.js\"\u003e\u003c/script\u003e\n\u003cscript\u003e\n  var player = videojs('my-video');\n\n  player.contextmenuUI();\n\u003c/script\u003e\n```\n\n### CommonJS/Browserify\n\nWhen using with Browserify, install videojs-contextmenu-ui via npm and `require` the plugin as you would any other module.\n\n```js\nvar videojs = require('video.js');\n\n// The actual plugin function is exported by this module, but it is also\n// attached to the `Player.prototype`; so, there is no need to assign it\n// to a variable.\nrequire('videojs-contextmenu-ui');\n\nvar player = videojs('my-video');\n\nplayer.contextmenuUI();\n```\n\n### RequireJS/AMD\n\nWhen using with RequireJS (or another AMD library), get the script in whatever way you prefer and `require` the plugin as you normally would:\n\n```js\nrequire(['video.js', 'videojs-contextmenu-ui'], function(videojs) {\n  var player = videojs('my-video');\n\n  player.contextmenuUI();\n});\n```\n\n## License\n\nApache-2.0. Copyright (c) Brightcove, Inc.\n\n\n[contextmenu]: https://github.com/brightcove/videojs-contextmenu\n[videojs]: http://videojs.com/\n","project_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Fvideojs%2Fvideojs-contextmenu-ui","html_url":"https://awesome.ecosyste.ms/projects/github.com%2Fvideojs%2Fvideojs-contextmenu-ui","lists_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Fvideojs%2Fvideojs-contextmenu-ui/lists"}