August 14th, 2010 by JuanK

Hi, a few months ago I wrote the following article about:“Add-In Express for IE”  a tool that hugely eases building add-ons for Internet Explorer: C#-creating Toolbars, buttons and menus for IE.

 

I found the tool while I was developing an important project for Microsoft in my country, they contacted me to make it and by the way they told me that they’d use that tool to perform this project.

 

As I mentioned earlier, in the beginning I’d believed this was a project based on the IE SDK and COM, but when Microsoft told me about this tool I started to search through the internet for more information about Add-In Express.

 

Creating an Add-on for IE is something pretty interesting and much easier to do using “Add-In Express for IE”.

 

I stopped for a while to think what kind of things I could make with this tool and I saw that to take maximum advantage I should devise dynamic components that would allow the user to interact with toolbar, sidebar or button contents directly.

 

Among the thousands of different alternatives that may exist to create dynamic components I’ve chosen these two:

• RSS consumption for data delivery
• Create a search box

 

In this article I’ll show how to create a component with Add-In Express for IE that dynamically consumes RSS data .

 

To create a component that reads the RSS Top news from The Washington Post and deploy these data as a text with Hyper link. I’d drag this component into an IE toolbar.

 

CONSUMING TOP NEWS RSS

I can accomplish this job using this simple method I’ve created:

C#- easily consuming an XML or RSS feed hosted on the web

 

I’ll simply call the method by passing the URL of the RSS Top news to it: http://www.washingtonpost.com/wp-dyn/rss/linkset/2005/03/24/LI2005032400102.xml

 

STEP 1 – CREATE THE PROJECT

 

 

STEP 2 – CREATE A CLASS THAT IS HOSTING THE METHOD TO CONSUME THE RSS

 

using System.Net;
using System.Data;

/// <summary>Provee funcionalidades de conexión a una URL que publica un archivo XML</summary>
public static class RemoteXML
{
    /// <summary>
    /// Se conecta a una URL que representa un archivo XML y convierte la información en un DataSet
    /// </summary>
    /// <param name="URL" />URL del xml publicado en la web</param>
    /// <returns>Dataset que representa los datos XML</returns>
    public static DataSet GetXMLDataSet(string URL)
    {
        HttpWebRequest xmlRequest = (HttpWebRequest)WebRequest.Create(URL);
        DataSet xmlData = new DataSet();
        xmlData.ReadXml(xmlRequest.GetResponse().GetResponseStream());
        return xmlData;
    }
}

 

STEP 3 – CREATE A TOOLBAR

This is simple thanks to "Add-In Express for IE", just:

• right-click on the project
• Add new item
• and…

 

 

STEP 4 – CREATE A LABEL TO DISPLAY THE RSS CONTENT AND LINK

The toolbar as such a Panel is empty, so there I drag a new label, the best part is that controls to be added to the toolbar are the same as Windows Forms controls  (I have used different colors to distinguish between them).

 

 

STEP 5 – CONSUME THE RSS AND TAKE THE FIRST NEWS

Now using Step 2 I’d take RSS and get the first news. For this purpose I created an RSSEntryInfo structure:

 

/// <summary>Representa información de una entrada RSS</summary>
public struct RSSEntryInfo
{
   public string title, url;
}

 

Then I use the RemoteXML method to fill in the RSSEntryInfo structure:

/// <summary>
/// Devuelve la última entrada de un RSS
/// </summary>
/// <returns></returns>
private static RSSEntryInfo GetLatestRSSEntry(string RSSUrl)
{
    RSSEntryInfo ni = new RSSEntryInfo();

    try
    {
        using (var datos = RemoteXML.GetXMLDataSet(RSSUrl))
        {
            foreach (DataRow row in datos.Tables[&quot;item&quot;].Select())
            {
                ni.title = (string)row[&quot;title&quot;];
                try
                {
                    ni.url = (string)row[&quot;link&quot;];
                }
                catch
                {
                    ni.url = ((Uri)row[&quot;link&quot;]).AbsoluteUri;
                }
                break;
            }
        }
    }
    catch
    {
        throw;
    }

    return ni;
}

 

