{"id":15019005,"url":"https://github.com/mintplayer/mintplayer-ng-video-player","last_synced_at":"2025-10-24T01:31:04.075Z","repository":{"id":57127739,"uuid":"381004004","full_name":"MintPlayer/mintplayer-ng-video-player","owner":"MintPlayer","description":"Video player component for angular","archived":false,"fork":false,"pushed_at":"2024-10-18T20:38:14.000Z","size":27656,"stargazers_count":2,"open_issues_count":5,"forks_count":2,"subscribers_count":2,"default_branch":"master","last_synced_at":"2024-10-29T22:31:20.217Z","etag":null,"topics":["angular","dailymotion","soundcloud","video-player","vimeo","youtube"],"latest_commit_sha":null,"homepage":"https://video-player.mintplayer.com","language":"TypeScript","has_issues":true,"has_wiki":null,"has_pages":null,"mirror_url":null,"source_name":null,"license":null,"status":null,"scm":"git","pull_requests_enabled":true,"icon_url":"https://github.com/MintPlayer.png","metadata":{"files":{"readme":"README.md","changelog":null,"contributing":null,"funding":null,"license":null,"code_of_conduct":null,"threat_model":null,"audit":null,"citation":null,"codeowners":null,"security":null,"support":null,"governance":null,"roadmap":null,"authors":null,"dei":null,"publiccode":null,"codemeta":null}},"created_at":"2021-06-28T11:16:04.000Z","updated_at":"2024-10-17T20:18:47.000Z","dependencies_parsed_at":"2024-11-06T19:05:07.812Z","dependency_job_id":"20f14f43-5109-4fd6-8b69-75b84c23a3d7","html_url":"https://github.com/MintPlayer/mintplayer-ng-video-player","commit_stats":{"total_commits":208,"total_committers":2,"mean_commits":104.0,"dds":0.05288461538461542,"last_synced_commit":"d7fe52280c03c091a0139c96ae9e538ca4c9c8ae"},"previous_names":[],"tags_count":0,"template":false,"template_full_name":null,"repository_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/MintPlayer%2Fmintplayer-ng-video-player","tags_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/MintPlayer%2Fmintplayer-ng-video-player/tags","releases_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/MintPlayer%2Fmintplayer-ng-video-player/releases","manifests_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/MintPlayer%2Fmintplayer-ng-video-player/manifests","owner_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/owners/MintPlayer","download_url":"https://codeload.github.com/MintPlayer/mintplayer-ng-video-player/tar.gz/refs/heads/master","host":{"name":"GitHub","url":"https://github.com","kind":"github","repositories_count":237901410,"owners_count":19384384,"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":["angular","dailymotion","soundcloud","video-player","vimeo","youtube"],"created_at":"2024-09-24T19:52:44.939Z","updated_at":"2025-10-24T01:30:54.063Z","avatar_url":"https://github.com/MintPlayer.png","language":"TypeScript","funding_links":[],"categories":[],"sub_categories":[],"readme":"# @mintplayer/ng-video-player\n## Demo\n\nA working demo application can be found here:\n- [Angular demo](https://video-player.mintplayer.com)\n- [React demo](https://react.video-player.mintplayer.com)\n\nThe code is included in the git repository.\n\n## Version info\n\n| License      | Build status | Code coverage |\n|--------------|--------------|---------------|\n| [![License](https://img.shields.io/badge/License-Apache%202.0-green.svg)](https://opensource.org/licenses/Apache-2.0) | [![master](https://github.com/MintPlayer/mintplayer-ng-video-player/actions/workflows/publish-master.yml/badge.svg)](https://github.com/MintPlayer/mintplayer-ng-video-player/actions/workflows/publish-master.yml) | [![codecov](https://codecov.io/gh/MintPlayer/mintplayer-ng-video-player/branch/master/graph/badge.svg?token=X0G8OV053U)](https://codecov.io/gh/MintPlayer/mintplayer-ng-video-player) |\n\n| Package                             | Version                                                                                                                                                |\n|-------------------------------------|--------------------------------------------------------------------------------------------------------------------------------------------------------|\n| @mintplayer/player-progress      | [![npm version](https://badge.fury.io/js/%40mintplayer%2Fplayer-progress.svg)](https://badge.fury.io/js/%40mintplayer%2Fplayer-progress)         |\n| @mintplayer/youtube-player       | [![npm version](https://badge.fury.io/js/%40mintplayer%2Fyoutube-player.svg)](https://badge.fury.io/js/%40mintplayer%2Fyoutube-player)           |\n| @mintplayer/vimeo-player         | [![npm version](https://badge.fury.io/js/%40mintplayer%2Fvimeo-player.svg)](https://badge.fury.io/js/%40mintplayer%2Fvimeo-player)               |\n| @mintplayer/soundcloud-player    | [![npm version](https://badge.fury.io/js/%40mintplayer%2Fsoundcloud-player.svg)](https://badge.fury.io/js/%40mintplayer%2Fsoundcloud-player)     |\n| @mintplayer/spotify-player       | [![npm version](https://badge.fury.io/js/%40mintplayer%2Fspotify-player.svg)](https://badge.fury.io/js/%40mintplayer%2Fspotify-player)           |\n| @mintplayer/twitch-player        | [![npm version](https://badge.fury.io/js/%40mintplayer%2Ftwitch-player.svg)](https://badge.fury.io/js/%40mintplayer%2Fng-twitch-player)             |\n| @mintplayer/facebook-player      | [![npm version](https://badge.fury.io/js/%40mintplayer%2Ffacebook-player.svg)](https://badge.fury.io/js/%40mintplayer%2Ffacebook-player)         |\n| @mintplayer/mixcloud-player      | [![npm version](https://badge.fury.io/js/%40mintplayer%2Fmixcloud-player.svg)](https://badge.fury.io/js/%40mintplayer%2Fmixcloud-player)         |\n| @mintplayer/streamable-player    | [![npm version](https://badge.fury.io/js/%40mintplayer%2Fstreamable-player.svg)](https://badge.fury.io/js/%40mintplayer%2Fstreamable-player)     |\n| @mintplayer/vidyard-player       | [![npm version](https://badge.fury.io/js/%40mintplayer%2Fvidyard-player.svg)](https://badge.fury.io/js/%40mintplayer%2Fvidyard-player)           |\n| @mintplayer/wistia-player        | [![npm version](https://badge.fury.io/js/%40mintplayer%2Fwistia-player.svg)](https://badge.fury.io/js/%40mintplayer%2Fwistia-player)             |\n| @mintplayer/file-player          | [![npm version](https://badge.fury.io/js/%40mintplayer%2Ffile-player.svg)](https://badge.fury.io/js/%40mintplayer%2Ffile-player)                 |\n| @mintplayer/playlist-controller  | [![npm version](https://badge.fury.io/js/%40mintplayer%2Fplaylist-controller.svg)](https://badge.fury.io/js/%40mintplayer%2Fplaylist-controller) |\n| @mintplayer/video-player         | [![npm version](https://badge.fury.io/js/%40mintplayer%2Fvideo-player.svg)](https://badge.fury.io/js/%40mintplayer%2Fvideo-player)               |\n| @mintplayer/ng-video-player         | [![npm version](https://badge.fury.io/js/%40mintplayer%2Fng-video-player.svg)](https://badge.fury.io/js/%40mintplayer%2Fng-video-player)               |\n\n## Important note\n\nSince version 16.1, the dependency graph between the project has changed.\nThe `ng-video-player` package no longer depends on `ng-youtube-player`, `ng-vimeo-player` and `ng-soundcloud-player`. But now it's the other way around. See the installation instructions below for the updated packages.\n\n## Installation\n\nRun the corresponding commands, depending on what players you want to support in your application:\n\n    npm i @mintplayer/ng-video-player\n\n    npm i @mintplayer/youtube-player\n    npm i @mintplayer/vimeo-player\n    npm i @mintplayer/soundcloud-player\n    npm i @mintplayer/spotify-player\n    npm i @mintplayer/twitch-player\n    npm i @mintplayer/facebook-player\n    npm i @mintplayer/mixcloud-player\n    npm i @mintplayer/streamable-player\n    npm i @mintplayer/vidyard-player\n    npm i @mintplayer/wistia-player\n    npm i @mintplayer/file-player\n\n## Usage\nImport the modules for which you want to support a player:\n\n```ts\n@NgModule({\n    ...,\n    imports: [\n        ...,\n        VideoPlayerComponent,\n    ]\n    providers: [\n        provideVideoApis(\n            youtubePlugin,\n            vimeoPlugin,\n            soundCloudPlugin,\n            mixCloudPlugin,\n            twitchPlugin,\n            spotifyPlugin,\n            streamablePlugin,\n            facebookPlugin,\n            filePlugin,\n            vidyardPlugin,\n            wistiaPlugin\n        )\n    ]\n})\n```\n\nUse the component in the template:\n\n```html\n\u003cvideo-player [width]=\"width\" [height]=\"height\" [autoplay]=\"true\"\n    [(volume)]=\"volume\" [(mute)]=\"isMuted\" [(playerState)]=\"playerState\"\n    (progressChange)=\"onProgressChange($event)\" (isPipChange)=\"isPip = $event\" #player1\u003e\u003c/video-player\u003e\n\n```\n\n```ts\n@ViewChild('player1') player1!: VideoPlayerComponent;\nplayVideo(video: string) {\n    // This will replay the video when the url is the same.\n    this.player1.setUrl(video);\n\n    return false;\n}\n```\n\nOr use the `url` input binding:\n\n```html\n\u003cvideo-player [width]=\"width\" [height]=\"height\" [autoplay]=\"true\" [url]=\"url\"\n    [(volume)]=\"volume\" [(mute)]=\"isMuted\" [(playerState)]=\"playerState\"\n    (progressChange)=\"onProgressChange($event)\" (isPipChange)=\"isPip = $event\"\u003e\u003c/video-player\u003e\n\n```\n\n```ts\nurl: string | null = null;\nplayVideo(video: string) {\n    // This will not replay the video when the url is the same.\n    this.url = video;\n    return false;\n}\n```\n\n## Components\nAll components are showcased in the angular app included in the project. You can simply run\n\n    npm start -- --open\n\nto discover them.\n\n## Discover yourself\nMake sure you have [NodeJS](https://nodejs.org/en/download/) installed.\nThen run following commands\n\n    git clone https://github.com/MintPlayer/mintplayer-ng-video-player\n    npm i\n    npm start -- --open\n\n## Docker image\nYou can run the docker image which is published to the GitHub Container Registry\n\n    docker run -p 4200:80 ghcr.io/mintplayer/mintplayer-ng-video-player:master\n\nand visit [http://localhost:4200](http://localhost:4200).\n","project_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Fmintplayer%2Fmintplayer-ng-video-player","html_url":"https://awesome.ecosyste.ms/projects/github.com%2Fmintplayer%2Fmintplayer-ng-video-player","lists_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Fmintplayer%2Fmintplayer-ng-video-player/lists"}