--- a/scripts/ajax.js Fri Jun 12 13:49:22 2009 -0400
+++ b/scripts/ajax.js Fri Jun 12 13:50:13 2009 -0400
@@ -12,7 +12,7 @@
*/
var ajax;
-var is_playing = false, current_track = -1, current_track_length, current_track_pos, ct_advance_timeout = false, ct_counter = false, playlist_md5 = false, first_load = true;
+var is_playing = false, current_track = -1, current_track_length, current_track_pos, ct_advance_timeout = false, ct_counter = false, playlist_md5 = false, first_load = true, offline_mode = false;
var onload_hooks = new Array();
@@ -47,11 +47,74 @@
}
}
+// preload "offline mode" large icon
+var preload = ['/offlinemodelarge.png', 'trans80.png']
+for ( var i = 0; i < preload.length; i++ )
+{
+ var img = new Image();
+ img.src = preload[i];
+}
+
+function offline_mode_on()
+{
+ unsetAjaxLoading();
+ document.getElementById('offlinemode').style.display = 'block';
+ offline_mode = true;
+}
+
+function offline_mode_off()
+{
+ document.getElementById('offlinemode').style.display = 'none';
+ offline_mode = false;
+}
+
+function verify_online()
+{
+ if ( !offline_mode )
+ return true;
+
+ flash_offline();
+ return false;
+}
+
+function flash_offline()
+{
+ if ( document.getElementById('offlinebox') )
+ return false;
+
+ var box = document.createElement('div');
+ $(box)
+ .css('position', 'absolute')
+ .css('padding', '50px 80px')
+ .css('background-image', 'url(/trans80.png)')
+ .css('color', 'black')
+ .css('text-align', 'center')
+ .attr('id', 'offlinebox')
+ .opacity(0);
+
+ var image = document.createElement('img');
+ image.src = '/offlinemodelarge.png';
+ box.appendChild(image);
+
+ document.body.appendChild(box);
+
+ $(box)
+ .css('top', (( getHeight() / 2 ) - ( $(box).Height() / 2 ) + getScrollOffset()) + 'px')
+ .css('left', (( $(document.body).Width() / 2 ) - ( $(box).Width() / 2 )) + 'px');
+
+ $(box).fadeIn(250);
+ window.setTimeout(function()
+ {
+ $(box).fadeOut(250);
+ window.setTimeout(function()
+ {
+ document.body.removeChild(box);
+ }, 250);
+ }, 1000);
+}
+
function ajaxGet(uri, f)
{
- if ( ajax_panicked )
- return false;
-
if (window.XMLHttpRequest)
{
ajax = new XMLHttpRequest();
@@ -75,9 +138,6 @@
function ajaxPost(uri, parms, f)
{
- if ( ajax_panicked )
- return false;
-
if (window.XMLHttpRequest)
{
ajax = new XMLHttpRequest();
@@ -127,8 +187,9 @@
setAjaxLoading();
ajaxGet('/action.json/refresh', function()
{
- if ( ajax.readyState == 4 && ajax.status == 200 )
+ if ( ajax.readyState == 4 && ajax.status == 200 && ( (window.location.hash != '#offlinemode' && !first_load ) || first_load ) )
{
+ offline_mode_off();
unsetAjaxLoading();
var response = (' ' + ajax.responseText).substr(1);
// quickie JSON parser :)
@@ -144,123 +205,111 @@
}
}
playlist_md5 = response.playlist_hash;
- // update track number
- if ( response.current_track != current_track )
- {
- var ot_id = 'track_' + current_track;
- var nt_id = 'track_' + response.current_track;
- current_track = response.current_track;
- if ( $(ot_id).hasClass('current') )
- {
- $(ot_id).rmClass('current');
- }
- if ( ! $(nt_id).hasClass('current') )
- {
- $(nt_id).addClass('current');
- }
- pulsar_reset();
- }
- // update playing status
- is_playing = response.is_playing;
- if ( allow_control )
- {
- var img = $('btn_playpause').object.getElementsByTagName('img')[0];
- if ( is_playing )
- {
- img.src = img_pause;
- }
- else
- {
- img.src = img_play;
- }
- }
- // update volume
- if ( response.volume != current_volume )
- {
- set_volume_fill(response.volume);
- current_volume = response.volume;
- }
- // auto-refresh on track advance
- if ( ct_advance_timeout )
- {
- clearTimeout(ct_advance_timeout);
- }
- // countdown/up timer
- var time_remaining = response.current_track_length - response.current_track_pos;
- current_track_length = response.current_track_length;
- current_track_pos = response.current_track_pos;
- if ( ct_counter )
- clearInterval(ct_counter);
- update_clock();
- // set page title
- updateTitle(response.current_track_artist, response.current_track_album, response.current_track_title);
-
- // if not playing, set the position slider to zero
- if ( !is_playing && !response.is_paused )
- {
- posslide_set_position(0);
- }
-
- // set advance timer
- if ( is_playing && time_remaining > 0 )
- {
- ct_advance_timeout = setTimeout(refresh_playlist, ( 1000 * time_remaining ));
- ct_counter = setInterval(update_clock, 1000);
- }
- if ( first_load )
- {
- first_load = false;
- jump_current_track();
- }
+ update_timers(response);
}
- else if ( ajax.readyState == 4 && ajax.status != 200 )
+ else if ( ajax.readyState == 4 && ( ajax.status != 200 || window.location.hash == '#offlinemode' ) )
{
- ajax_panic();
- console.debug(ajax);
+ if ( !offline_mode )
+ ajax_panic();
+ else
+ unsetAjaxLoading();
}
});
}
-var ajax_panicked = false;
+function update_timers(response)
+{
+ // update track number
+ if ( response.current_track != current_track )
+ {
+ var ot_id = 'track_' + current_track;
+ var nt_id = 'track_' + response.current_track;
+ current_track = response.current_track;
+ if ( $(ot_id).hasClass('current') )
+ {
+ $(ot_id).rmClass('current');
+ }
+ if ( ! $(nt_id).hasClass('current') )
+ {
+ $(nt_id).addClass('current');
+ }
+ pulsar_reset();
+ }
+ // update playing status
+ is_playing = response.is_playing;
+ if ( allow_control )
+ {
+ var img = $('btn_playpause').object.getElementsByTagName('img')[0];
+ if ( is_playing )
+ {
+ img.src = img_pause;
+ }
+ else
+ {
+ img.src = img_play;
+ }
+ }
+ // update volume
+ if ( response.volume != current_volume )
+ {
+ set_volume_fill(response.volume);
+ current_volume = response.volume;
+ }
+ // auto-refresh on track advance
+ if ( ct_advance_timeout )
+ {
+ clearTimeout(ct_advance_timeout);
+ }
+ // countdown/up timer
+ var time_remaining = response.current_track_length - response.current_track_pos;
+ current_track_length = response.current_track_length;
+ current_track_pos = response.current_track_pos;
+ if ( ct_counter )
+ clearInterval(ct_counter);
+ update_clock();
+
+ // set page title
+ updateTitle(response.current_track_artist, response.current_track_album, response.current_track_title);
+
+ // if not playing, set the position slider to zero
+ if ( !is_playing && !response.is_paused )
+ {
+ posslide_set_position(0);
+ }
+
+ // set advance timer
+ if ( is_playing && time_remaining > 0 )
+ {
+ ct_advance_timeout = setTimeout(refresh_playlist, ( 1000 * time_remaining ));
+ ct_counter = setInterval(update_clock, 1000);
+ }
+ if ( first_load )
+ {
+ first_load = false;
+ if ( window.iPhone )
+ {
+ setTimeout('jump_current_track();', 1000);
+ }
+ else
+ {
+ jump_current_track();
+ }
+ }
+}
function ajax_panic()
{
- // set error flag
- ajax_panicked = true;
-
- // scroll to the top
- window.scroll(0, 0);
-
- // stop events
- pulsar_reset();
- window.clearInterval(pl_refresh_id);
- if ( ct_counter )
- window.clearInterval(ct_counter);
- if ( pulsar_interval_id )
- window.clearInterval(pulsar_interval_id);
-
- // show error message
- var floater = document.createElement('div');
- floater.style.backgroundColor = '#ffffff';
- floater.style.opacity = 0.7;
- floater.style.filter = 'alpha(opacity=70)';
- floater.style.textAlign = 'center';
- floater.style.paddingTop = '120px';
- floater.style.position = 'fixed';
- floater.style.zIndex = '999';
- floater.style.width = '100%';
- floater.style.height = '100%';
- floater.style.top = '0px';
- floater.style.left = '0px';
- floater.style.color = '#000000';
- floater.innerHTML = 'There was a problem with a refresh request to the server. Please reload the page.';
- var body = document.getElementsByTagName('body')[0];
- body.appendChild(floater);
+ offline_mode_on();
}
function player_action(action)
{
+ if ( !verify_online() )
+ {
+ return false;
+ }
+
var act2 = action;
setAjaxLoading();
ajaxGet('/action.json/' + action, function()
@@ -275,6 +324,11 @@
function jump_to_song(tid)
{
+ if ( !verify_online() )
+ {
+ return false;
+ }
+
setAjaxLoading();
if ( tid == current_track )
return false;
@@ -345,8 +399,32 @@
});
}
+function offline_advance_track()
+{
+ var new_track = current_track + 1;
+ if ( !document.getElementById('track_' + new_track) )
+ new_track = 0;
+
+ update_timers({
+ is_playing: is_playing,
+ is_paused: false,
+ volume: current_volume,
+ current_track: new_track,
+ current_track_length: document.getElementById('track_' + new_track).getAttribute('amarok:length_sec'),
+ current_track_pos: 0,
+ current_track_artist: 'FIXME artist',
+ current_track_album: 'FIXME album',
+ current_track_title: 'FIXME title'
+ })
+}
+
function update_clock()
{
+ if ( offline_mode && current_track_pos > current_track_length )
+ {
+ offline_advance_track();
+ }
+
posslide_set_position((100 * (current_track_pos / current_track_length)));
var str = secs_to_string(current_track_pos) + '/' + secs_to_string(current_track_length);
$('playmeter').object.innerHTML = str;