HOWTO: Change JWPlayer to the HTML5 version

[jValdron]

Hey guys,

I was getting tired of using Flash, it slowed down my processor waaay too much. So I've switched from JWPlayer 5 to 6.

Here's how I did it, it's a really quick and dirty way to fix it, I wish I would have time to integrate more features, for example, different video qualities, video seeking, etc (which I might do eventually).

Disclaimer: I'm not responsible for anything that could go wrong with your computer after doing this.

First of, know that this will probably only work in Chrome as I'm encoding everything in WebM file, but it shouldn't be too hard to adapt the script to make it work with MP4 or etc.
Everywhere that says _location_ is the location of your jetty folder, for my version of Subsonic under Ubuntu, it's /var/subsonic/jetty/3105/ (3105 could change depending on your version I think).

So, download JWPlayer 6.10 (latest version as of this post). Extract the files to your desktop.
Copy the "jwplayer.flash.swf" file to your _location_/webapp/flash with "jw-player-6.10.swf" as the name, so that you have the file _location_/webapp/flash/jw-player-6.10.swf.
Copy the "jwplayer.html5.js" and "jwplayer.js" files to _location_/webapp/script. No need to rename those files.

Afterwards, download the attached videoPlayer.jsp file, and replace your file that is located in _location_/webapp/WEB-INF/jsp, overwriting your existing file.

Once you got all those files in place, we just need to adjust the transcoding option, so login to Subsonic, go in Settings -> Transcoding, and for the video line, put the following information:

Code: Select all

Name: mp4/h264 video
Convert from: avi mpg mpeg mp4 m4v mkv mov wmv ogv divx m2ts
Convert to: webm
Step 1: ffmpeg -ss %o -t %d -i %s -async 1 -vf lutyuv=y=val*1.3 -b %bk -s %wx%h -ar 44100 -ac 2 -v 0 -f webm -vcodec libvpx -preset superfast -acodec libvorbis -threads 0 -


For step 1, if you want it to go faster, increase the amount of threads. I set it to 2 threads on my quad core server, as this creates 3 threads and leaves me one core for other stuff. But for HD stuff, you'll definitely need more than 1 thread

After all that, it should work properly. Test it out, and let me know how it goes!

Like I said, I'm not sure if it will work for you, as this works well for me under Win/Chrome and my Ubuntu Server.

[GJ51]

Really interesting. I'm going to give this a test run as soon as I get time. On my Madsonic site I just started getting Flash crashes after the most recent upgrade. Maybe if I get this to work it will be a better answer all around.

[icedfusion]

Hi,
Thanks for this post. I was looking for some 'advanced' uses of ffmpeg in subsonic and this has helped.

The one thing I did differently is that I use vlc on my samsung s3 to play the streaming content given by your webm ffmpeg command. I am now a very happy user of dsub & subsonic.

Cheers

ice.

[GJ51]

I've been thinking about using VLC on my SIII for some time. Any chance you could post a tutorial?

Thanks.

[Fenny]

I just added a filter to brighten it up:

Code: Select all

-vf lutyuv=y=val*1.3

This seems to be better.

Code: Select all

ffmpeg -ss %o -t %d -i %s -async 1 -vf lutyuv=y=val*1.3 -b %bk -s %wx%h -ar 44100 -ac 2 -v 0 -f webm -vcodec libvpx -preset superfast -acodec libvorbis -threads 0 -

Also Modded the /rest/videoPlayer.jsp file to add support on phones. (Works on chrome on my android. Just have to click the player for it to start. )

[jValdron]

Awesome! Thanks Fenny.

[Fenny]

Okay, and got it working for the external player as well. ;D
Now you can share media in splendid html5 glory
(There is no option for flash at all in this modified version)
Also: I think I have settled on:

Code: Select all

-vf lutyuv=y=val*1.1

[jValdron]

Code: Select all

lutyuv=y=val*1.3

Seems to work fine for me, just tried it I'll probably try to improve upon the videoPlayer.jsp file a little bit in the future.

[mta99]

Thanks for this guys! Great to have SS back on my Android devices without flash.

Running on my unraid box the conversion to webm takes a few more CPU cycles than the conversion to flv. Anyone else experienced this? Would ffmpeg 1.1 improve the performance?

Sent from my Nexus 4 using Tapatalk 2

[jValdron]

Personally, transcoding uses about 1.0 to 2.5 of my 4 core CPU (1.7GHz). Not sure what FLV transcoding used before, but WebM sure uses less CPU on the client side than FLV.

[mta99]

Running a Pentium G620 FLV transcoding would peak around 140% usage, webm has been up to 170% (albeit very briefly). Certainly the client side is improved just wondering if there is any room for optimization on the server side.

[GJ51]

Probably not enough tweakability to make a significant difference. Video transcoding is very cpu intensive and at a minimum I recommend a decent quad core cpu for any resolutions of 720p or higher.

Just out of curiosity, How do you exceed 100% CPU load?

[daneren2005]

Probably not enough tweakability to make a significant difference. Video transcoding is very cpu intensive and at a minimum I recommend a decent quad core cpu for any resolutions of 720p or higher.

Just out of curiosity, How do you exceed 100% CPU load?

In most linux reporting tools 100% = 100% usage of a single core. So for example while watching a video I normally have 180-190% CPU usage so normalized it is using 90-95%. It tripped me out the first time I saw a process go above 100%.

[GJ51]

That makes sense! I was thinking perhaps he was refering to the % increase in CPU use over transcoding to flv.

[daneren2005]

Yikes I was going to update my server to a more modern Pentium like that. I thought that it would do much better than my old Pentium D with transcoding but your tests seem to say it isn't that much better. Guess I might need to just wait until I have more like $300 to upgrade to a low end quad core.

Sent from my HTC One X using Tapatalk 2