Releasing: VLC media player - Mobile Web Interface

[BlackWolf]

hi guys,

Introduction
I recently discovered that VLC media player offers an http webinterface. Unfortunatly, I also had to discover that its highly uncompatible with iphones/ipod touches MobileSafari. So I created an own, mobieSafari-compatible, version of the VLC webinterface.
I have to say I started to create this for personal usage only, but in the middle of my work I had the idea to make it public, since VLC is a very popular cross-platform media player and some of you might enjoy it.
So here we are. I'm posting this and maybe some of you want/need the webinterface, so you can download it here. I'll provide some information on what it does and how to "install" it below. Enjoy.

Requirements

1. Obviously VLC media player
2. The webinterface of your VLC has to be activated. You can set up the webinterface pretty easily in VLC
   • Go to Settings->Preferences
   • Expand "Interface" on the left side
   • Click on "Main interfaces" and check the box next to "HTTP remote control interfaces". Do NOT select the HTTP-Interface in the dropdownlist at the top! Just check the box next to it and apply.
   • That should be it. when you restart VLC it should start the webinterface in the background
3. This point is not actually a requirement to use the web interface, but it makes it much more user-friendly: Your router should always assign you the same local IP (since you access the web interface through that IP. If it always changes, you'll always have to look it up). Unfortunatly I can't really tell you how to do it, since it differs from router to router. On my router it's called "Fixed IP". Somewhere in your routers settings you can tell the router that your hardware adress (often called MAC-Adress) should always get the same local IP (like always 192.168.0.2 or something). Like I said, I can't really tell you how to set this up. To help you, I will tell you how you can find out your mac-adress and your local IP.
   • On Windows: Go to start->run->"cmd". The windows command-line will now start. Enter "ipconfig -all" here and (if necessary) scroll to the device that connects to your wireless network (most likely "Ethernet Wireless Connection" or something). There you have several entries. one will be your "Physical adress" which is your MAC-Adress (although, when you enter the mac-adress to your router, you will have to replace the "-" with ":"). The other thing is your IP-Adress.
   • On Mac: Go to System Settings->Network. On the left bar select the device that connects to your local wireless network. When you selected it, your IP-Adress appears on the right side. To find out your mac-adress click on the "More Options"-Button (or something like that, don't have the english version of OSX) and in the top row select "Ethernet". Your MAC-adress is shown as the "Ethernet-ID".
   So the best thing is if you find out your mac-adress, tell your router to always assign the same IP to that mac-adress and then you can access the webinterface with that IP. If you don't do that, you have to look up your IP-Adress every time you reconnected to the internet and use that IP. Sorry I can't explain it any further, I just hope you find out how to do it.
   Whatever you do, you access your webinterface by entering http://youripadress:8080 in your safari after you started VLC and your ipod/iphone is connected to your wireless network.

"Install" the mobile webinterface
This is pretty easy. Download this zip-file:
http://nachdenki.m8an.de/vlcmobile.zip
it contains an "http"-folder. copy this http-folder to your vlc directory (which already contains an http-folder, but thats intentional). it will overwrite the default index.html in the http-folder to add iphone/ipod detection and it will add a mobile-folder into the http-folder which contains the actual webinterface.
After you did this, restart VLC if you had it running. If you now access your webinterface it should detect if you're using an iphone/ipod and redirect you to the mobile webinterface. You're done.

Use the mobile webinterface
Since there is no help included in the webinterface I'll explain how to use it here, but most things should be pretty obvious. When you first start the Webinterface you should get something like this:

So first a list of what you see and what it does:

• On the top you have the black titlebar. This bar is always visible at the top of the screen (even if you scroll). It shows the location and the name of the video currently playing. When you tap on the titlebar the playback controls are hidden (or shown if you hid them before). On the right side of the titlebar you have the "fullscreen" button. When you tap this button it toggles fullscreen on and off.
• Below the titlebar you have a control bar where you can toggle shuffle on and off and select if nothing should be repeated, the current video or the complete playlist. In the middle you see how much of the track has been played already. You can tap at any spot on that bar to jump to that location in the video.
• Next comes the content window. You can tap on "Media Info" or "Playlist" to show information on the currently playing file or to show the playlist. Both are described in detail below.
• The bottom of the screen shows another playback control bar. Here you can pause/resume playback, switch to the next or previous track in the playlist and set the volume. You can set the volume either by taping anywhere on the volume-bar or by tapping on one of the two speakers next to the bar to increase/decrease volume by just a little amount.

So this is basically what you can do. Now the main window contains two sections: Media Info and Playlist. First let me show you what you can do in the playlist-section. This is what the playlists look like (and btw, you'll notice the playback controls are hidden):

So this is pretty simple to use either. You see every video in your playlist and the length of that video. The video with the little loudspeaker next to it is the one that is currently playing. Every other video can be removed from the playlist by tapping on the red X next to it. When you tap on a videoname itself (so right of a red X) the file you tapped starts playing. Simple, isn't it?

So finally the media info section. Since it's just a list of data theres nothing you can really do with it, so I'll just show you how it looks.


so that's it.
I hope some of you will enjoy this little tool and I hope I explained everything well. If there are questions post them here.

Enjoy
BlackWolf

[DerekVOF]

Very nice interface -- I got it working on my Mac too.

Just a quick note - to install on the Mac version of VLC, you need to right-click on the VLC application, select Show Package Contents. Then you'll need to navigate to Contents/MacOS/share where you'll find the http folder...

[Synergy37]

I'm slightly confused with this. Does it mean we are able to stream videos to the iPhone?

[tim_un]

I have problem to install VLC player on my iPod Touch before install the mobile interface. So how to install VLC on my iPod? It says no c compiler found....

[BlackWolf]

no I think you misunderstood me. if you activate the webinterface of VLC on your computer/mac(!), the media player creates a website that allows you to control your VLC with any device that can access your network (including the touch). I just created a new version of this that is ipod-friendly since the normal VLC media interface is almost unusable on the touch's safari.

so this allows you to control the VLC media player that is running on your computer/mac via your ipod.

[Dissonance]

Nice job. I was just looking into doing something similar when google pointed me back here to the Lounge and your post. Thanks for saving me the trouble!

If you're looking for something else to do (you know, in your spare time) I'd love to be able to add to the playlist.

Seriously though, good work.

[BlackWolf]

Originally Posted by Dissonance

Nice job. I was just looking into doing something similar when google pointed me back here to the Lounge and your post. Thanks for saving me the trouble!

If you're looking for something else to do (you know, in your spare time) I'd love to be able to add to the playlist.

Seriously though, good work.

thanks :-)
would love to do that myself, but for that I would have to access the hard drive of the computer VLC is running on, and that's not very easy (I don't say it's impossible, but it would be really really hard to do I guess)

[hbarry]

Hi There

I really want a copy of this interface
but the link

http://nachdenki.m8an.de/vlcmobile.zip

is broken
Can you plse advise where I can get a copy?
thank you