https://github.com/yei-linux/usescreerecording-yl
Hook for recording an specific element on screen.
https://github.com/yei-linux/usescreerecording-yl
react typescript
Last synced: about 1 month ago
JSON representation
Hook for recording an specific element on screen.
- Host: GitHub
- URL: https://github.com/yei-linux/usescreerecording-yl
- Owner: Yei-Linux
- License: mit
- Created: 2020-09-02T04:43:41.000Z (over 5 years ago)
- Default Branch: master
- Last Pushed: 2020-09-02T14:59:06.000Z (over 5 years ago)
- Last Synced: 2025-01-19T08:35:29.696Z (over 1 year ago)
- Topics: react, typescript
- Language: TypeScript
- Homepage:
- Size: 266 KB
- Stars: 0
- Watchers: 2
- Forks: 0
- Open Issues: 0
-
Metadata Files:
- Readme: README.md
- License: LICENSE
Awesome Lists containing this project
README
useScreenRecording-yl
Hook for recording an specific element on screen
---
**Content**
* [Features](##features)
* [Install](##install)
* [Usage](##usage)
* [Exemples](##exemples)
* [Documentation](##documentation)
* [API](##Api)
* [Contributing](##contributing)
* [Maintainers](##maintainers)
## Features ✨
* Easy to use.
* Continuously Maintained.
## Install 🐙
You can install useRecording-yl by entering this command.
Click here for npm repository
```
npm i use-screen-recording-yl
```
## Usage 💡
This package is for recording element on screen and it will generate blob video and url video of recording.
## Exemples 🖍
```
const refContainer: any = useRef();
const {
urlVideoState,
blobVideoState,
ScreenRecording,
handleStartRecording,
handleStopRecording,
} = useScreenRecording();
...
const handleClickStart = () => {
setVisible(false);
handleStartRecording(
refContainer.current.getBoundingClientRect().x,
refContainer.current.getBoundingClientRect().y,
refContainer.current.getBoundingClientRect().width,
refContainer.current.getBoundingClientRect().height,
0, //By Default is 0
0, //By Default is 0
500,//By Default is 1500
500 //By Default is 500
);
};
const handleClickStop = () => {
handleStopRecording();
};
...
return (
Image for testing
Start Recording
Stop Recording
Show Video
...
);
```
## Contributing 🍰
Please make sure to read the [Contributing Guide]() before making a pull request.
Thank you to all the people who already contributed to this project!
## Maintainers 👷
## License ⚖️
Enter what kind of license you're using.
---
