{"action":"created","issue":{"url":"https://api.github.com/repos/katspaugh/wavesurfer.js/issues/524","labels_url":"https://api.github.com/repos/katspaugh/wavesurfer.js/issues/524/labels{/name}","comments_url":"https://api.github.com/repos/katspaugh/wavesurfer.js/issues/524/comments","events_url":"https://api.github.com/repos/katspaugh/wavesurfer.js/issues/524/events","html_url":"https://github.com/katspaugh/wavesurfer.js/issues/524","id":105715136,"number":524,"title":"Create Players from Audio Element from HTML","user":{"login":"X-Raym","id":7224315,"avatar_url":"https://avatars.githubusercontent.com/u/7224315?v=3","gravatar_id":"","url":"https://api.github.com/users/X-Raym","html_url":"https://github.com/X-Raym","followers_url":"https://api.github.com/users/X-Raym/followers","following_url":"https://api.github.com/users/X-Raym/following{/other_user}","gists_url":"https://api.github.com/users/X-Raym/gists{/gist_id}","starred_url":"https://api.github.com/users/X-Raym/starred{/owner}{/repo}","subscriptions_url":"https://api.github.com/users/X-Raym/subscriptions","organizations_url":"https://api.github.com/users/X-Raym/orgs","repos_url":"https://api.github.com/users/X-Raym/repos","events_url":"https://api.github.com/users/X-Raym/events{/privacy}","received_events_url":"https://api.github.com/users/X-Raym/received_events","type":"User","site_admin":false},"labels":[{"url":"https://api.github.com/repos/katspaugh/wavesurfer.js/labels/enhancement","name":"enhancement","color":"84b6eb"}],"state":"closed","locked":false,"assignee":null,"milestone":null,"comments":18,"created_at":"2015-09-10T01:32:29Z","updated_at":"2016-01-14T09:25:41Z","closed_at":"2015-10-18T10:05:27Z","body":"Hi,\r\n\r\nQuestion:\r\nTell me if I am wrong, but at this point, all datas are generated from a the jquery file.\r\nWould it be possible to tweak it so that it is able to auto-detect audio element on HTML (or maybe a div or something else with data attributes) and put them this player ?\r\nThe ultimate goal would be to be able to auto create player from the html without touching the JS, and if possible, creating some kind of wordpress plugin with wavesurfer.\r\nThe fact all infos came from the jquery make it a bit difficult to integrate with wordpress from post content.\r\n\r\nThanks for the infos !"},"comment":{"url":"https://api.github.com/repos/katspaugh/wavesurfer.js/issues/comments/171583916","html_url":"https://github.com/katspaugh/wavesurfer.js/issues/524#issuecomment-171583916","issue_url":"https://api.github.com/repos/katspaugh/wavesurfer.js/issues/524","id":171583916,"user":{"login":"X-Raym","id":7224315,"avatar_url":"https://avatars.githubusercontent.com/u/7224315?v=3","gravatar_id":"","url":"https://api.github.com/users/X-Raym","html_url":"https://github.com/X-Raym","followers_url":"https://api.github.com/users/X-Raym/followers","following_url":"https://api.github.com/users/X-Raym/following{/other_user}","gists_url":"https://api.github.com/users/X-Raym/gists{/gist_id}","starred_url":"https://api.github.com/users/X-Raym/starred{/owner}{/repo}","subscriptions_url":"https://api.github.com/users/X-Raym/subscriptions","organizations_url":"https://api.github.com/users/X-Raym/orgs","repos_url":"https://api.github.com/users/X-Raym/repos","events_url":"https://api.github.com/users/X-Raym/events{/privacy}","received_events_url":"https://api.github.com/users/X-Raym/received_events","type":"User","site_admin":false},"created_at":"2016-01-14T09:25:41Z","updated_at":"2016-01-14T09:25:41Z","body":"@tweed \r\nWhen building [WaveSurfer-WP](https://wordpress.org/plugins/wavesurfer-wp/), I realized that we could create WaveSurfer elements from HTML, but using the regular WebAudio just like regular wavesurfer-js initialization with a bit of jQuery.\r\n\r\nTo make this work with several players, I recreate all buttons elements and the JS initiliazer.\r\n(oh yes and codepen don't need to include scripts as you did, CSS and JS are automatically loaded from the different panels, and external files like wavesurfer-js are put in the settings as external resources).\r\n\r\nSo, if you need a HTML markup + initializer demo,\r\nMaybe take a look at this [pen](http://codepen.io/X-Raym/pen/VemqzZ)\r\nThis is what I have done for WaveSurfer-WP so far.\r\nContrary to standard HTML init, it doesn't recognize all data attributes, but it has smoother cursor refresh rate.\r\n\r\nFeel free to mod it to your needs !"}}