CC-2430 : Preview tracks in the library + better preview (ability to jump around in clip)
- added accept ranges header to the response to enable seek ahead in the music file.
This commit is contained in:
parent
b8452928da
commit
7d95e4ffa7
5 changed files with 251 additions and 3 deletions
72
airtime_mvc/public/js/airtime/library/preview.js
Normal file
72
airtime_mvc/public/js/airtime/library/preview.js
Normal file
|
@ -0,0 +1,72 @@
|
|||
var audio_preview_window = null;
|
||||
|
||||
function playlistAudioPreviewEditor(filename, elemIndexString){
|
||||
|
||||
elemIndex =parseInt(elemIndexString)+1;//increment the index as tags start from 1 not 0
|
||||
|
||||
var cueIn = $("dd[id^=spl_cue_in_"+elemIndex+"]").find('span').html();
|
||||
console.log(cueIn);
|
||||
|
||||
var cueOut = $("dd[id^=spl_cue_out_"+elemIndex+"]").find('span').html();
|
||||
console.log("The cueOut is "+cueOut);
|
||||
|
||||
var fadeIn = $("dd[id^=spl_fade_in_"+elemIndex+"]").find('span').html();
|
||||
if (fadeIn == undefined){ console.log("undefined fadein"); fadeIn = $("dd[id^=spl_fade_in_main]").find('span').html();}
|
||||
console.log("The fadeIn is "+fadeIn);
|
||||
|
||||
var fadeInFileName = "";
|
||||
if (fadeIn != undefined && parseInt(fadeIn) > 0 ){
|
||||
//need to get the previous element in the playlist...but don't support previous playlist fading becuase thats not possible.
|
||||
|
||||
}
|
||||
console.log("The fadeInFileName is "+fadeInFileName);
|
||||
|
||||
var fadeOut = $("dd[id^=spl_fade_out_"+elemIndex+"]").find('span').html();
|
||||
if (fadeOut == undefined){ console.log("undefined fadeout"); fadeOut = $("dd[id^=spl_fade_out_main]").find('span').html();}
|
||||
console.log("The fadeOut is "+fadeOut);
|
||||
|
||||
var fadeOutFileName = "";
|
||||
if (fadeOut != undefined && parseInt(fadeOut) > 0 ){
|
||||
//need to get the next element in the playlist...but don't support next playlist fading becuase thats not possible.
|
||||
|
||||
}
|
||||
console.log("The fadeOutFileName is "+fadeOutFileName);
|
||||
|
||||
//Pop out a play list with cue in and cue out set.
|
||||
open_player();
|
||||
|
||||
//Set the play button to pause.
|
||||
var elemID = "spl_"+elemIndexString;
|
||||
$('#'+elemID+' div.list-item-container a span').attr("class", "ui-icon ui-icon-pause");
|
||||
|
||||
}
|
||||
|
||||
function open_audio_preview(filename, index) {
|
||||
console.log("hello world 2 "+filename+" help?");
|
||||
url = 'Playlist/audio-preview-player/filename/'+filename+'/index/'+index;
|
||||
|
||||
if (audio_preview_window == null || audio_preview_window.closed){
|
||||
console.log("opening : "+baseUrl+url);
|
||||
|
||||
audio_preview_window = window.open(url, 'Audio Player', 'width=400,height=95');
|
||||
//audio_preview_window.setTitle('Audio Player');
|
||||
//$.post(baseUri+'Playlist/audio-preview-player', {fileName: fileName, cueIn: cueIn, cueOut: cueOut, fadeIn: fadeIn, fadeInFileName: fadeInFileName, fadeOut: fadeOut, fadeOutFileName: fadeOutFileName})
|
||||
/**
|
||||
$.post(url,
|
||||
{format: "json", elementFilename: filename, elementIndex: elemIndexString},
|
||||
function(json){
|
||||
audio_preview_window.document.open();
|
||||
audio_preview_window.document.write(json);
|
||||
audio_preview_window.document.close();
|
||||
});
|
||||
**/
|
||||
} else if (!audio_preview_window.closed) {
|
||||
console.log("refreshing : "+baseUrl+url);
|
||||
audio_preview_window.play(filename);
|
||||
} else {
|
||||
console.log("something else : "+baseUrl+url);
|
||||
}
|
||||
|
||||
audio_preview_window.focus();
|
||||
return false;
|
||||
}
|
124
airtime_mvc/public/js/airtime/library/preview_jplayer.js
Normal file
124
airtime_mvc/public/js/airtime/library/preview_jplayer.js
Normal file
|
@ -0,0 +1,124 @@
|
|||
|
||||
|
||||
function audioPreview(filename, elemID){
|
||||
console.log("in the audio preview");
|
||||
var elems = $('.ui-icon.ui-icon-pause');
|
||||
elems.attr("class", "ui-icon ui-icon-play");
|
||||
|
||||
if ($("#jquery_jplayer_1").data("jPlayer") && $("#jquery_jplayer_1").data("jPlayer").status.paused != true){
|
||||
$('#jquery_jplayer_1').jPlayer('stop');
|
||||
return;
|
||||
}
|
||||
|
||||
var ext = getFileExt(filename);
|
||||
var uri = "/api/get-media/file/" + filename;
|
||||
|
||||
var media;
|
||||
var supplied;
|
||||
if (ext == "ogg"){
|
||||
media = {oga:uri};
|
||||
supplied = "oga";
|
||||
} else {
|
||||
media = {mp3:uri};
|
||||
supplied = "mp3";
|
||||
}
|
||||
|
||||
$("#jquery_jplayer_1").jPlayer("destroy");
|
||||
$("#jquery_jplayer_1").jPlayer({
|
||||
ready: function () {
|
||||
$(this).jPlayer("setMedia", media).jPlayer("play");
|
||||
},
|
||||
swfPath: "/js/jplayer",
|
||||
supplied: supplied
|
||||
});
|
||||
|
||||
$('#'+elemID+' div.list-item-container a span').attr("class", "ui-icon ui-icon-pause");
|
||||
}
|
||||
|
||||
$(document).ready(function(){
|
||||
var filename = $(".filename").text();
|
||||
//var filename = $(".jp_audio_0").attr("src");
|
||||
play(filename);
|
||||
|
||||
|
||||
});
|
||||
|
||||
function play(filename){
|
||||
console.log("in the play function! "+filename);
|
||||
|
||||
var uri = "/api/get-media/file/" + filename+"/api_key/H7CSH1RH1YH2W3KFAKCZ";
|
||||
var ext = getFileExt(filename);
|
||||
|
||||
|
||||
var media;
|
||||
var supplied;
|
||||
if (ext == "ogg"){
|
||||
media = {oga:uri};
|
||||
supplied = "oga";
|
||||
} else {
|
||||
media = {mp3:uri};
|
||||
supplied = "mp3";
|
||||
}
|
||||
|
||||
$("#jquery_jplayer_1").jPlayer("destroy");
|
||||
$.jPlayer.timeFormat.showHour = true;
|
||||
$("#jquery_jplayer_1").jPlayer({
|
||||
ready: function () {
|
||||
|
||||
$(this).jPlayer("setMedia", media).jPlayer("play");
|
||||
|
||||
},
|
||||
swfPath: "/js/jplayer",
|
||||
cssSelectorAncestor: '#jp_container_1',
|
||||
wmode: "window"
|
||||
});
|
||||
/**
|
||||
$("#jquery_jplayer_1").jPlayer().bind($.jPlayer.event.play, function(event){
|
||||
console.log("playing xxx");
|
||||
//console.log(this.htmlElement.media.currentTime)
|
||||
//$("#jquery_jplayer_1").jPlayer("playHead", event.jPlayer.status.seekPercent);
|
||||
});
|
||||
$("#jquery_jplayer_1").jPlayer().bind($.jPlayer.event.seeking, function(event){
|
||||
console.log("hello 123");
|
||||
//console.log(this.htmlElement.media.currentTime)
|
||||
//$("#jquery_jplayer_1").jPlayer("playHead", event.jPlayer.status.seekPercent);
|
||||
});
|
||||
$("#jquery_jplayer_1").jPlayer().bind($.jPlayer.event.seeked, function(event){
|
||||
console.log("hello 456");
|
||||
//console.log(this.htmlElement.media.currentTime)
|
||||
//$("#jquery_jplayer_1").jPlayer("playHead", event.jPlayer.status.seekPercent);
|
||||
});
|
||||
$("#jquery_jplayer_1").jPlayer().bind($.jPlayer.event.volumechange, function(event){
|
||||
console.log("hello 666");
|
||||
//console.log(this.htmlElement.media.currentTime)
|
||||
//$("#jquery_jplayer_1").jPlayer("playHead", event.jPlayer.status.seekPercent);
|
||||
});
|
||||
$(".jp-seek-bar").click(function(){
|
||||
console.log("seek bar clicked");
|
||||
console.log($("#currentTime"));
|
||||
//console.log(this.htmlElement.media.seekable)
|
||||
//console.log($(".jp-play-bar").attr("style"));
|
||||
//$("#jquery_jplayer_1").jPlayer("play", 40);
|
||||
});
|
||||
|
||||
$(".jp-seek-bar").click(function(){
|
||||
console.log("hi");
|
||||
//console.log(this.htmlElement.media.seekable)
|
||||
//console.log($(".jp-play-bar").attr("style"));
|
||||
//$("#jquery_jplayer_1").jPlayer("playHead", "50%");
|
||||
});
|
||||
$(".jp-play-bar").click(function(){
|
||||
console.log("bye");
|
||||
});
|
||||
$(".jp-progres").click(function(){
|
||||
console.log("no");
|
||||
});
|
||||
$("#combo-box").change(function(eventObject){
|
||||
var elem = $("#combo-box option:selected");
|
||||
setjPlayer(elem.attr("data-url"), elem.attr("data-type"), elem.attr("server-type"));
|
||||
});
|
||||
**/
|
||||
|
||||
|
||||
}
|
||||
|
Binary file not shown.
After Width: | Height: | Size: 3.2 KiB |
Loading…
Add table
Add a link
Reference in a new issue