Tuesday, August 28, 2012

Spotify search with JQuery Mobile

I want to broaden my skills set of mobile development. Since 2 years I have been involved in Android development, now I want to get involved in a cross-platform solution using Javascript, Html and CSS. 

JQuery Mobile

During my time at KHLeuven I have written a lot of Javascript code but since my graduation i have written none. So I believed it was time to refresh my javascript by experimenting with JQuery mobile. I wanted to create a simple search application that uses an online datasource to fill in a ListView.

Spotify

I chose Spotify as an online datasource since it uses JSON as a data-interchange format and I have used it before in other projects. Another reason why I use Spotify is that the application can be used to invoke playing a new song on a spotify client.

PhoneGap

I have packaged the application using PhoneGap. By using PhoneGap the process of building a native app embedded with javascript is simplified.

Screenshots



Source Code

The code used in this demonstration isn't a good example of functional programming. I solely wanted to test out JQuery and not write a full application that is extensible. Only reuse the code by re-factoring it into functions and objects.
Link to source

Thursday, August 23, 2012

Configuration VLC web interface


In this tutorial we are going to cover the basics steps needed to config a VLC mediaplayer instance to accept connections over the local area network. This tutorial is created to help configure the VLCRemote application for Android.

Windows

This tutorial is created using Windows 7 and VLC 2.0.3

Step 1 of 5: show hidden files

We need to edit a configuration file of VLC, the .hosts file. This file is hidden so we first need to enable our Windows system to show hidden files and folders. This can be configured in the Control Panel:
Start > Control Panel > Search for Folder Options  > Enable "show hidden files,..  > Apply


Step 2 of 5: edit the .hosts file

Now we should be able to see the hidden files. We will be editing the .hosts file to helps configure VLC to allow or deny certain  IP-addresses. We need to edit this file with a text editor enhanced with administrator rights.
Texteditor > Right click > Run as Administrator


When the texteditor is open:
Menu > Open file > C:\Program Files\VideoLAN\VLC\lua\http\.hosts

Edit and save the file so the file looks like the following screenshot:
-> uncomment private addresses 


Step 3 of 5: enable the web interface

If you already have VLC mediaplayer opened on your computer, you should restart it so the new configuration can be loaded. When VLC is reopened you can continue to activate the web interface of the VLC mediaplayer. This is achieved by clicking on a menu item in the view tab.
Menu > View > Add interface > Web

Step 4 of 5: determine the IP-address of VLC-host

Our VLC mediaplayer is ready to accept connections. Before we can test the web interface we should determine the IP-address of the computer hosting the VLC instance. This can be achieved by using the ipconfig command in the commandprompt.
Start > search for "cmd" > open de cmd.exe
When cmd is opened > Type "ipconfig" > press enter


Step 5 of 5: test if the web interface is accessible 

Now that we have our IP-address. It's time to test the web interface. Open a browser and browse to a webpage constructed out the following format:
http://<ipaddres>:8080
If a page gets loaded you are set to start using the VLCRemote application. You only need to fill in the IP-address in the application and add some songs to the playlist.

I hope the how-to guide was helpfull. If not please leave a comment below.

Enjoy VLCRemote!