Ecosyste.ms: Awesome

An open API service indexing awesome lists of open source software.

Awesome Lists | Featured Topics | Projects

https://github.com/Jasmin2895/web-monetized-video

experimenting with web monetisation API
https://github.com/Jasmin2895/web-monetized-video

javascript pay register video webcomponents webmonetization

Last synced: 3 months ago
JSON representation

experimenting with web monetisation API

Host: GitHub
URL: https://github.com/Jasmin2895/web-monetized-video
Owner: Jasmin2895
License: mit
Created: 2020-05-11T19:53:54.000Z (over 4 years ago)
Default Branch: master
Last Pushed: 2023-07-05T10:32:12.000Z (over 1 year ago)
Last Synced: 2024-07-05T14:43:59.380Z (4 months ago)
Topics: javascript, pay, register, video, webcomponents, webmonetization
Language: JavaScript
Size: 406 KB
Stars: 15
Watchers: 2
Forks: 2
Open Issues: 2
Metadata Files:
- Readme: README.md
- License: LICENSE
- Security: SECURITY.md

Awesome Lists containing this project

awesome-web-monetization - web-monetized-video - A web component with has play and pay policy and charges you for the amount of video watched. ![](assets/small_icons/javascript.png) (Resources / Packages)

README

# web-monetized-video
A web component which has play and pay policy and charges you for the amount of video watched. :smile: :dancer:

## Component:
* [``] - a component that allow the user to pay for the section of video watched.

## Installation
`` is a packaged javascript module.
> Modules are loaded asynchronulsy by browser, so for registering our component quickly we can load them in the head :thumbsup:

```html

```

## How to use
```html

```

### Parameters
* `width` - Width of the element
* `height` - Height of the element
* `url`- Link of the video. (Example- `https://www.html5rocks.com/en/tutorials/video/basics/Chrome_ImF.webm`)
* `monetization-link`- link to payment wallet of the user (Example- `$wallet.example.com/alice`)

### Events Listeners
| Events | Are |
| ------------- |:-------------:|
| `monetizationstart` | Determine when Web Monetization has started actively paying by adding an event listener for monetizationstart |
| `monetizationprogress` | Determine the current status of the payment stream by adding an event listener for monetizationprogress |
| `monetizationpending` |Determine when Web Monetization is enabled by adding an event listener for monetizationpending |
| `monetizationstop` | Determine when Web Monetization has stopped by adding an event listener for monetizationstop |

### Adding to your app via `npm`

```bash
npm install web-monetized-video --save
```

Include in your app javascript (e.g. src/App.js)
```js
import 'web-monetized-video';
```
This will register the custom elements with the browser so they can be used as HTML.

## LICENSE