diygod / aplayer Goto Github PK

some times we need a download button at the playlist, users can using this button to download the mp3.

volume progress etc.

Hi all,
I want change url of a player by ajax reponse, but after load old audio still play, i mean too audios play same time.
How to pause all musics on a page?

Thanks.

only canplay will be triggered.

tested on Chrome Version 51.0.2704.84 (64-bit)

Here is a Problem because of Bootstrap and other frontend frames.

It can make the player interface dystopic.

This is an answer to the problem:

.aplayer * {
    box-sizing: content-box;
}

Hello,
I like this player and I want to use it as a radio player, can i do that?!

Thank you

我发现 一个页面div的id必须从player1起才能显示，就比如如果一个页面只有div id="player3" class="aplayer">这行就无法显示播放器了。如果想要调用player3就必须调用player1，player2才行，这是bug吗？

1. click play list: toggle between play and pause
2. click picture: toggle between play and pause
3. more bolder play bar when hoverd or showed in mobile
4. hide buttons in narrow screen
5. adjust the position of lrc: below the picture
6. lrc rolling display
7. lrc show button
8. isMobile add wp

即便是在init参数中将autoplay设置为true也不能自动播放；甚至在init()后再次调用play()方法也不行。

上述问题在PC浏览器不存在，在手机上会发生（安卓和iOS局势如此）。

求解决办法，多谢！

The player can't auto play in mobile bowser. Even set init param(autoplay is ture) , it still can't auto start.

help, thx~!

Hello!
First of all this is a great plugin! But I am wondering if its possible to start the player from a specific time point?

I want to load the plugin but when I refresh the page I can continue in the plugin where we left off.
I think this could be accomplished by an option like:

var option = { start: 0 // start time in seconds (or miliseconds) }

Is this possible? (maybe its already possible)
Thanks in advance!

列表的隐藏和显示的时候会出现滚动条，而且实现应该用的是调整max-height，这个会有性能问题

-.-

garbage.

I have the APlayer set up and running and it works great on google chrome browser but it fails to work on firefox. The volume button just drops to 0% and when you click it does not work.

Here is a .gif to show what its happening: the gif

Any help would be appreciated and thank you for this awesome player :)

please add preload enable and disable on Aplayer
this function will useful for server load
thanks Admin for very very good Player

Hi,

I can't figure out how the first player can be paused if second, third or any other player starts playing.

Can you tell me with an example code? Demo page also doesn't stop any other player.

Thanks for your efforts. It's a great player indeed.

Say, if the webpage theme is white text on dark(light on dark), then it can cause style problem.
Example:

Currently hover color is hard coded:

          &:hover {
               background: #efefef;
           }

So is the background color of current item being played.
I think it would be great to make it configurable as an option, the implementation would be rather simple.

I have 6 narrow players in a row. I want to know if it's possible to display Volume Control and Loop/Repeat on top and it controls all the players? Something like this: http://i.imgur.com/JV2pkHs.png

抛出异常 Symbol 未定义，在win10 edga 下正常 其他都报错

for example:

[ti:告白日和、です ]
[ar:US]
[al:μ's Best Album Best Live collection]
[00:00.071]告白日和、です - 内田彩
[00:00.071]词：畑亜贵
[00:00.071]曲：若林充
[00:00.121]
[00:00.751]ねえひとつだけ聞いていい
[00:04.041]私のこと
[00:12.100]会えるかも今日は心が騒いで
[00:17.140]スキップしたくなった
[00:19.979]ときめきに踊る瞬間
[00:23.219]私のことなど[ti:告白日和、です ]

Songs with even number are automatically skipped in Safari but not in other browsers, FYI I'm using Safari 9.1 on OS X 10.11.4. Plus the progress bar's click zone is so narrow thus making it hardly clickable.

var option = {
element: document.getElementById('player1'),
narrow: false,
autoplay: true,
showlrc: false,
mutex: true,
theme: '#e6d0b2',
preload: 'metadata',
music: {
title: 'Preparation',
author: 'Hans Zimmer/Richard Harvey',
url: 'http://devtest.qiniudn.com/Preparation.mp3',
pic: 'http://devtest.qiniudn.com/Preparation.jpg'
}
};

var ap1 = new APlayer(option);
ap1.init;
//it's useful as i use the dome ,but i don't know where is the problem

是否可以通过url提供lrc？或者至少通过访问单独的lrc文件？谢谢

I would love if anyone here could tell how I can make the music play over diffrent pages/tabs on the same domain, where I can just go to a diffrent sub-url and it will keep playing, sessionstorage perhaps? And how do I set default volume to 50%? Thanks

like

var ap = new APlayer({
    element: document.getElementById('player1'),
    narrow: false,
    autoplay: true,
    showlrc: false,
    theme: '#e6d0b2',
    music: {
        title: 'Preparation',
        author: 'Hans Zimmer/Richard Harvey',
        url: 'http://7xifn9.com1.z0.glb.clouddn.com/Preparation.mp3',
        pic: 'http://7xifn9.com1.z0.glb.clouddn.com/Preparation.jpg',
        lyric: '[00:00.00]first line\n[00:01.00]second line\n[00:02.00]third line\n'
    }
});
ap.init(); 

When the parameter don't have lyric, it can load lyric via 'aplayer-lrc-content'.

Hi I've question how i could load files inside folder automatically to APlayer?

如下：

http://7xvh1w.com1.z0.glb.clouddn.com/OK%20-%20%E5%BC%A0%E9%9C%87%E5%B2%B3.jpg

            var l = '\n                <div class="aplayer-pic" ' + (this.music.pic ? 'style="background-image: url("' + encodeURI(this.music.pic) + '");"' : "") + '>\n                    <div class="aplayer-button aplayer-play">\n                        <i class="demo-icon aplayer-icon-play"></i>\n                    </div>\n                </div>\n                <div class="aplayer-info">\n                    <div class="aplayer-music">\n                        <span class="aplayer-title"></span>\n                        <span class="aplayer-author"></span>\n                    </div>\n                    <div class="aplayer-lrc">\n                        <div class="aplayer-lrc-contents" style="transform: translateY(0); -webkit-transform: translateY(0);"></div>\n                    </div>\n                    <div class="aplayer-controller">\n                        <div class="aplayer-bar-wrap">\n                            <div class="aplayer-bar">\n                                <div class="aplayer-loaded" style="width: 0"></div>\n                                <div class="aplayer-played" style="width: 0; background: ' + this.option.theme + ';">\n                                    <span class="aplayer-thumb" style="border: 1px solid ' + this.option.theme + ';"></span>\n                                </div>\n                            </div>\n                        </div>\n                        <div class="aplayer-time">\n                             - <span class="aplayer-ptime">00:00</span> / <span class="aplayer-dtime">00:00</span>\n                            <div class="aplayer-volume-wrap">\n                                <i class="demo-icon aplayer-icon-volume-down"></i>\n                                <div class="aplayer-volume-bar-wrap">\n                                    <div class="aplayer-volume-bar">\n                                        <div class="aplayer-volume" style="height: 80%; background: ' + this.option.theme + ';"></div>\n                                    </div>\n                                </div>\n                            </div>\n                            <i class="demo-icon aplayer-icon-loop' + (this.loop ? "" : " aplayer-noloop") + '"></i>' + (this.multiple ? '<i class="demo-icon aplayer-icon-menu"></i>' : "") + "\n                        </div>\n                    </div>\n                </div>";

这一句中的'style="background-image: url("' + encodeURI(this.music.pic) + '");"' 需改为'style="background-image: url(' + encodeURI(this.music.pic) + ');"' ，去掉前后两个"，否则将导致页面将当前页作为一个image对象载入。

https://en.wikipedia.org/wiki/LRC_(file_format)#Enhanced_format

Using enhanced LRC format, lyrics can sync song lines word by word. This could be a nice update for the player.

Long audio files like DJ mixes don't show the hour designation. They show as minutes.
For example, 1:06:58 shows as 66:58.

PS, great player!

Hello,

Will be great if you add new fn`s to interact with the playlist. For example at the moment i need fn to set manual which track to play.

Example:
I have playlist with 5 tracks and i need to listen track 3 from 45s.

ap.setTrack(3);
ap.play(45);

Thx.

Missing next previous function on playlist mode. Can you add those?

Thanks in advance.

Try SoundJS.

The repeat/loop audio icon is by default ON. An option to change this preference would be ideal.

将歌词显示的p标签的line-height:20px;改成height:20px;就好了