Python Web-Frame

Python Web-Frame


After explain how to create a Python GTK/Webkit application to load a website inside a GTK+ window generated with Python I decided to use this knowledge to embed some applets in local windows — something like Mozilla Prism project — to show Flash audio/video players because I like to view TV shows and hear Radio stations in my computer sometimes and I always forget the website’s address where I hear/watch these multimedia contents, and because I don’t like to use those programs with Last.FM integration (or similars), however this last option it’s better than my personal preferences, but you know there isn’t many Porn-Player over internet :D.


Well if you want to know how to I do this, follow these instructions and enjoy wasting your internet bandweight ;). First at all you need to have a folder structure like the following:

$ tree /opt/radio-online
|-- radio-online.desktop
|-- index.html
`-- icon.png

0 directories, 6 files
  • radio-online.desktop: This is the GNome launcher shown in the main menu of the desktop environment,
  • This is the Python application, launcher of the GTK+ window with the Webkit frame,
  • index.html: This is the file which will be shown in the Python/GTK+ window, and wrapper of the Media Player,
  • icon.png: Finally (and optional) the image which will be shown in the GNome main menu and used by the radio-online.desktop launcher.

Assume us that we want to embed a flash-player reproductor in our local application and we know what is the code which will display the player in the original website, if you don’t have the player HTML code yet you just need to search in the source code of the website some words like flashvars or param, but be carefull using Firebug (in Firefox) or Document Viewer (in Google-Chrome) because generally those media-players use Javascript code to generate the DOM of the Object and we need the source code not the generated code.

Write in the file /opt/radio-online/index.html a simple HTML wrapper for the media-player code copied before (and pasted between the body tags: <body>...</body>) and write a CSS rule to configure the padding of the body tag (this will be the margin between the Python/GTK+ window border and the Webkit frame), I will use zero padding body{ padding:0px; margin:0px } because I don’t want to see any margin by now.

Now copy/paste the next Python code (it’s very short to explain it, but if you have a question just use the comment form to ask it); take a look to the parameters used in the window.set_size_request() function because these are the Width/Height values in pixels required by the media-player; Take care! at this point because some Javascript media-players won’t be displayed in the on-load event of the Python/GTK+ window, try to resize the window with the mouse if you have a problem with the size required by your HTML/Javascript media-player code.

#!/usr/bin/env python
import gtk, webkit
window = gtk.Window()
window.set_title('Radio On-Line')
window.set_size_request(300, 200)
browser = webkit.WebView()
settings = browser.get_settings()
settings.set_property('enable-file-access-from-file-uris', 1)'file:///opt/radio-online/index.html')
window.connect('destroy', lambda w: gtk.main_quit())

Additionally, you must understand why I’m using the Webkit::Settings functions; well, you should know that Cross-Domain is a feature avoided by all browser engines (Webkit too) because that is a good point for a hacking attack, but in this case we need to access to the file /opt/radio-online/index.html, to do this we need to override the default Webkit settings using the method set_property() in the object webkit.WebView() instanciated with the execution of the function get_settings() before to open the URL in the Browser instance.

Use this template to create your own launcher according to your application path, and remember to create a symbolic link to this file in the path /usr/share/applications/ using this command:

$ cd /usr/share/applications/
$ ln -s /opt/radio-online/radio-online.desktop`
[Desktop Entry]
Name=Radio On-line

Now we have a desktop launcher in the main menu of our GNome desktop environment to execute the Radio-Online application, but if you want to use the key-binding ALT + F2 in your keyboard to run this application quickly you’ll need to create a symbolic link to the Python/GTK+ file in the system binary path using this command:

$ cd /usr/local/bin/
$ ln -s /opt/radio-online/ radio-online
Do you have a project idea? Let's make it together!