Jump to content

Welcome to the Freedomain Radio Message Board


Sign In 

Create Account
If you're interested in joining the philosophical discussion, click "sign in" or "create account" on the right of the page. If you're creating a new account, please be sure to include an explanation as to why you're interested in joining the message board community. This verification requirement is included to cut down on possible troll and spam accounts.

If you have supported Freedomain Radio financially and would like immediate access to the message board - or - your donation status is incorrect, please contact Michael at operations@freedomainradio.com with your information and the situation will be addresses ASAP.
 
Guest Message by DevFuse

Saturday April 12th, 2014: Toronto Bitcoin Expo

Sunday April 13th, 2014: Sunday Call In Show at 10am Eastern

Monday April 14th, 2014: Peter Schiff Radio Show at 10am Eastern

Wednesday April 16th, 2014: Wednesday Call In Show at 8pm Eastern


56 Philosopher King files - 71 Gold files - 39 Silver files - 50 Bronze files


Update: A new silver level file on Peer Influence and Envy has been added! Click here to donate if you'd like access to the various premium sections. If your donator status is incorrect, please contact Michael at operations@freedomainradio.com with the relevant information and it will be corrected as soon as possible.

Photo

Suggestion: in-page podcast player for premium content


  • Please log in to reply
18 replies to this topic

#1
Kevin Beal

Kevin Beal

    :)


  • 1393 posts

I was noticing that in order to listen to premium content you have to download the file to your computer and then play it in iTunes or something like that. I think it would be cool to be able to play it straight in the page. Maybe it could just be a simple jPlayer like the one that was at the bottom right of the old chatroom. The podcast URL doesn't look like it's being loaded into the template and is behind some kind of api, so maybe the api can expose it, but if you can get it you can just throw it right into the jPlayer initializer.

 

jPlayer can be lame and fickle sometimes, but I've used it in a few projects and could help out if it seemed like a good idea.


  • 1

"There is no law, no compulsion, no law of physics or man that is preventing you from living the life that you want" - Stef (The Greatest Gift in the Entire Universe)


#2
JamesP

JamesP


  • 3637 posts

This is the sort of thing that I would like to see if there are any existing plugins because of the security settings we've got in place, but it's a good suggestion to put on the list.


  • 0

Connect with me: @jamesapyrich, Facebook, james-a-pyrich on Skype


Meetup with fellow local Freedomainers!

 

I accept BTC: 1DGcCf52Tnyc6pJbyQUwbiLj6Pkt6qHa3Y


#3
JamesP

JamesP


  • 3637 posts

This is done.



(There weren't any existing plugins... to get this done, I had to write a small hook to get the MIME type out of the database, then put jwplayer in there so that it would only load for mp3 files!)


  • 1

Connect with me: @jamesapyrich, Facebook, james-a-pyrich on Skype


Meetup with fellow local Freedomainers!

 

I accept BTC: 1DGcCf52Tnyc6pJbyQUwbiLj6Pkt6qHa3Y


#4
xelent

xelent

  • 2165 posts

Not sure whether this interested you guys.

 

http://www.podsnack.com/

 

They look pretty cool and customisable if you ask me, but then again I have no idea about the backend of course.


  • 0

#5
JamesP

JamesP


  • 3637 posts

I already implemented something. Please let me know if you have any issues.

 

I'm currently aware of an issue with the iPad.


  • 0

Connect with me: @jamesapyrich, Facebook, james-a-pyrich on Skype


Meetup with fellow local Freedomainers!

 

I accept BTC: 1DGcCf52Tnyc6pJbyQUwbiLj6Pkt6qHa3Y


#6
xelent

xelent

  • 2165 posts

Ah, sorry James, seems I didn't read your last post to mine properly. That works just fine for me at least.


  • 0

#7
Kevin Beal

Kevin Beal

    :)


  • 1393 posts

Awesome! Works great :)


  • 0

"There is no law, no compulsion, no law of physics or man that is preventing you from living the life that you want" - Stef (The Greatest Gift in the Entire Universe)


#8
Kevin Beal

Kevin Beal

    :)


  • 1393 posts

I just realized that the jwplayer doesn't play the podcast all the way thru, it actually stops somewhere around a half hour in :(

 

Other than that, it's a nice little player. Having a volume level would be cool to have on the player, but I can just adjust my speakers, no big deal. The stopping half way thing tho makes me cry just a little bit :_(


  • 0

"There is no law, no compulsion, no law of physics or man that is preventing you from living the life that you want" - Stef (The Greatest Gift in the Entire Universe)


#9
JamesP

