Skip to content

Commit

Permalink
Updating readme with yarn/npm instructions
Browse files Browse the repository at this point in the history
closes #75
  • Loading branch information
ctd1500 committed Aug 28, 2022
1 parent e500b0d commit 387b772
Show file tree
Hide file tree
Showing 3 changed files with 58 additions and 27 deletions.
1 change: 1 addition & 0 deletions .gitignore
Original file line number Diff line number Diff line change
Expand Up @@ -3,4 +3,5 @@ node_modules
build/*
dist/*
package-lock.json
yarn.lock
.github.json
78 changes: 54 additions & 24 deletions README.md
Original file line number Diff line number Diff line change
Expand Up @@ -6,6 +6,7 @@ videojs-hotkeys
- **[Usage](#usage)**
- [CDN version](#cdn-version)
- [Self hosted](#self-hosted)
- [Npm / Yarn package](#yarn--npm-package)
- **[Enable the plugin](#enable-the-plugin)**
- **[Options](#options)**
- **[Custom Hotkeys and Overrides](#custom-hotkeys-and-overrides)**
Expand Down Expand Up @@ -50,6 +51,19 @@ Or always load the latest version:
<script src="//cdn.sc.gl/videojs-hotkeys/latest/videojs.hotkeys.min.js"></script>
```

### Yarn / npm package
You can install the package:
```sh
yarn add videojs-hotkeys
# or npm
npm i videojs-hotkeys --save
```

Import it into your project:
```js
import "videojs-hotkeys";
```

### Self hosted
```html
<script src="/path/to/videojs.hotkeys.js"></script>
Expand All @@ -59,6 +73,18 @@ Or always load the latest version:
Add hotkeys to your Videojs ready function.
Check the [Options](#options) section below for the available options and their meaning.
```js
videojs('vidId', {
plugins: {
hotkeys: {
volumeStep: 0.1,
seekStep: 5,
enableModifiersForNumbers: false
},
},
});
```
or
```js
videojs('vidId').ready(function() {
this.hotkeys({
volumeStep: 0.1,
Expand Down Expand Up @@ -113,14 +139,16 @@ Any override functions that you build **must** return a boolean.
These allow you to change keys such as, instead of, or in addition to, "F" for Fullscreen, you can make Ctrl+Enter trigger fullscreen as well.
Example usage:
```js
videojs('vidId').ready(function() {
this.hotkeys({
volumeStep: 0.1,
fullscreenKey: function(event, player) {
// override fullscreen to trigger when pressing the F key or Ctrl+Enter
return ((event.which === 70) || (event.ctrlKey && event.which === 13));
}
});
videojs('vidId', {
plugins: {
hotkeys: {
volumeStep: 0.1,
fullscreenKey: function(event, player) {
// override fullscreen to trigger when pressing the F key or Ctrl+Enter
return ((event.which === 70) || (event.ctrlKey && event.which === 13));
}
},
},
});
```

Expand All @@ -131,25 +159,27 @@ videojs('vidId').ready(function() {
- `handler` (function): This function runs your custom code if the result of the `key` function was `true`.

```js
videojs('vidId').ready(function() {
this.hotkeys({
volumeStep: 0.1,
customKeys: {
// Create custom hotkeys
ctrldKey: {
key: function(event) {
// Toggle something with CTRL + D Key
return (event.ctrlKey && event.which === 68);
},
handler: function(player, options, event) {
// Using mute as an example
if (options.enableMute) {
player.muted(!player.muted());
videojs('vidId', {
plugins: {
hotkeys: {
volumeStep: 0.1,
customKeys: {
// Create custom hotkeys
ctrldKey: {
key: function(event) {
// Toggle something with CTRL + D Key
return (event.ctrlKey && event.which === 68);
},
handler: function(player, options, event) {
// Using mute as an example
if (options.enableMute) {
player.muted(!player.muted());
}
}
}
}
}
});
},
},
});
```
There are more usage examples available in the source code of the [example file](https://github.com/ctd1500/videojs-hotkeys/blob/master/example.html).
Expand Down
6 changes: 3 additions & 3 deletions package.json
Original file line number Diff line number Diff line change
Expand Up @@ -2,9 +2,10 @@
"name": "videojs-hotkeys",
"version": "0.2.27",
"description": "Adds more hotkey support to video.js",
"main": "videojs.hotkeys.min.js",
"author": "Chris Dougherty",
"license": "Apache-2.0",
"main": "videojs.hotkeys.js",
"types": "index.d.ts",
"repository": {
"type": "git",
"url": "https://github.com/ctd1500/videojs-hotkeys.git"
Expand All @@ -30,6 +31,5 @@
"scripts": {
"build": "grunt",
"release": "grunt release"
},
"types": "index.d.ts"
}
}

0 comments on commit 387b772

Please sign in to comment.