* refactor more stuff into listenBroadcast jquery plugin in preparation of doing VRFS-1261

This commit is contained in:
Seth Call 2014-02-28 04:19:39 +00:00
parent 8c9546918f
commit cc44c00865
5 changed files with 108 additions and 119 deletions

View File

@ -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);

View File

@ -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);

View File

@ -5,6 +5,7 @@
var rest = new JK.Rest();
var sessionId = null;
function like() {
rest.addSessionLike(sessionId, JK.currentUserId)
.done(function(response) {

View File

@ -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 %>

View File

@ -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