Playing media across multiple webpages

Question

I want to implement a radio type system on site I am making. The problem is when a user is playing music and then browses to a different part of the site, the music will stop. I was wondering if there is someway to make the music play across multiple pages without using ajax? I know I can use Ajax and then just reload each page with a Ajax call to get the page, the problem is then that the pages won't be able to be bookmarked.

So is there other way or will I need to use ajax in order for this to work.

You can probably store the position of the audio in a cookie or session variable. — , Aug 01 '13 at 12:49
@remyabel - this would create gaps in the audio, and as a "radio" system I would assume its broadcasting so reloading will put it at the current place in broadcast without the JavaScript/cookie tracking. — JSON, Aug 01 '13 at 12:57
@Salketer - no argument - but what he's asking is impossible unless he prevents changing at least part of the "page"s state. This will require ajax or frames. Get back to /me/ if you can think of a different way. — JSON, Aug 01 '13 at 13:02
@ClosetGeek pop-up! :) Most of radio sites do that so users can keep radio open without having to stay on the website. I am not fan of this, but it does not use ajax or frames. — Salketer, Aug 01 '13 at 13:07
@Salketer is right that the best solution is ajax. If thos isn't possible (such as if your working with an existing site/pages and changing is out of question) you'll have to find a work-around for bookmarking. — JSON, Aug 01 '13 at 13:15
See here http://stackoverflow.com/a/1468/1681097 you can use AJAX, as there is a way to change the URL bar — Adi Bradfield, Aug 01 '13 at 13:19
I think Salketer is on the right track with the popup. it's usually a bad practice and some users will block them, but your options are pretty limited. — JSON, Aug 01 '13 at 13:20

score 0 · Accepted Answer · edited May 23 '17 at 11:49

The best solution remains AJAX exactly as you planned. And also, as you planned, the browser history (and bookmarking) won't work correctly unless you use history.js. I'll let you read more from another post: How to "bookmark" page or content fetched using AJAX? content-fetched-using-ajax

Edit to help AJAX implementation: Without seeing your code, it is hard to say if it is gonna work, but something similar to this very generic script could turn any website from "regular" to ajax driven, with jQuery:

$('body').on('click','a',ajaxContentReplace);
$('body').on('submit','form',ajaxContentReplace);
function ajaxContentReplace(){
    if($(this).is('form'){
        // Will send form data in POST and retrieve the html in #container to put it in #container.
        $('#container').load($(this).prop('action')+' #container',$(this).serializeArray);
    }else{
        // Will retrieve the hole page and put the content of #container in #container of the current page.
        $('#container').load($(this).prop('href')+' #container');
    }
}

This is just a quick solution that works on some Basic websites, it might not do all you need but is still a start.

Edit: As I pointed out in the comments of the question, popular radio stations use a pop-up to play te radio, that way users can leave their website and still listen to the radio. It also is a very easy implementation.

This is the best solution, but it doesn't answer his question. In fact he states specifically that he doesn't wish to use ajax. — JSON, Aug 01 '13 at 13:10
He states that he does not want to use AJAX because of a problem with bookmarks... I'm letting him know that this can be solved. — Salketer, Aug 01 '13 at 13:16
Thanks, I guess I will just end up using ajax to get it to work and use the information from the link "Salketer" gave on bookmarking. Plus a pop up is just a no go, good idea but just won't work for what I what I want to do. — Wes, Aug 02 '13 at 02:17
Edited my answer to give a little heads up on starting the AJAX roll out. — Salketer, Aug 02 '13 at 09:19

Playing media across multiple webpages

1 Answers1