jPlayer playbackRate Audio Speed Control for Podcast Player


Hits: 382  

Today one of my customer need Audio PlayBack Speed Control for HTML5 Audio Player. His requirement is that many people speak too slow on
podcasts. He wants to speed up the playback so that he don’t have to take so much time to listen to the podcast.

He actually wants button for speed [ 0.5x, 1x, 1.5x, 2x, 2.5x ] on HTML5 Audio using jPlayer.

jPlayer playbackRate

jPlayer playbackRate
Number : (Default: 1) : Defines the playback rate. Recommend that the jPlayer({defaultPlaybackRate}) matches this value during initilization.
http://jplayer.org/latest/developer-guide/#jPlayer-option-playbackRate

jQuery(“#jplayer”).jPlayer(“option”,”playbackRate”, 1.5);

jQuery(“#jplayer”).jPlayer(“options”,{defaultPlaybackRate : 1.5});

<script type="text/javascript">

var currentSpeedIdx = 1;  
var speeds = [ 0.5, 1, 1.5, 2, 2.5 ];

function jpSpeedControl()
{

currentSpeedIdx = currentSpeedIdx + 1 < speeds.length ? currentSpeedIdx + 1 : 0;

jQuery("#jplayer").jPlayer("option","playbackRate", speeds[currentSpeedIdx]);

jQuery("#jpSpeedControl").html( speeds[currentSpeedIdx] + 'x' );

}

</script>

<div id="jpSpeedControl" title="Speed" style="cursor:pointer;" onclick="jpSpeedControl();">1x</div>

phpMyStream


Hits: 4594  

phpMyStream is media re-stream panel, it use FFmpeg & rtmpdump linux utilities to take source as input then publish to other server like Red5 or Wowza.

phpMyStream

phpMyStream Server Requirement

– Web Server With Apache, PHP, MySQL
– RTMPDump
– FFmpeg
– RTMP Server (Wowza, Red5, Nginx)

phpMyStream-add-stream

RTMPDump Help

FFmpeg Help

phpMyStream-settings

Make Server for phpMyStream

Install rtmpdump
# yum install gcc
# yum install openssl-devel
# wget http://rtmpdump.mplayerhq.hu/download/rtmpdump-2.2e.tar.gz
# tar xvf rtmpdump-2.2e.tar.gz
# cd rtmpdump-2.2e
# make & make install

Install FFmpeg
# yum install ffmpeg ffmpeg-devel ffmpeg-libpostproc opencore-amr

Re-Stream Commands

# rtmpdump –live -r “[Source-Input-RTMP]” -p “http://domain.tv/” -W “http://static.domain.tv/player.swf” -q | ffmpeg -i – -re -isync -acodec copy -vcodec copy -f flv “[Destination-Output-RTMP]”

# rtmpdump -r “[Source-Input-RTMP]” -p “http://www.domain.co/” -T “[Token]” -o- | ffmpeg -re -i – -isync -acodec copy -vcodec copy -f flv “[Destination-Output-RTMP]”

# ffmpeg -re -i “[Source-Input-RTMP]” -y -vcodec libx264 -acodec aac -strict -2 -ar 44100 -f flv “[Destination-Output-RTMP]”

phpMyStream set scheduled task (per minute) to process every stream that need restreaming…

* * * * * curl -s -o /dev/null http://Server-IP/phpMyStream/cron.php

Re Stream Radio Shoutcast / Icecast using Node JS


Hits: 5575  

Re-stream Radio (Shoutcast/Icecast) Stream using Node.JS and get Metadata current playing song title… Use port forwarding to hide real shoutcast IP …. Avoid PHP script to damage Server with too many calls on radio server

Start Restream

> node radio.js

node.js>node radio.js
Server running at http://192.168.1.4:8007

Radio Stream connected!
{ ‘icy-notice1’: ‘<BR>This stream requires <a href=”http’,
‘icy-notice2’: ‘SHOUTcast Distributed Network Audio Server/Linux v1.9.8<BR>’,
‘icy-name’: ‘Radio HSL – Hit Hai Toh Bajega!’,
‘icy-genre’: ‘Indian Hindi Top40’,
‘icy-url’: ‘http’,
‘content-type’: ‘audio/mpeg’,
‘icy-pub’: ‘1’,
‘icy-metaint’: ‘32768’,
‘icy-br’: ’64’ }
StreamTitle=’Bullett Raja – Tamanche Pe Disco [1e92]’;StreamUrl=”;

Get MetaData

> node radio-metadata.js

node.js>node radio-metadata.js
Server listening on port 8079
Radio Stream connected!
StreamTitle=’Bullett Raja – Tamanche Pe Disco [1e92]’;StreamUrl=”;

Output in browser:
“StreamTitle=’Bullett Raja – Tamanche Pe Disco [1e92]’;StreamUrl=”;\u0000\u0000\u0000\u0000\u0000″

Secure Expired MP3 File


Hits: 3106  

Secure Expired MP3 File can be used for hiding real mp3 link inside html source using base64_encode, mcrypt_encrypt, base64_decode, mcrypt_decrypt and md5. MP3 link will be expired in few seconds then it will return No Access Page to protect MP3 files to hot linked.

I was working on Secured & Expired MP3 Link in HTML5 MP3 Player. Hope you already read previous article “Amazon S3 Expiring Link”

These functions are also useful when you need to secure & expire media links …

Remote Secure Token
Secure Token Plugin with PHP
– JavaScript Encryption Library

Secure Expired MP3

Demo: http://demo.svnlabs.com/securemp3/player.php

Red5 CMS


Hits: 3363  

Hope you already read our article for Media Streaming CMS.

Using Red5 CMS you can manage your Red5, Wowza, RTMP streams and publish using open source player. You can track your media content and embed on other websites.

Red5 Admin Login
red5-admin-login

Red5 CMS Home
red5-cms-home

Red5 CMS Categories
red5-cms-category

Red5 CMS Add Categories
red5-cms-category-add

Red5 Server Infomation
red5-server-info

Red5 Streams
red5-streams

Red5 CMS Edit Streams
red5-streams-edit

Red5 CMS Stream Offline
stream-offline

MP3 waveforms with PHP


Hits: 6588  

If you are thinking how soundcloud.com generates the waveform for sound MP3 player?

soundcloud-waveform

There are some audio processing libraries used to process MP3 files to WAV and then PNG / SVG images..

MP3 to WAV to PNG

1. LAME MP3 encoder/decoder

$ lame input.mp3 -f -m m -b 16 –resample 8 resampled.mp3 && lame –decode resampled.mp3 output.wav

2. SOX – Sound eXchange

$ sox output.wav −n spectrogram
$ sox output.wav -n spectrogram -Y 140 -l -r -o output.png

3. wav2png – Creates waveform pngs out of audio files

$ sox mp3-song.mp3 -c 1 -t wav – | wav2png -o mp3-song.png /dev/stdin
$ wav2png –foreground-color=2e4562ff –background-color=00000000 -o  output.png   input.wav

WaveForm generated using SOX

WaveForm Generator using SOX

Links:

https://github.com/afreiday/php-waveform-png
https://github.com/afreiday/php-waveform-svg
https://github.com/beschulz/wav2png
https://github.com/beschulz/wav2json
http://www.rarewares.org/mp3-lame-bundle.php

Liquidsoap GStreamer


Hits: 5582  

LiquidSoap Liquidsoap is a programming language to manage audio and video source streams for Icecast Radio server.

Liquidsoap is a powerful and flexible language for describing, creating or transforming streams. It offers rich operators and library that you can be used for making Icecast Radio Server.

Now Play Your Favorite Radio FM Stream in HTML5 Player…..
Live Audio Streaming, Internet Radio Player

Features

* It can play icecast stream from files, playlists, directories or scripted playlists.
* Liquidsoap used for scheduling of source streams.
* It help to Mix sources streams.
* It allows queuing of user requests.
* It allows sound compression, normalization, echo, volume, Blank detection.
* It is useful for rewriting and inserting Metadata in Radio Stream.
* It can play live stream play files and streams like Last.fm.
* It can output to Radio Server Icecast/Shoutcast (MP3/Ogg).
* It also support Video streams generation.

You can use it to stream RTMP MP3 stream to Icecast/Shoutcast using mplayer, rtmpdump or gstreamer …

GStreamer- open source multimedia framework

GStreamer provide a rich library to manage streaming audio/video with complex audio (mixing) and video (non-linear editing) processing.

#!/usr/bin/liquidsoap
set(“log.file.path”,”logs/gs.log”)
set(“log.file”,true)
set(“log.stdout”,true)
….
….
gst = input.gstreamer.audio(pipeline=”playbin uri=rtmp://server.com/livestream.mp3″)
output.icecast(%mp3(), host = “localhost”, port = 8000, password = “xxxxxx”, mount = “gst stream”, fallible=true, gst)

Common Errors

File format problem can display ^M characters

😉 : set ff=unix and then : x in vi editor

init: security exit, root euid (user)

😉 you need to run liq file with non root user

the variable input.gstreamer.audio used here has not been previously defined

😉 Define variable “input.gstreamer.audio” .. .find here https://github.com/savonet/liquidsoap/tree/master/scripts

Stay connected for more Audio / Video Programming ….

Audiojs.swf?playerInstance audiojs instances [%27audiojs0%27]


Hits: 4192  

If you are using audio.js as MP3 player or playlist …. on some browser it causing error 403 to access SWF file with player instance

http://yourdomain.com/audiojs/audiojs.swf?playerInstance=audiojs.instances[%27audiojs0%27]&datetime=1382426114401.4087

You need to make sure you have right permission on that SWF file and check JavaScript playerInstance below….

Firefox Error

403 Forbidden

http://yourdomain.com/audiojs/audiojs.swf?playerInstance=audiojs.instances[%27audiojs0%27]&datetime=1382426114401.4087

Solution:

Just replace code (Original audio.js)

flashSource: ‘\
<object classid=”clsid:D27CDB6E-AE6D-11cf-96B8-444553540000″ id=”$1″ width=”1″ height=”1″ name=”$1″ style=”position: absolute; left: -1px;”> \
<param name=”movie” value=”$2?playerInstance=’+audiojs+’.instances[\’$1\’]&datetime=$3″> \
<param name=”allowscriptaccess” value=”always”> \
<embed name=”$1″ src=”$2?playerInstance=’+audiojs+’.instances[\’$1\’]&datetime=$3″ width=”1″ height=”1″ allowscriptaccess=”always”> \
</object>’,

with

flashSource: ‘\
<object classid=”clsid:D27CDB6E-AE6D-11cf-96B8-444553540000″ id=”$1″ width=”1″ height=”1″ name=”$1″ style=”position: absolute; left: -1px;”> \
<param name=”movie” value=”$2?playerInstance=’+audiojs+’.instances[&quot;$1&quot;]&datetime=$3″> \
<param name=”allowscriptaccess” value=”always”> \
<embed name=”$1″ src=”$2?playerInstance=’+audiojs+’.instances[&quot;$1&quot;]&datetime=$3″ width=”1″ height=”1″ allowscriptaccess=”always”> \
</object>’,

This is not permission (0755 or 0777) error of SWF file, Make sure you have valid characters on some browsers…

instances[\’$1\’] => instances[&quot;$1&quot;] 😉

Media Streaming CMS


Hits: 11893  

WMSPanel is reporting and control cloud panel for Nimble Streamer and Wowza Streaming Engine. It’s also used as a control UI for Live Transcoder for Nimble Streamer

wmspanel

Kaltura, the Open Source Community provides tools such as: online video player, open source editor and open source video for websites.

Kaltura CMS
Kaltura CMS

EZserver is an Easy-to-Use Video Server to let you easily install, manage and provide video service. And, it is also integrated with IP Blocker, Player Filter, Time Shift, DVR, Subscriber Management and Middleware for IPTV / OTT and VOD service.

Ezhometech IPTV server, Video Server, IPTV player, IPTV Middleware

MEDIA CONTROL PANEL – supports all media server types including shoutcast, icecast, wowza media and windows media services.

cast control

Streamio – Online Video CMS – Managing HD video content on websites, intranets and social media networks.

streamio

ViMP is the professional Video CMS for WebTV, Social Media portals and Video Communities with mobile and HTML5 support. We also offer associated transcoding, hosting und dedicated servers.

vimp media product

Manage online videos with Brightcove’s video Content Management System (CMS). Learn how to sort, manage and organize your entire video library with ease.

brightcove

Build a centralized, searchable video library with Panopto Unison. Import, edit, and manage video of any format in Panopto’s powerful video CMS.

Online Video Platform - Panopto