JamesP


  • 3637 posts

You've got to shoehorn it in to the template a bit... perhaps you could come up with a jPlayer version that I can stick in there? jQuery 1.7 is what's loaded on this site.

 

I need to know what files to download (they should be located in /public/jplayer/), and if you can give me a code block that references a mp3 file, hopefully that will be enough to fix the odd issues we're seeing with jwplayer.

 

I have heard one or two other reports that podcasts stop downloading before they're complete, though, so it might not be an issue with the player.  It might then be worth opening a bug with ip.board or something.


  • 0

Connect with me: @jamesapyrich, Facebook, james-a-pyrich on Skype


Meetup with fellow local Freedomainers!

 

I accept BTC: 1DGcCf52Tnyc6pJbyQUwbiLj6Pkt6qHa3Y


#10
Kevin Beal

Kevin Beal

    :)


  • 1393 posts

I'll throw something together soon!


  • 0

"There is no law, no compulsion, no law of physics or man that is preventing you from living the life that you want" - Stef (The Greatest Gift in the Entire Universe)


#11
Kevin Beal

Kevin Beal

    :)


  • 1393 posts

Here's a working couple of snippets using jQuery 1.7.1 and the newest jPlayer.

<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.7.1/jquery.min.js"></script>
<script type="text/javascript" src="http://jplayer.org/2.4.0/js/jquery.jplayer.min.js"></script>

Here's a player skin that looks almost exactly like the JWPlayer currently being used (includes volume bar) with the correct CSS classes attached to the right elements for the player to actually do stuff:

<link href="http://dl.dropbox.com/u/2557221/online/demos/jplayer-black-and-yellow/skin/jplayer-black-and-yellow.css" rel="stylesheet" type="text/css">

<div id="jPlayer-holder" class="jp-jplayer" style="background-color: rgb(0, 0, 0);"></div>

<div class="jp-audio-container">
    <div class="jp-audio">
        <div class="jp-type-single">
            <div id="jp_interface_1" class="jp-interface">
                <ul class="jp-controls">
                    <li><a class="jp-play" tabindex="1" style="display: block;">play</a></li>
                    <li><a class="jp-pause" tabindex="1" style="display: none;">pause</a></li>
                    <li><a class="jp-mute" tabindex="1" style="">mute</a></li>
                    <li><a class="jp-unmute" tabindex="1" style="display: none;">unmute</a></li>
                </ul>

                <div class="jp-progress-container">
                    <div class="jp-progress">
                        <div class="jp-seek-bar" style="width: 100%;">
                            <div class="jp-play-bar"></div>
                        </div>
                    </div>
                </div>

                <div class="jp-volume-bar-container">
                    <div class="jp-volume-bar" id="volumeBar">
                        <div class="jp-volume-bar-value" style="width: 80%;"></div>
                    </div>
                </div>
            </div>
        </div>
    </div>
</div>

And here's a mini jQuery plugin I just wrote to initialize the player knowing only the element you're loading the player into and the path to the mp3 file:

(function($){
    $.fn.playerInit = function(podcastURL) {
        this.jPlayer({
            ready : function(event) {
                $(this).jPlayer('setMedia', {
                    mp3: podcastURL
                });
            },
            preload  : 'auto',
            swfPath  : 'http://www.jplayer.org/latest/js/Jplayer.swf',
            supplied : 'mp3',
            solution : 'flash, html',
            cssSelectorAncestor : '.jp-audio-container'
        });
    }
})(jQuery);

You initialize it by using:

$('#jPlayer-holder').playerInit('http://media.freedomainradio.com/feed/FDR_2443_Truth_About_Bradley_Manning.mp3');

This has been tested in Chrome and Firefox. I have no windows computer to test it with, so I don't know about the IE browsers. The online tool BrowserStack doesn't support flash apparently which is required since the podcasts only come in mp3 and not ogg (damn you Firefox!).

 

Here's a link to a working demo of exactly the code above. (It won't work locally on your computer so you have to develop it remotely.)


  • 2

"There is no law, no compulsion, no law of physics or man that is preventing you from living the life that you want" - Stef (The Greatest Gift in the Entire Universe)


#12
JamesP

JamesP


  • 3637 posts

Hey, can you give me a ZIP or something that contains all of necessary files? I implemented the player but I think there are some XSS issues preventing the SWF from reading the mp3 file.


  • 0

Connect with me: @jamesapyrich, Facebook, james-a-pyrich on Skype


Meetup with fellow local Freedomainers!

 

I accept BTC: 1DGcCf52Tnyc6pJbyQUwbiLj6Pkt6qHa3Y


