* refactor more stuff into listenBroadcast jquery plugin in preparation of doing VRFS-1261
This commit is contained in:
parent
8c9546918f
commit
cc44c00865
|
|
@ -69,80 +69,13 @@
|
|||
return false;
|
||||
}
|
||||
|
||||
function refresh() {
|
||||
return rest.getSession(musicSessionId)
|
||||
.done(function(response) {
|
||||
// we only refresh for sessions that are playing (no reason to bother for ended ones).
|
||||
// so if we got a response. Then that's it. We are still OK
|
||||
})
|
||||
.fail(function(jqXHR) {
|
||||
if(jqXHR.status == 404 || jqXHR.status == 403) {
|
||||
$controls.trigger('destroy.listenBroadcast').removeClass('inprogress').addClass('ended')
|
||||
$status.text("SESSION ENDED");
|
||||
}
|
||||
else if(jqXHR.status >= 500 && jqXHR.status <= 599){
|
||||
$status.text('SERVER ERROR')
|
||||
stopPlay();
|
||||
}
|
||||
else{
|
||||
$status.text("NO NETWORK")
|
||||
stopPlay();
|
||||
}
|
||||
})
|
||||
}
|
||||
|
||||
function stateChange(e, data) {
|
||||
var state = data.state;
|
||||
if(data.displayText) $status.text(data.displayText);
|
||||
|
||||
if(state == 'none') {
|
||||
//$status.text('SESSION IN PROGRESS');
|
||||
}
|
||||
else if(state == 'initializing') {
|
||||
$status.text('PREPARING AUDIO');
|
||||
}
|
||||
else if(state == 'buffering') {
|
||||
if(data.isEnd) stopPlay();
|
||||
|
||||
}
|
||||
else if(state == 'playing') {
|
||||
$status.text('SESSION IN PROGRESS');
|
||||
}
|
||||
else if(state == 'stalled') {
|
||||
$status.text('RECONNECTING');
|
||||
}
|
||||
else if(state == 'ended' || state == 'session_over') {
|
||||
$status.text('STREAM DISCONNECTED');
|
||||
stopPlay();
|
||||
refresh();
|
||||
}
|
||||
else if(state == 'retrying_play') {
|
||||
if(data.retryCount == 2) {
|
||||
$status.text('STILL TRYING, HANG ON');
|
||||
}
|
||||
}
|
||||
else if(state == 'failed_start') {
|
||||
$status.text('AUDIO DID NOT START');
|
||||
stopPlay();
|
||||
}
|
||||
else if(state == 'failed_playing') {
|
||||
$status.text('AUDIO FAILED');
|
||||
stopPlay();
|
||||
refresh();
|
||||
}
|
||||
else if(state == 'network_error') {
|
||||
$status.text('NO NETWORK');
|
||||
stopPlay();
|
||||
}
|
||||
else if(state == 'server_error') {
|
||||
$status.text('SERVER ERROR');
|
||||
stopPlay();
|
||||
}
|
||||
else if(state == 'concurrent_stop') {
|
||||
console.log("CONCURRENT STOP")
|
||||
$status.text('SESSION IN PROGRESS');
|
||||
stopPlay();
|
||||
}
|
||||
else {
|
||||
logger.error("unknown state: " + state)
|
||||
if(data.isSessionOver) {
|
||||
$controls.removeClass('inprogress').addClass('ended')
|
||||
}
|
||||
}
|
||||
|
||||
|
|
@ -158,6 +91,7 @@
|
|||
$('.timeago', $feedItem).timeago();
|
||||
$('.dotdotdot', $feedItem).dotdotdot();
|
||||
$controls.listenBroadcast();
|
||||
|
||||
context.JK.prettyPrintElements($('time.duration', $feedItem));
|
||||
context.JK.setInstrumentAssetPath($('.instrument-icon', $feedItem));
|
||||
|
||||
|
|
@ -166,14 +100,16 @@
|
|||
events();
|
||||
|
||||
|
||||
// this is a bit lame, because this is a singleton. the idea is, if there are any session widgets on the page, then we start ticking time
|
||||
// this is a bit lame, because this is a singleton.
|
||||
// the idea is, if there are any session widgets on the page, then we start ticking time
|
||||
if(!context.JK.FeedItemSessionTimer) {
|
||||
context.JK.FeedItemSessionTimer = setInterval(function() {
|
||||
$.each($('.feed-entry.music-session-history-entry .inprogress .session-duration'), function(index, item) {
|
||||
var $duration = $(item);
|
||||
|
||||
var createdAt = new Date($duration.attr('data-created-at'))
|
||||
var createdAt = new Date(Number($duration.attr('data-created-at')) * 1000)
|
||||
var millisElapsed = (new Date()).getTime() - createdAt.getTime();
|
||||
console.log("createdAt, millis", createdAt, millisElapsed);
|
||||
$duration.text(context.JK.prettyPrintSeconds( parseInt(millisElapsed / 1000)));
|
||||
});
|
||||
}, 333);
|
||||
|
|
|
|||
|
|
@ -75,7 +75,7 @@
|
|||
|
||||
context.JK.ListenBroadcastCurrentlyPlaying = self;
|
||||
|
||||
rest.getSession(musicSessionId)
|
||||
checkServer()
|
||||
.done(function(response) {
|
||||
audioDomElement.play();
|
||||
|
||||
|
|
@ -86,17 +86,6 @@
|
|||
// keep this after transition, because any transition clears this timer
|
||||
waitForBufferingTimeout = setTimeout(noBuffer, WAIT_FOR_BUFFER_TIMEOUT);
|
||||
})
|
||||
.fail(function(jqXHR) {
|
||||
if(jqXHR.status == 404 || jqXHR.status == 403) {
|
||||
transition(PlayStateSessionOver);
|
||||
}
|
||||
else if(jqXHR.status >= 500 && jqXHR.status <= 599){
|
||||
transition(PlayStateServerError);
|
||||
}
|
||||
else {
|
||||
transition(PlayStateNetworkError);
|
||||
}
|
||||
})
|
||||
}
|
||||
|
||||
function forcedPause() {
|
||||
|
|
@ -119,7 +108,7 @@
|
|||
recreateAudioElement();
|
||||
}
|
||||
|
||||
function destroy(e) {
|
||||
function destroy() {
|
||||
if(!destroyed) {
|
||||
$audio.remove();
|
||||
$audio = null;
|
||||
|
|
@ -150,6 +139,7 @@
|
|||
waitForBufferingTimeout = null;
|
||||
}
|
||||
}
|
||||
|
||||
function transition(newState) {
|
||||
logger.debug("transitioning from " + playState + " to " + newState);
|
||||
|
||||
|
|
@ -167,7 +157,7 @@
|
|||
context.JK.ListenBroadcastCurrentlyPlaying = null;
|
||||
}
|
||||
|
||||
$parent.triggerHandler('statechange.listenBroadcast', {state: playState, retryCount: retryAttempts});
|
||||
triggerStateChange();
|
||||
}
|
||||
|
||||
function noBuffer() {
|
||||
|
|
@ -190,8 +180,6 @@
|
|||
|
||||
waitForBufferingTimeout = setTimeout(noBuffer, WAIT_FOR_BUFFER_TIMEOUT);
|
||||
}
|
||||
|
||||
|
||||
}
|
||||
|
||||
function isNoisyEvent(eventName) {
|
||||
|
|
@ -282,6 +270,98 @@
|
|||
}
|
||||
}
|
||||
|
||||
function checkServer() {
|
||||
return rest.getSession(musicSessionId)
|
||||
.fail(function(jqXHR) {
|
||||
if(jqXHR.status == 404 || jqXHR.status == 403) {
|
||||
transition(PlayStateSessionOver);
|
||||
destroy();
|
||||
}
|
||||
else if(jqXHR.status >= 500 && jqXHR.status <= 599){
|
||||
transition(PlayStateServerError);
|
||||
}
|
||||
else {
|
||||
transition(PlayStateNetworkError);
|
||||
}
|
||||
})
|
||||
}
|
||||
|
||||
function triggerStateChange() {
|
||||
|
||||
var isEnd = false;
|
||||
var isSessionOver = false;
|
||||
var displayText = null;
|
||||
var refresh = false;
|
||||
|
||||
if(playState == 'none') {
|
||||
//$status.text('SESSION IN PROGRESS');
|
||||
}
|
||||
else if(playState == 'initializing') {
|
||||
displayText = 'PREPARING AUDIO';
|
||||
}
|
||||
else if(playState == 'buffering') {
|
||||
|
||||
}
|
||||
else if(playState == 'playing') {
|
||||
displayText = 'SESSION IN PROGRESS';
|
||||
}
|
||||
else if(playState == 'stalled') {
|
||||
displayText = 'RECONNECTING';
|
||||
}
|
||||
else if(playState == 'ended') {
|
||||
displayText = 'STREAM DISCONNECTED';
|
||||
isEnd = true;
|
||||
refresh = true;
|
||||
}
|
||||
else if(playState == 'session_over') {
|
||||
displayText = 'SESSION ENDED';
|
||||
isEnd = true;
|
||||
isSessionOver = true;
|
||||
}
|
||||
else if(playState == 'retrying_play') {
|
||||
if(retryAttempts == 2) {
|
||||
displayText = 'STILL TRYING, HANG ON';
|
||||
}
|
||||
}
|
||||
else if(playState == 'failed_start') {
|
||||
displayText = 'AUDIO DID NOT START';
|
||||
isEnd = true;
|
||||
}
|
||||
else if(playState == 'failed_playing') {
|
||||
displayText = 'AUDIO FAILED';
|
||||
isEnd = true;
|
||||
refresh = true;
|
||||
}
|
||||
else if(playState == 'network_error') {
|
||||
displayText = 'STREAM DISCONNECTED';
|
||||
isEnd = true;
|
||||
}
|
||||
else if(playState == 'server_error') {
|
||||
displayText = 'SERVER ERROR';
|
||||
isEnd = true;
|
||||
}
|
||||
else if(playState == 'concurrent_stop') {
|
||||
displayText = 'SESSION IN PROGRESS';
|
||||
isEnd = true;
|
||||
}
|
||||
else {
|
||||
logger.error("unknown state: " + playState)
|
||||
}
|
||||
|
||||
$parent.triggerHandler('statechange.listenBroadcast',
|
||||
{
|
||||
state: playState,
|
||||
displayText: displayText,
|
||||
isEnd: isEnd,
|
||||
isSessionOver: isSessionOver
|
||||
})
|
||||
|
||||
// we have cause to believe the session is done; check against the server
|
||||
if(refresh) {
|
||||
checkServer();
|
||||
}
|
||||
}
|
||||
|
||||
function audioBind() {
|
||||
$audio.bind('play', onPlay);
|
||||
$audio.bind('playing', onPlaying);
|
||||
|
|
|
|||
|
|
@ -5,6 +5,7 @@
|
|||
var rest = new JK.Rest();
|
||||
var sessionId = null;
|
||||
|
||||
|
||||
function like() {
|
||||
rest.addSessionLike(sessionId, JK.currentUserId)
|
||||
.done(function(response) {
|
||||
|
|
|
|||
|
|
@ -66,7 +66,7 @@
|
|||
<% end %>
|
||||
</audio>
|
||||
<% if @music_session.music_session.nil? || @music_session.music_session.mount.blank? %>
|
||||
<div>No audio available</div>
|
||||
<div>NO AUDIO AVAILABLE</div>
|
||||
<% end %>
|
||||
<% else %>
|
||||
<div class="session-status-ended">LIVE SESSION ENDED</div>
|
||||
|
|
@ -113,33 +113,5 @@
|
|||
$(function () {
|
||||
var showMusicSession = new JK.ShowMusicSession(JK.app);
|
||||
showMusicSession.initialize("<%= @music_session.id %>");
|
||||
|
||||
// remainder of this code is related to playing/pausing the session
|
||||
var htmlAudio = $(".recording-controls").find('audio').get(0);
|
||||
var $imgPlayPauseSelector = $("#imgPlayPause");
|
||||
var playButtonPath = '/assets/content/icon_playbutton.png';
|
||||
var pauseButtonPath = '/assets/content/icon_pausebutton.png';
|
||||
|
||||
// this updates the current play time
|
||||
$(htmlAudio).on('timeupdate', function() {
|
||||
$(".recording-current").html(context.JK.prettyPrintSeconds (htmlAudio.currentTime));
|
||||
|
||||
// reset icon to play when done
|
||||
if (percentComplete === 100) {
|
||||
$imgPlayPauseSelector.attr('src', playButtonPath);
|
||||
}
|
||||
});
|
||||
|
||||
$("#btnPlayPause").click(function() {
|
||||
if (htmlAudio.paused) {
|
||||
htmlAudio.play();
|
||||
$imgPlayPauseSelector.attr('src', pauseButtonPath);
|
||||
}
|
||||
else {
|
||||
htmlAudio.pause();
|
||||
$imgPlayPauseSelector.attr('src', playButtonPath);
|
||||
}
|
||||
});
|
||||
});
|
||||
</script>
|
||||
<% end %>
|
||||
|
|
|
|||
|
|
@ -25,7 +25,7 @@
|
|||
.session-status
|
||||
= feed_item.is_over? ? 'SESSION ENDED' : 'SESSION IN PROGRESS'
|
||||
/ current playback time
|
||||
= session_duration(feed_item, class: 'session-duration recording-current', 'data-created-at' => feed_item.created_at)
|
||||
= session_duration(feed_item, class: 'session-duration recording-current', 'data-created-at' => feed_item.created_at.to_i)
|
||||
/ end recording play controls
|
||||
/ genre and social
|
||||
.left.small
|
||||
|
|
|
|||
Loading…
Reference in New Issue