HOWTO: Change JWPlayer to the HTML5 version

Third-party modifications and add-ons, Apps and Clients

Moderator: moderators

HOWTO: Change JWPlayer to the HTML5 version

Postby jValdron » Fri Jan 18, 2013 3:42 pm

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.
Last edited by jValdron on Mon Jan 21, 2013 12:08 pm, edited 3 times in total.
jValdron
 
Posts: 11
Joined: Wed Aug 29, 2012 4:47 pm

Re: HOWTO: Change JWPlayer to the HTML5 version

Postby GJ51 » Sat Jan 19, 2013 6:16 am

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.
Gary J

http://bios-mods.com
http://www.maplegrovepartners.com
http://theaverageguy.tv/category/tagpodcasts/cyberfrontiers/
User avatar
GJ51
 
Posts: 3492
Joined: Wed Oct 20, 2010 11:58 pm
Location: Western New York

Re: HOWTO: Change JWPlayer to the HTML5 version

Postby icedfusion » Sat Jan 19, 2013 7:27 pm

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.
icedfusion
 
Posts: 5
Joined: Sat Jan 19, 2013 6:47 pm

Re: HOWTO: Change JWPlayer to the HTML5 version

Postby GJ51 » Sat Jan 19, 2013 7:34 pm

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

Thanks.
Gary J

http://bios-mods.com
http://www.maplegrovepartners.com
http://theaverageguy.tv/category/tagpodcasts/cyberfrontiers/
User avatar
GJ51
 
Posts: 3492
Joined: Wed Oct 20, 2010 11:58 pm
Location: Western New York

Re: HOWTO: Change JWPlayer to the HTML5 version

Postby Fenny » Mon Jan 21, 2013 8:09 am

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. :D)
Fenny
 
Posts: 21
Joined: Wed Oct 12, 2011 4:06 pm

Re: HOWTO: Change JWPlayer to the HTML5 version

Postby jValdron » Mon Jan 21, 2013 12:06 pm

Awesome! Thanks Fenny.
jValdron
 
Posts: 11
Joined: Wed Aug 29, 2012 4:47 pm

Re: HOWTO: Change JWPlayer to the HTML5 version

Postby Fenny » Mon Jan 21, 2013 2:43 pm

Okay, and got it working for the external player as well. ;D
Now you can share media in splendid html5 glory :D
(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
Fenny
 
Posts: 21
Joined: Wed Oct 12, 2011 4:06 pm

Re: HOWTO: Change JWPlayer to the HTML5 version

Postby jValdron » Tue Jan 22, 2013 2:47 pm

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.
jValdron
 
Posts: 11
Joined: Wed Aug 29, 2012 4:47 pm

Re: HOWTO: Change JWPlayer to the HTML5 version

Postby mta99 » Tue Jan 29, 2013 1:56 pm

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
mta99
 
Posts: 8
Joined: Thu Jan 17, 2013 8:04 pm

Re: HOWTO: Change JWPlayer to the HTML5 version

Postby jValdron » Tue Jan 29, 2013 2:03 pm

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.
jValdron
 
Posts: 11
Joined: Wed Aug 29, 2012 4:47 pm

Re: HOWTO: Change JWPlayer to the HTML5 version

Postby mta99 » Wed Jan 30, 2013 11:34 am

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.
mta99
 
Posts: 8
Joined: Thu Jan 17, 2013 8:04 pm

Re: HOWTO: Change JWPlayer to the HTML5 version

Postby GJ51 » Wed Jan 30, 2013 3:25 pm

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?
Gary J

http://bios-mods.com
http://www.maplegrovepartners.com
http://theaverageguy.tv/category/tagpodcasts/cyberfrontiers/
User avatar
GJ51
 
Posts: 3492
Joined: Wed Oct 20, 2010 11:58 pm
Location: Western New York

Re: HOWTO: Change JWPlayer to the HTML5 version

Postby daneren2005 » Wed Jan 30, 2013 5:09 pm

GJ51 wrote: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%.
Developer of DSub for Android
daneren2005
 
Posts: 1708
Joined: Fri Jul 06, 2012 7:52 pm

Re: HOWTO: Change JWPlayer to the HTML5 version

Postby GJ51 » Wed Jan 30, 2013 5:29 pm

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

http://bios-mods.com
http://www.maplegrovepartners.com
http://theaverageguy.tv/category/tagpodcasts/cyberfrontiers/
User avatar
GJ51
 
Posts: 3492
Joined: Wed Oct 20, 2010 11:58 pm
Location: Western New York

Re: HOWTO: Change JWPlayer to the HTML5 version

Postby daneren2005 » Wed Jan 30, 2013 5:38 pm

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
Developer of DSub for Android
daneren2005
 
Posts: 1708
Joined: Fri Jul 06, 2012 7:52 pm

Next

Return to Mods, Apps and Clients

Who is online

Users browsing this forum: No registered users and 1 guest