{"id":14979841,"url":"https://github.com/quead/angular-youtube-player","last_synced_at":"2025-05-10T23:29:54.130Z","repository":{"id":20490688,"uuid":"89613082","full_name":"quead/angular-youtube-player","owner":"quead","description":"Simple youtube player created with angular and typescript. See demo.","archived":false,"fork":false,"pushed_at":"2024-08-31T01:05:59.000Z","size":7087,"stargazers_count":36,"open_issues_count":3,"forks_count":19,"subscribers_count":5,"default_branch":"main","last_synced_at":"2025-05-10T23:29:47.193Z","etag":null,"topics":["angular","angular-cli","angular-youtube-player","angular6","angular7","application","css3","css4","music","music-player","player","playlist","typescript","video-player","web-application","youtube","youtube-api","youtube-player","youtube-search"],"latest_commit_sha":null,"homepage":"https://habarnam.io/player/home","language":"TypeScript","has_issues":true,"has_wiki":null,"has_pages":null,"mirror_url":null,"source_name":null,"license":"mit","status":null,"scm":"git","pull_requests_enabled":true,"icon_url":"https://github.com/quead.png","metadata":{"files":{"readme":"README.md","changelog":null,"contributing":null,"funding":null,"license":"LICENSE","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":"2017-04-27T15:33:24.000Z","updated_at":"2024-11-28T09:32:22.000Z","dependencies_parsed_at":"2024-09-19T03:02:18.666Z","dependency_job_id":"193780af-eda7-4147-ab14-6923f097d5d6","html_url":"https://github.com/quead/angular-youtube-player","commit_stats":{"total_commits":502,"total_committers":6,"mean_commits":83.66666666666667,"dds":"0.47808764940239046","last_synced_commit":"f5eafe76bbb8332f9031cf111292352e5058f885"},"previous_names":[],"tags_count":13,"template":false,"template_full_name":null,"repository_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/quead%2Fangular-youtube-player","tags_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/quead%2Fangular-youtube-player/tags","releases_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/quead%2Fangular-youtube-player/releases","manifests_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/quead%2Fangular-youtube-player/manifests","owner_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/owners/quead","download_url":"https://codeload.github.com/quead/angular-youtube-player/tar.gz/refs/heads/main","host":{"name":"GitHub","url":"https://github.com","kind":"github","repositories_count":253497296,"owners_count":21917683,"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","angular-cli","angular-youtube-player","angular6","angular7","application","css3","css4","music","music-player","player","playlist","typescript","video-player","web-application","youtube","youtube-api","youtube-player","youtube-search"],"created_at":"2024-09-24T14:00:46.040Z","updated_at":"2025-05-10T23:29:54.110Z","avatar_url":"https://github.com/quead.png","language":"TypeScript","readme":"\u003cp align=\"center\"\u003e\n  \u003ca href=\"https://habarnam.io/player/home\" target=\"_blank\" title=\"YouTube Player Demo\"\u003e \n    Demo\n  \u003c/a\u003e\n  \u003ca href=\"https://habarnam.io/player/home\" target=\"_blank\" title=\"YouTube Player\"\u003e \n    \u003cimg alt=\"Angular YouTube Player Logo\" src=\"https://i.imgur.com/rcuE2Ao.png\" style=\"height: auto; max-width:100%;\" /\u003e\n  \u003c/a\u003e\n\u003c/p\u003e\n\n# About Player\n\n[![Version](https://img.shields.io/badge/Current%20version-v2.6.2-brightgreen.svg?style=flat)](https://github.com/quead/angular-youtube-player)\n[![Angular version](https://img.shields.io/badge/Angular%20version-13.2.0-brightgreen.svg?style=flat)](https://github.com/quead/angular-youtube-player)\n\n[![GitHub license](https://img.shields.io/badge/license-MIT-blue.svg)](https://raw.githubusercontent.com/quead/angular-youtube-player/master/LICENSE)\n[![GitHub forks](https://img.shields.io/github/forks/quead/angular-youtube-player.svg)](https://github.com/quead/angular-youtube-player/network)\n[![GitHub stars](https://img.shields.io/github/stars/quead/angular-youtube-player.svg)](https://github.com/quead/angular-youtube-player/stargazers)\n\nThis is a simple youtube web player based on [angular-cli](https://github.com/angular/angular-cli \"Angular Cli\"), [ngx-socket-io](https://github.com/rodgc/ngx-socket-io \"ngx socket.io\"), [@angular/cdk](https://material.angular.io/cdk/categories/ \"angular cdk\").\n\nThis player is compatible only with Chrome/webkit browsers.\n\n_The project status is RC (release candidate)._\n\n## How to use\n\n**For development**\n\n1. Install [NodeJS 16.14.0+](https://nodejs.org/en/download/ \"Node JS Download\")\n\n2. Download/clone repository then install the player by\n\n`npm install` in root folder (not in /src)\n\n3. Add your youtube api key in **src/app/environments/settings.ts** or inside the app on settings page (when is running)\n\n4. Start your [server](https://github.com/quead/angular-youtube-server \"Angular youtube server\")\n\n`npm install \u0026\u0026 npm start` in root folder\n\n5. Connect to your [server](https://github.com/quead/angular-youtube-server \"Angular youtube server\")\n\nYou must change inside **src/app/environments/environment.ts** your path to your server.\n\n**To build the app**\n\n1. Install [angular-cli](https://github.com/angular/angular-cli \"Angular Cli\")\n\n`npm install -g @angular/cli`\n\n2. Run inside the root folder (not in /src)\n\nCheck [angular documentation](https://angular.io/cli/build \"angular cli\") for other build options.\n\n`ng build --prod=true`\n\n## Changelog\n\nAngular YouTube Player 2.6.0\n\n- List of guests in the session\n- Minor issues fixed (RC)\n- Add mini player when you scroll\n- First video from playlist is now the current video\n\nAngular YouTube Player 2.5.2\n\n- Add category badge to feed videos and current video\n- UI updates\n- New modal component\n\nAngular YouTube Player 2.5.1\n\n- Upgrade angular to LTS (from 7 to 8)\n- Fixed repeat mode\n- Update layout for playlist / related videos\n\nAngular YouTube Player 2.5\n\n- Cleaned the project to avoid using a lot of dependencies\n- Fix the issue when you change the region didn't updated the player\n- Improved UX for playlist\n- Added client name to identify each users in the room\n\nAngular YouTube Player 2.4\n\n- Switched from firebase to json through socket.io and private server\n- Responsive layout\n- Sync player in session\n- Rooms: join/leave room by unique id\n- Playlist is no more auto populated when is empty\n- You can't export/import anymore from .JSON file\n\nAngular YouTube Player 2.3.3\n\n- Fixed bugs after refactoring\n- Added session key for playlist which you can upload to cloud and download from cloud (integrated with firebase)\n- Layout update\n- Updated from angular 5.2.0 to 7.0.1\n- Carousel added for related videos (used [ngu-carousel](https://github.com/sheikalthaf/ngu-carousel))\n\nAngular YouTube Player 2.3\n\n- Updating to LTS angular\n- Refactoring entire app services and components\n- Improved speed performance and fixed major bugs\n- New way to loading the app\n\nAngular YouTube Player 2.2\n\n- Sort playlist by drag and drop (used [ng2-dragula](https://valor-software.com/ng2-dragula/ \"NG2 Dragula\"))\n\nAngular YouTube Player 2.1\n\n- Categories with videos like (music, gaming, autos, films, sports, etc.)\n- Refactoring code\n- Search on specific region\n- Fixing copy link for featured video\n- UX improvements\n\nAngular YouTube Player 2.0.1\n\n- Import \u0026 export youtube playlist as .JSON file\n\nAngular YouTube Player 2.0\n\n- Global hotkeys for application in desktop (play/pause/next/prev, for keyboards with media buttons)\n- Adding support for NW.js to export the app for desktop compatible: Windows x64, Linux x64\n- Auto updating the app (desktop version)\n\nAngular YouTube Player 1.9.2\n\n- UX improvements and fixes\n- Preparing files for 2.0\n\nAngular YouTube Player 1.9.1\n\n- Get settings.json for localstorage if your localstorage is empty\n- The playlist automatically saving, if is empty it will be populated with related videos\n- Toggle light/dark theme mode\n- Share link button for all videos\n- Reorganised settings page\n- Auto saving for internal settings (check settings)\n- Manual saving for external settings (check settings)\n- Performance, UI and UX improvements and fixes\n\nAngular YouTube Player 1.9\n\n- Add/remove items from playlist, first time when is initialized It is prepopulated with related videos\n- Next/prev video from your playlist\n- Moved history to separate page\n- Adding toggle video, repeat mode and list \u0026 grid on trending to settings.json\n- Small fixes\n\nAngular YouTube Player 1.7\n\n- Added featured video as first video from trending\n- Notifications for important actions you do\n- Removed debugging mode\n- Preparing packages, code and files for v2.0\n- Improved UI/UX for lists\n\nAngular YouTube Player 1.6\n\n- Video details for current video and trending videos like number of views, likes and dislikes\n- Share link for current video\n- Added new setting for hiding all thumbnails\n- Custom player buttons shows now only when you hide video\n\nAngular YouTube Player 1.4\n\n- History of your watched videos\n- Small fixes\n\nAngular YouTube Player 1.3\n\n- Show/hide video player\n- Repeat video\n- Grid/list mode for trending videos\n- **Settings (you can set default from \"assets/settings.json\", soon will be directly from settings)**\n- _Change country for trending videos (currently only three countries, US, UK and RO)_\n- _Max results show in search (0 to 50)_\n- _YOUR_API Key_\n- _Max related videos (0 to 50)_\n\nAngular YouTube Player 1.2\n\n- Introducing trending videos, currently default trending videos are from United States\n- Refactoring the code\n- Adding routes for future components which it will show in left navbar\n- Default video will be first from trending videos\n- Adding the video player\n- Update the design to match the new features\n\nAngular YouTube Player 1.1\n\n- Adding mute/unmute functionality\n- Improved user interface and user experience\n- Adding settings functionality, the settings will get from **_assets/settings.json_**\n\n**Settings**\n\n- _Show/hide debugging features_\n- _Show/hide thumbnails in search_\n\nAngular YouTube Player 1.0.2\n\n- Change volume on your video\n- Related videos\n\nAngular YouTube Player 1.0.0\n\n- Search and play video from youtube\n- Play/pause video\n- Change time of your video that you want to listen\n\n## Future features\n\n#### Backlog\n\n- iOS 8+ / android 5+ app **(unversioned)**\n\n**Rooms**\n\n- \\*Room chat **(unversioned)\\***\n\n#### Roadmap to 3.0\n\n- \\*Release a stable version **(in v2.6.9)\\***\n- \\*Set private/public room **(in v2.7)\\***\n- \\*List of public rooms **(in v2.8)\\***\n- \\*Room moderators which can add videos, kick roommates, mute roommates **(in v2.9)\\***\n\n#### Roadmap to 4.0\n\n- Integrating YouTube account subscriptions/playlist **(in v3.0)**\n\n#### Removed features\n\n- Global hotkeys for application in desktop (play/pause/next/prev, for keyboards with media buttons)\n- Adding support for NW.js to export the app for desktop compatible: Windows x64, Linux x64\n- Auto updating the app (desktop version)\n- Themes temporary removed\n\n## Copyright and License\n\nCopyright [quead](https://github.com/quead) under the [MIT license](LICENSE).\n","funding_links":[],"categories":[],"sub_categories":[],"project_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Fquead%2Fangular-youtube-player","html_url":"https://awesome.ecosyste.ms/projects/github.com%2Fquead%2Fangular-youtube-player","lists_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Fquead%2Fangular-youtube-player/lists"}