CODEWITHSUNDEEP
jqueryhtml5-audiojplayer
Duke Hall
Duke Hall

Reputation: 582

jQuery jPlayer - enable download for client?

I am looking to enable functionality (i.e. a button) for the client to download the sound file through jplayer. I have already looked briefly in the Developer's guide and Google group for this functionality without success.

If it is of any help, here is my code for it:

<div id="jquery_jplayer_1" class="jp-jplayer"></div>
<div id="jp_container_1" class="jp-audio">
    <div class="jp-type-single">
        <div class="jp-gui jp-interface">
            <ul class="jp-controls">
                <li><a href="javascript:;" class="jp-play" tabindex="1">play</a></li>
                <li><a href="javascript:;" class="jp-pause" tabindex="1">pause</a></li>
                <li><a href="javascript:;" class="jp-stop" tabindex="1">stop</a></li>
                <li><a href="javascript:;" class="jp-mute" tabindex="1" title="mute">mute</a></li>
                <li><a href="javascript:;" class="jp-unmute" tabindex="1" title="unmute">unmute</a></li>
                <li><a href="javascript:;" class="jp-volume-max" tabindex="1" title="max volume">max volume</a></li>
            </ul>
            <div class="jp-progress">
                <div class="jp-seek-bar">
                    <div class="jp-play-bar"></div>
                </div>
            </div>
            <div class="jp-volume-bar">
                <div class="jp-volume-bar-value"></div>
            </div>
            <div class="jp-time-holder">
                <div class="jp-current-time"></div>
                <div class="jp-duration"></div>
                <ul class="jp-toggles">
                    <li><a href="javascript:;" class="jp-repeat" tabindex="1" title="repeat">repeat</a></li>
                    <li><a href="javascript:;" class="jp-repeat-off" tabindex="1" title="repeat off">repeat off</a></li>
                </ul>
            </div>
        </div>
        <div class="jp-title">
            <ul>
                <li>Voice Recording</li>
            </ul>
        </div>
        <div class="jp-no-solution">
            <span>Update Required</span>
            To play the media you will need to either update your browser to a recent version or update your <a href="http://get.adobe.com/flashplayer/" target="_blank">Flash plugin</a>.
        </div>
    </div>
</div>

Thanks in advance.

Upvotes: 1

Views: 3918

Answers (1)

Lloyd
Lloyd

Reputation: 8396

You could use the "jPlayer Playlist Add-on". See the section "Defining Playlist Content" for info how to set the free property for a track (which automatically generates links allowing it to be downloaded).

http://www.jplayer.org/latest/demo-02-jPlayerPlaylist/

The second parameter is an Array of Objects used to define the playlist. The object elements are used by the jPlayer setMedia command, so follow the rules for suppling the formats defined in the supplied option. The title, artist and free properties are used by jPlayerPlaylist to display each item. To start with an empty playlist, use an empty array, []. A playlist with a single audio item looks like:

[
  {
    title:"The Title",
    artist:"The Artist", // Optional
    free: Boolean, // Optional - Generates links to the media
    mp3:"MP3 URL", // Dependant on supplied option
    oga:"OGA URL", // Dependant on supplied option
    poster: "Poster URL" // Optional
  }
]

Upvotes: 1

Related Questions