It is IMPORTANT to be aware that if GetXMLDataSet deployment includes the loading of the XSD RSS 2.0 then the URL will come in the object Uri format. See "additional Note" at the end of this article:

C# – easily consuming an XML or RSS feeds hosted on the web

 

STEP 6 – CONFIGURE THE LABEL WITH INFORMATION OBTAINED FROM THE RSS

We must now configure the label with information, so I created a lblLastTopNewInfo inside of the toolbar code method, and I created a variable string to store the URL of the last news. Here I use the top news RSS from The Washington Post: http://www.washingtonpost.com/wp-dyn/rss/linkset/2005/03/24/LI2005032400102.xml

 

/// <summary>URL donde esta la noticia contenida en el label</summary>
string ltnUrl;
/// <summary>Trae la última noticia de un RSS y establece la información necesaria en el label</summary>
private void lblLastTopNewInfo()
{
    var ltnInfo = RemoteXML.GetLatestRSSEntry(&quot;http://www.washingtonpost.com/wp-dyn/rss/linkset/2005/03/24/LI2005032400102.xml&quot;);
    lblLastTopNew.Text = ltnInfo.title;
    ltnUrl = ltnInfo.url;
}

 

STEP 7 – PROGRAMMING THE CLICK EVENT OF THE LABEL TO MAKE IE NAVIGATE TO LAST NEWS URL

To make IE navigate to the URL of the latest news I use other features of "Add-In Express for IE". Each created object (toolbar, bar, etc) has access to the IE object model via the IEApp property.

So, here is the label click event:

 

/// <summary>
/// Hace que IE navegue al URL correspondiente
/// </summary>
/// <param name="sender" /></param>
/// <param name="e" /></param>
private void lblLastTopNew_Click(object sender, EventArgs e)
{
    object nullObject =null;
    this.IEApp.Navigate(ltnUrl, ref nullObject,
        ref nullObject, ref nullObject, ref nullObject);
}

 

STEP 8 – MAKE THE LABEL START WITH RSS INFORMATION

The OnConnect event, of the tool fires each time the Toolbar is loaded bye IE.

/// <summary>
/// Configura el estado inicial del label
/// </summary>
/// <param name="sender" /></param>
/// <param name="threadId" /></param>
private void TWPToolbar_OnConnect(object sender, int threadId)
{
    lblLastTopNewInfo();
}

 

STEP 9 – MAKE THE LAST NEWS REFRESH EACH HALF HOUR

With a System.Timers.Timer, I set the lblLastTopNewInfo() method to be called every 30 minutes.

 

/// <summary>Temporizados para refrescar la última noticia</summary>
System.Timers.Timer timerWpLn = new System.Timers.Timer();

/// <summary>
/// Configura el estado inicial del toolbar
/// </summary>
/// <param name="sender" /></param>
/// <param name="threadId" /></param>
private void TWPToolbar_OnConnect(object sender, int threadId)
{
    lblLastTopNewInfo();
    timerWpLn.Interval = 1000 * 60 * 30;
    timerWpLn.Elapsed += new System.Timers.ElapsedEventHandler(timerWpLn_Elapsed);
    timerWpLn.Enabled = true;
    timerWpLn.Start();
}

/// <summary>
/// Establece periodicamente los valores del label
/// que muestra la última noticia
/// </summary>
/// <param name="sender" /></param>
/// <param name="e" /></param>
void timerWpLn_Elapsed(object sender, System.Timers.ElapsedEventArgs e)
{
    lblLastTopNewInfo();
}

 

In addition I’ve colored the label in Blue and got the mouse cursor to change to a little hand when the mouse moves  over the control to show that it is a hyper link, this is done via the MouseEnter and MouseLeave events of the label.

 

STEP 10 – INTEGRATE, COMPILE, AND TEST IN IE

This is very easy, in Visual Studio double-click on IEModule to open the module panel, I open the properties dialog of the module and open the Toolbars collection:

I add a new toolbar there  and make it as seen in this image:

compile the solution, then right click on the project and select Register ADX project,

 

 

Open IE and go!… watch the video below.

 

 

http://www.youtube.com/watch?v=ovIZtcmkkNA