Javascript 从音轨中选择片段

Question

我正在开发一个 PHP 项目，用户可以从轨道库中选择一个轨道，从该轨道中选择一个几秒长的片段，然后使用该片段作为搜索参数下一页。

客户端希望显示轨道的波形(这些波形已经生成为 PNG 文件)，并带有显示当前播放位置的“播放头”(应该很容易做到)。用户应该能够通过拖动垂直条来选择其选择的起点和终点，试听所选的片段(通过按空格键或类似键)，然后单击“搜索”提交 HTML 表单。我实际需要的表单中唯一的参数是所选音频片段的开始和结束位置。

所以，这就是客户想要的，我正处于头脑 Storm 阶段。到目前为止，我已经有了一堆mp3文件和相应的波形图。在浏览器支持方面，指定浏览器必须是“...的最新版本”是可以的，但我想为所有大牌浏览器提供支持:Safari、Firefox、Opera、IE、Chrome .

您对我应该考虑帮助实现的 JavaScript 库或解决方案有什么建议吗:嵌入音频文件、播放控制界面和片段选择界面。尽管可以为所有 mp3 生成相应的 OGG 文件(以帮助实现 HTML5)，但如果可能的话，我不希望这样做，因为这会让事情变得复杂。因此，理想情况下，我想要一个仅提供跨浏览器支持的 mp3 解决方案。也许像 jPlayer 这样的东西是可能的？我当然熟悉 jQuery，所以使用它会是一个额外的好处。

是否有任何现有的库可以帮助我使用“片段选择”界面？在一个完全理想的世界中，这将是一个带有“滑动条”的解决方案 - 即当您拖动起点和终点 handle 时，“播放头”处的声音会立即预览。

非常感谢您的任何想法和建议!

编辑(更多信息):

我希望能够创建类似于此演示的内容: http://www.happyworm.com/jquery/jplayer/latest/demo-07.htm除了添加的功能是用户可以从轨道中选择“片段”，使用起点和终点擦洗条，并且可以通过以下方式试听片段按播放。所以，我想要的界面是这样的:

• 页面加载时，轨道将开始缓冲，并且播放按钮如果按下，将从头开始正常播放
• 如果用户从轨道的最左边缘拖动滑动条，播放头处的声音将被预览(就像我的演示一样)链接到)，释放滑动条后，播放将继续从那里到轨道的尽头
• 如果用户从轨道最右侧拖动另一个滑动条，将再次预览播放头处的声音。然而，作为释放栏后，播放应跳回左侧滑动条，并从那里继续。 (如果这太难实现，我会对右侧的擦洗条感到满意，因为它无法预览声音拖动，但只是作为选择结束的“标记”)。
• 两个滑动条不能互相穿过，所以左边的总是'开始'和右边是选择的'结束'。
• 一旦移动了栏并做出了选择，播放应无限循环所选片段，直到“停止”被按下。
• 在理想的世界中，我希望擦洗条能够“捕捉”到网格整秒，以便片段的开始、结束和长度值是总是整数秒。如果做不到这一点，我就绕过稍后在 JavaScript 中将数字转换为最接近的整数。

Answer 1

对于选择:

http://docs.jquery.com/UI/Slider

至于 JavaScript 进行播放清理，祝你好运......听起来更像是 flash 或 html5 的东西