mirror of
https://github.com/zhw2590582/ArtPlayer.git
synced 2026-10-15 17:16:16 -08:00
update docs
This commit is contained in:
1 parent
ae40a5843c
commit
78bfc13c04
51 files changed
+729
-123
No files matched your search
@@ -1 +1 @@
|
||||
[{"title":"Add button to the controls","type":0,"sectionRef":"#","url":"en/Questions/Create button in the controls","content":"Add button to the controls ▶ Run Code var time = 0; var art = new Artplayer({ container: '.artplayer-app', url: '/assets/sample/video.mp4', controls: [ { position: 'right', html: '<button type="button">Click Me!</button>', click: function (_, event) { // The second parameter is an event object time += 1; event.target.innerText = 'You Click ' + time; }, }, ], }); Copy","keywords":""},{"title":"Add select in the controls","type":0,"sectionRef":"#","url":"en/Questions/Create selector in the controls","content":"Add select in the controls Sometimes you need to add a list in the controls, then you can use the selector and onSelect attribute when adding controls ▶ Run Code var art = new Artplayer({ container: '.artplayer-app', url: '/assets/sample/video.mp4', controls: [ { position: 'right', html: 'Subtitle 01', selector: [ { default: true, html: '<span style="color:red">Subtitle 01</span>', url: '/assets/sample/subtitle.srt?id=1', }, { html: '<span style="color:yellow">Subtitle 02</span>', url: '/assets/sample/subtitle.srt?id=2', }, ], onSelect: function (item, $dom) { art.subtitle.switch(item.url, { name: $dom.innerText, }); return 'You click ' + item.html; }, }, ], }); Copy","keywords":""},{"title":"Static propertys","type":0,"sectionRef":"#","url":"class","content":"","keywords":""},{"title":"instances","type":1,"pageTitle":"Static propertys","url":"class#instances","content":"Type: Array A array that saves all player instances, and can manage multiple instances through this property when multiple players exist at the same time. ▶ Run Code var art = new Artplayer({ container: '.artplayer-app', url: '/assets/sample/video.mp4', }); art.on('ready', () => { console.info(Artplayer.instances.length); }); Copy "},{"title":"version","type":1,"pageTitle":"Static propertys","url":"class#version","content":"Type: String Current player version number ▶ Run Code console.info(Artplayer.version); Copy "},{"title":"env","type":1,"pageTitle":"Static propertys","url":"class#env","content":"Type: String Current player environment variable ▶ Run Code console.info(Artplayer.env); Copy "},{"title":"utils","type":1,"pageTitle":"Static propertys","url":"class#utils","content":"Type: Object Common utils for player ▶ Run Code console.info(Object.keys(Artplayer.utils)); Copy "},{"title":"config","type":1,"pageTitle":"Static propertys","url":"class#config","content":"Type: Object Store native properties and methods of video ▶ Run Code console.info(Artplayer.config); Copy "},{"title":"scheme","type":1,"pageTitle":"Static propertys","url":"class#scheme","content":"Type: Object Verification scheme for player option ▶ Run Code console.info(Artplayer.scheme); Copy "},{"title":"validator","type":1,"pageTitle":"Static propertys","url":"class#validator","content":"Type: Function Validator for player option "},{"title":"option","type":1,"pageTitle":"Static propertys","url":"class#option","content":"Type: Object Player default option ▶ Run Code console.info(Artplayer.option); Copy "},{"title":"html","type":1,"pageTitle":"Static propertys","url":"class#html","content":"Type: String Player defaults HTML String, usually used for SSR ▶ Run Code console.info(Artplayer.html); Copy "},{"title":"kindOf","type":1,"pageTitle":"Static propertys","url":"class#kindof","content":"Type: Function JS type identification function ▶ Run Code console.info(Artplayer.kindOf('0')); console.info(Artplayer.kindOf(0)); console.info(Artplayer.kindOf({})); console.info(Artplayer.kindOf([])); Copy "},{"title":"Third party librarys","type":0,"sectionRef":"#","url":"libraries","content":"","keywords":""},{"title":"flv.js","type":1,"pageTitle":"Third party librarys","url":"libraries#flvjs","content":"Homepage: https://github.com/Bilibili/flv.js ▶ Run Code var art = new Artplayer({ container: '.artplayer-app', autoplay: true, url: '/assets/sample/video.flv', customType: { flv: function (video, url) { const flvPlayer = flvjs.createPlayer({ type: 'flv', url: url, }); flvPlayer.attachMediaElement(video); flvPlayer.load(); }, }, }); Copy "},{"title":"hls.js","type":1,"pageTitle":"Third party librarys","url":"libraries#hlsjs","content":"Homepage: https://github.com/video-dev/hls.js ▶ Run Code var art = new Artplayer({ container: '.artplayer-app', autoplay: true, url: 'https://test-streams.mux.dev/x36xhzz/x36xhzz.m3u8', customType: { m3u8: function (video, url) { var hls = new Hls(); hls.loadSource(url); hls.attachMedia(video); }, }, }); Copy "},{"title":"dash.js","type":1,"pageTitle":"Third party librarys","url":"libraries#dashjs","content":"Homepage: https://github.com/Dash-Industry-Forum/dash.js ▶ Run Code var art = new Artplayer({ container: '.artplayer-app', autoplay: true, url: 'https://dash.akamaized.net/envivio/EnviviLine truncated
|
||||
[{"title":"Add button to the controls","type":0,"sectionRef":"#","url":"en/Questions/Create button in the controls","content":"Add button to the controls ▶ Run Code var time = 0; var art = new Artplayer({ container: '.artplayer-app', url: '/assets/sample/video.mp4', controls: [ { position: 'right', html: '<button type="button">Click Me!</button>', click: function (_, event) { // The second parameter is an event object time += 1; event.target.innerText = 'You Click ' + time; }, }, ], }); Copy","keywords":""},{"title":"Add select in the controls","type":0,"sectionRef":"#","url":"en/Questions/Create selector in the controls","content":"Add select in the controls Sometimes you need to add a list in the controls, then you can use the selector and onSelect attribute when adding controls ▶ Run Code var art = new Artplayer({ container: '.artplayer-app', url: '/assets/sample/video.mp4', controls: [ { position: 'right', html: 'Subtitle 01', selector: [ { default: true, html: '<span style="color:red">Subtitle 01</span>', url: '/assets/sample/subtitle.srt?id=1', }, { html: '<span style="color:yellow">Subtitle 02</span>', url: '/assets/sample/subtitle.srt?id=2', }, ], onSelect: function (item, $dom) { art.subtitle.switch(item.url, { name: $dom.innerText, }); return 'You click ' + item.html; }, }, ], }); Copy","keywords":""},{"title":"Static propertys","type":0,"sectionRef":"#","url":"class","content":"","keywords":""},{"title":"instances","type":1,"pageTitle":"Static propertys","url":"class#instances","content":"Type: Array A array that saves all player instances, and can manage multiple instances through this property when multiple players exist at the same time. ▶ Run Code var art = new Artplayer({ container: '.artplayer-app', url: '/assets/sample/video.mp4', }); art.on('ready', () => { console.info(Artplayer.instances.length); }); Copy "},{"title":"version","type":1,"pageTitle":"Static propertys","url":"class#version","content":"Type: String Current player version number ▶ Run Code console.info(Artplayer.version); Copy "},{"title":"env","type":1,"pageTitle":"Static propertys","url":"class#env","content":"Type: String Current player environment variable ▶ Run Code console.info(Artplayer.env); Copy "},{"title":"utils","type":1,"pageTitle":"Static propertys","url":"class#utils","content":"Type: Object Common utils for player ▶ Run Code console.info(Object.keys(Artplayer.utils)); Copy "},{"title":"config","type":1,"pageTitle":"Static propertys","url":"class#config","content":"Type: Object Store native properties and methods of video ▶ Run Code console.info(Artplayer.config); Copy "},{"title":"scheme","type":1,"pageTitle":"Static propertys","url":"class#scheme","content":"Type: Object Verification scheme for player option ▶ Run Code console.info(Artplayer.scheme); Copy "},{"title":"validator","type":1,"pageTitle":"Static propertys","url":"class#validator","content":"Type: Function Validator for player option "},{"title":"option","type":1,"pageTitle":"Static propertys","url":"class#option","content":"Type: Object Player default option ▶ Run Code console.info(Artplayer.option); Copy "},{"title":"html","type":1,"pageTitle":"Static propertys","url":"class#html","content":"Type: String Player defaults HTML String, usually used for SSR ▶ Run Code console.info(Artplayer.html); Copy "},{"title":"kindOf","type":1,"pageTitle":"Static propertys","url":"class#kindof","content":"Type: Function JS type identification function ▶ Run Code console.info(Artplayer.kindOf('0')); console.info(Artplayer.kindOf(0)); console.info(Artplayer.kindOf({})); console.info(Artplayer.kindOf([])); Copy "},{"title":"Third party librarys","type":0,"sectionRef":"#","url":"libraries","content":"","keywords":""},{"title":"flv.js","type":1,"pageTitle":"Third party librarys","url":"libraries#flvjs","content":"Homepage: https://github.com/Bilibili/flv.js ▶ Run Code var art = new Artplayer({ container: '.artplayer-app', autoplay: true, url: '/assets/sample/video.flv', customType: { flv: function (video, url) { const flvPlayer = flvjs.createPlayer({ type: 'flv', url: url, }); flvPlayer.attachMediaElement(video); flvPlayer.load(); }, }, }); Copy "},{"title":"hls.js","type":1,"pageTitle":"Third party librarys","url":"libraries#hlsjs","content":"Homepage: https://github.com/video-dev/hls.js ▶ Run Code var art = new Artplayer({ container: '.artplayer-app', autoplay: true, url: 'https://test-streams.mux.dev/x36xhzz/x36xhzz.m3u8', customType: { m3u8: function (video, url) { var hls = new Hls(); hls.loadSource(url); hls.attachMedia(video); }, }, }); Copy "},{"title":"dash.js","type":1,"pageTitle":"Third party librarys","url":"libraries#dashjs","content":"Homepage: https://github.com/Dash-Industry-Forum/dash.js ▶ Run Code var art = new Artplayer({ container: '.artplayer-app', autoplay: true, url: 'https://dash.akamaized.net/envivio/EnviviLine truncated
|
||||
Reference in new issue
Block a user