#13
Kevin Beal

Kevin Beal

    :)


  • 1393 posts

Hey, can you give me a ZIP or something that contains all of necessary files? I implemented the player but I think there are some XSS issues preventing the SWF from reading the mp3 file.

 

Heya James!

 

So I've got a .zip here containing:

- The stylesheet

- The sprite for that stylesheet

- the .swf file for jPlayer 2.4.0

- and jPlayer.2.4.0.min.js

 

Here's the download link.

 

It appears to me that the only thing wrong with the player is that the stylesheet isn't being loaded. I did however run into an issue like you're describing when I tried to develop it on my machine, but Chrome prevents .swf files from being loaded (remotely) when you do that for security reasons I don't understand.

 

If you do use these files you may have to update the paths used like in the swfPath property of the jPlayer initializer and for the image in the stylesheet.

 

Also I noticed that all jQuery selectors are returning null on this domain. In the javascript console, I tried doing this:

$('head').append('<link href="http://dl.dropbox.com/u/2557221/online/demos/jplayer-black-and-yellow/skin/jplayer-black-and-yellow.css" rel="stylesheet" type="text/css">');

so that I could load in the stylesheet, but all selectors (or any usage of $() for that matter) returns null. On a global level anyway. Maybe it's a security thing I've just never encountered before.

 

I did use the Chrome developer tools to insert the stylesheet, and it seemed to work just fine. That is Chrome anyway...

 

Let me know if I can provide any more help!


  • 0

"There is no law, no compulsion, no law of physics or man that is preventing you from living the life that you want" - Stef (The Greatest Gift in the Entire Universe)


#14
JamesP

JamesP


  • 3637 posts

Yes, it's a XSS (cross-site scripting) prevention thing that became standard in the past few years.  What that means (among other things) is that the browser won't transfer cookies across different hostnames unless you explicitly indicate that it's OK to do so.  This is a problem for the download files since the files are effectively behind a paywall (so to speak).

 

It's just easier to make sure everything is on the same server, or that you control all the domains in question.

 

----

 

OK, cool, it seems to be working OK, at least initially.

 

One question: can we not have it automatically start downloading right away? I think that will inflate the download count.


  • 0

Connect with me: @jamesapyrich, Facebook, james-a-pyrich on Skype


Meetup with fellow local Freedomainers!

 

I accept BTC: 1DGcCf52Tnyc6pJbyQUwbiLj6Pkt6qHa3Y


#15
Kevin Beal

Kevin Beal

    :)


  • 1393 posts

To not have it download right away you can change the jPlayer initializer "preload" property to "none". like so: 

(function($){
    $.fn.playerInit = function(podcastURL) {
        this.jPlayer({
            ready : function(event) {
                $(this).jPlayer('setMedia', {
                    mp3: podcastURL
                });
            },
            preload  : "none", // RIGHT HERE <----
            swfPath  : 'http://www.jplayer.org/latest/js/Jplayer.swf',
            supplied : 'mp3',
            solution : 'flash, html',
            cssSelectorAncestor : '.jp-audio-container'
        });
    }
})(jQuery);

In the documentation they do warn though that: "Preload is a hint to the user agent, not a command. Some browsers ignore this option."

 

I think generally it works fine and am not aware of what the exception to this rule is.


  • 1

"There is no law, no compulsion, no law of physics or man that is preventing you from living the life that you want" - Stef (The Greatest Gift in the Entire Universe)


#16
JamesP

JamesP


  • 3637 posts

Cool, man, thanks! Skipping the preload works in Firefox at least :)


  • 0

Connect with me: @jamesapyrich, Facebook, james-a-pyrich on Skype


Meetup with fellow local Freedomainers!

 

I accept BTC: 1DGcCf52Tnyc6pJbyQUwbiLj6Pkt6qHa3Y


#17
Kevin Beal

Kevin Beal

    :)


  • 1393 posts

Works in Chrome too! Very cool :)


  • 0

"There is no law, no compulsion, no law of physics or man that is preventing you from living the life that you want" - Stef (The Greatest Gift in the Entire Universe)


#18
MMD

MMD


  • 752 posts

Kevin to the rescue! :)


  • 1

#19
Kevin Beal

Kevin Beal

    :)


  • 1393 posts

Lol. Thanks Mike :)

 

It feels good to help out. 


  • 0

"There is no law, no compulsion, no law of physics or man that is preventing you from living the life that you want" - Stef (The Greatest Gift in the Entire Universe)





0 user(s) are reading this topic

0 members, 0 guests, 0 anonymous users