Monday, July 26, 2010

Web Automation - Intro

Did you know that you can automate your daily repetitive tasks that you do on the web, and save yourself time and effort!
This is a very simple automation sample, the automation simulates the user web browsing, I built 2 automation samples:
  1. Automate Google Search: will navigate to google website, enter "Dareen Alhiyari" in the search textbox, and then click the search button.
  2. Automate My Blog: The second automation will navigate to my blog's "Contact Me" page, and then click on my yahoo email link.
Here's a video demo of the automation:
Download Executable you also need to check Microsoft.mshtml.dll (?)
Download Source Code

You can also build your own toolbar to the browser with your customized buttons, for example you can add a button that will collect all the images in a web page.. whatever comes to your mind!
You can also use this concept to build automated tests for your web applications, simulating the end user browsing activities.

A quick look at the code

In the event handler of the click event of the sub-menu "Automate My Blog", I attach a new event handler to the DocumentComplete event of the WebBrowser, and navigate the web browser to my blog's "Contact Me" page url, and then wait for the event handler to be invoked to complete the automation.

In the sub menu click event handler:
    this.webBrowser1.DocumentCompleted += new WebBrowserDocumentCompletedEventHandler(webBrowser_DocumentCompleted_AutomateMyBlog);
catch (Exception ex)
    MessageBox.Show(ex.Message, "Error!");

In the WebBrowser document complete event handler, I find the yahoo mail link object, and click on it:
    IHTMLDocument3 doc = this.webBrowser1.Document.DomDocument as IHTMLDocument3;
    if (doc != null)
        IHTMLElement yahooMail = doc.getElementById("yahoomail");
        if (yahooMail != null)
catch (Exception ex)
    MessageBox.Show(ex.Message, "Error!");
    this.webBrowser1.DocumentCompleted -= new WebBrowserDocumentCompletedEventHandler(webBrowser_DocumentCompleted_AutomateMyBlog);

You will need Microsoft.mshtml.dll that usually ships with IE, to make sure if you have it installed in the GAC, open Start Menu->Run and type assembly then hit enter, the GAC folder will open up, make sure that you have the dll in the dlls list
If you don't find the dll in the list, you may download Office 2003 Update that contains the dll, or if you find it too big for you, you may download it from dll download websites
After you get the dll, drag it and drop it into the assembly folder "%OS Drive%\Windows\Assembly"

Wednesday, July 14, 2010

Build impressive flash dashboards and charts

Open Flash Chart is a cool open source flash project that allows you to easily embed impressive dashboards and charts into your website or business portal.

This is one of the 3D-bar chart samples:

And a glass bar chart sample:

The data from which to build the charts can be extracted from any data source or database, and saved into an array that is passed to the OFC library to build the chart.
The basic tutorial in the website shows how to integrate the flash chart along with the data file into your page.
Of course you will have to do some tweaks here and there like changing some include paths, renaming some folders... etc. But the cool result is worth the hassle ;)

I will be posting a detailed step-by-step tutorial of how to build and integrate the charts into a PHP5 website once I get some time.

Wednesday, July 7, 2010

How to change the shortcut items displayed in the common open/save file dialog in Windows

If you're tired of continiously navigating to your most used folders whenever you want to open or save a file, you can change the default items displayed in the left pane of the open/save file dialog

To change those default items, do the following:
  1. Open the Group Policy console, go to Start -> Run -> type gpedit.msc and hit enter, the console will open.
  2. Expand the tree: User Configuration -> Administrative Templates -> Windows Components -> Windows Explorer -> Common Open File Dialog.

  3. Double click on Items Displayed in Places Bar that appears in the right pane.
  4. When the dialog opens up, make sure that the setting is Enabled, and now you can specify your favorite locations to be displayed in the open/save dialog.

  5. Enjoy :)
More information about this setting:

At least Microsoft Windows XP Professional or Windows Server 2003 family.
Configures the list of items displayed in the Places Bar in the Windows File/Open dialog. If enable this setting you can specify from 1 to 5 items to be displayed in the Places Bar.
The valid items you may display in the Places Bar are:
1) Shortcuts to a local folders — (ex. C:\Windows)
2) Shortcuts to remote folders — (\\server\share)
3) Common Shell folders.
The list of Common Shell Folders that may be specified:
CommonDocuments, CommonMusic, CommonPictures, Desktop, MyComputer, MyDocuments, MyFavorites, MyMusic, MyNetworkPlaces, MyPictures, Printers, ProgramFiles, Recent.

If you disable or do not configure this setting the default list of items will be displayed in the Places Bar.

How to configure shared folders between Windows-host and Ubuntu-guest on VirtualBox

Shared Folders is a feature provided by VirtualBox to share folders between the 2 operating systems (host and guest).
To configure shared folders on VirtualBox Ubuntu guest, follow these steps:
  1. Make sure that Guest Additions are already installed, if not, install them: From the VirtualBox's menu go to Devices -> Install Guest Additions.

    This will mount a virtual CD on your /media/cdrom. Normally this folder's window will show up.

    As root run the program (or if you're using 64bit).

    sudo /media/VBOXADDITIONS_3.2.6_63112/
    When the program completes reboot your VirtualBox.

  2. You may now go ahead and define the shared folder(s). From the VirtualBox's menu go to Devices -> Shared Folders. A dialog will show up. In this dialog you can specify which folder from your Windows system you want to share with your Ubuntu. Press the button with the + symbol to add a new shared folder in the list. You will have to specify a Folder Name for each folder you add. Make sure you memorize that name because you will need it in the next step. in this example it's SHARED

    When done with your shared folder(s) specification, you may now go ahead and actually mount these folders from Ubuntu. First you have to create a mounpoint, that is, a directory in your Ubuntu which will reflect the shared folder from Windows:

    sudo mkdir /media/windows-share
    Of course you may choose an alternative path for your mountpoint. With your mountpoint created you can now mount the shared folder, like this:

    sudo mount -t vboxsf folder-name /media/windows-share
    Where folder-name will be the name you assigned for this folder when you were adding it in the shared folders list. in this example it will be SHARED

  3. You could use the /etc/init.d/rc.local script to execute these commands on startup to have the shared folders automatically mounted every time you start your Ubuntu VirtualBox.

Monday, July 5, 2010

How to install and configure Xdebug to work with PHP5 on Ubuntu

The Xdebug extension helps you debugging your script by providing a lot of valuable debug information.
Before you install xdebug you should have PHP5 and Apache2 already working properly. Use the terminal to execute the following steps.

1) Install the latest version of xdebug in PEAR repository:
sudo apt-get install php5-dev php-pear

2) Install xdebug through PECL:
sudo pecl install xdebug

3) Now, you need to find the path of the compiled module (
find / -name ''
Copy the found file-path to use in the next steps.

4) Now we need to configure xdebug with PHP5, so open the php.ini file (usually you'll find it in /etc/php/apache2/php.ini) use gedit to edit the file:
sudo gedit /etc/php/apache2/php.ini
OR, use the pwerful text editor vim:
sudo vim /etc/php/apache2/php.ini

5) Add the following lines to the file [Note that the first line should contain the file path found in step number 3]:

6) Finally, you need to restart apache for the changes to take effect:
sudo /etc/init.d/apache2 restart

To verify that the extention is loaded and configured correctly, check the phpinfo()
The following line should have been appended to the copyright lines:
with Xdebug v2.0.0, Copyright (c) 2002, 2003, 2004, 2005, 2006, 2007, by Derick Rethans

For full xdebug extention information, please read the official documentation at