How I can add a media player with several source m

2019-07-14 19:57发布

站内问答 / 前沿技术
1980 2 5

I am looking for a mechanism to display a media player with multiple sources MP3 (attached image).

enter image description here

Using primefaces there is the tag:

<p:media value="http://www.stephaniequinn.com/Music/Mozart%20-%20Presto.mp3" width="200" height="20" player="quicktime" />

But it allows to have only one piece at a time.

2条回答
三岁会撩人
2楼-- · 2019-07-14 20:12

I've had good results with Wikplayer. It may not be exactly what you're looking for, but it's completely client-side (ie: JavaScript) and continues playing as you change pages on the site. And yes, it does allow multiple files.

For example, the default settings produces the following code:

<script type="text/javascript" src="http://www.wikplayer.com/code.js" data-config=" ... " ></script>

The contents of data-config is:

{
  'skin': 'skins/wikfull/funkyBlue/skin.css',
  'volume': 50,
  'autoplay': false,
  'shuffle': false,
  'repeat': 0,
  'showcomment': false,
  'marqueetexton': true,
  'placement': 'top',
  'showplaylist': false,
  'playlist': [
    {
      'title': '(SAMPLE)%20Canon%20in%20D%20-%20Pachelbel',
      'url':'http%3A%2F%2Fwww.youtube.com%2Fwatch%3Fv%3DMK6heUdRr-E'
    }
  ]
}

It's pretty obvious what most of these settings do, and to add more tracks all you have to do is add more objects the the playlist array, specifying the title and url as URL encoded parameters each time.

查看更多
0人赞 添加讨论(0) 举报
贼婆χ
3楼-- · 2019-07-14 20:25

I share with you the solution I found

in the bean I generate a JSON string like this :

@ManagedBean public class AudioBean {

private String json = "[{'title':'MUSIC CALME','url':'http%3A%2F%2Fwww.youtube.com%2Fwatch%3Fv%3DMK6heUdRr-E'},"
        + "         {'title':'Selena Gomez - Come & Get It','url':'https://www.youtube.com/watch?v=n-D1EB74Ckg&list=RDn-D1EB74Ckg'},"
        + "     {'title':'Demi Lovato - Heart Attack','url':'https://www.youtube.com/watch?v=AByfaYcOm4A&index=3&list=RDn-D1EB74Ckg'}]";

public String getJson() {
    return json;
}

public void setJson(String json) {
    this.json = json;
} }

and in the XHTML page I call the json attribut by El Expression :

<body>
<script type="text/javascript" src="http://www.wikplayer.com/code.js"
    data-config="{'skin':'skins/wikfull/ribbonRed/skin.css','volume':62,'autoplay':true,'shuffle':true,'repeat':0,'showcomment':false,'marqueetexton':true,'placement':'top','showplaylist':false,
    'playlist':
        #{audioBean.json}
}">
</script>

查看更多
0人赞 添加讨论(0) 举报
登录 后发表回答
相关问题
查看全部
相关文章
查看全部
收藏的人(5)