Introduction
Consider a situation where you are coding for hours in Visual Studio and you don’t have time to check your emails in your web browser and due to this you may miss some of your important notifications. Of course there are ways to get notifications of your emails, but imagine how good it would be if you could get your email notifications straight in your Visual Studio. That’s what we are going to do today.
In this article we will make a Visual Studio extension (Visual Studio VSIX Package) that would notify us for our emails in Visual Studio Status bar.
Visual Studio Extensibility
Visual Studio extensibility allows developers to develop their own custom pluggable extensions to Visual Studio IDE to customize Visual Studio and add functionality as per their need. Simply stated, you can create your own functionality that you want Visual Studio to have and add to it. So we will create our own functionality to fetch email notifications and show it in the status bar of visual.
If you want a kick start before proceeding to this article you can first refer this article by Akhil Mittal which will help you create your first VSIX package.
What we are going to create
Let’s just take a glimpse of what we are going to create in the end.
Custom Tool Window to let users login in their email account:
Email Notification in status bar of Visual Studio:
Prerequisites
Before we start developing make sure you have following:
- Visual Studio 2013 or latest. I am using Visual Studio 2013 Community Version.
- Visual Studio SDK
- For VS 2013 download from here.
- The Visual Studio 2015 SDK is no longer offered as a separate download. Instead, Visual Studio Extensibility Tools (SDK and templates) are included as an optional feature in Visual Studio setup.
Getting your hand dirty
Well we have talked a lot, now it’s time for some action. Let’s start developing our extension for Visual Studio. I will guide you through all the steps that needs to be taken to develop a VS Extension. Now fasten your seat belt and get ready for fun ride.
Step 1: Creating VS Package
Create a new project of type Visual Studio Package from the Extensibility category. Choose a name and location for the project.
After clicking on ‘OK’ a wizard will appear that will guide you through some initial steps.
Click on ‘Next’ to proceed.
Next Wizard will ask you to choose your programming language in which you want to develop.
Choose Visual C# because we are going to write our code in C# language and then click on ‘Next’.
The next screen will ask you the details of your package.
Give company name, VSPackage name and details according to your choice and then click on ‘Next’.
Next screen will ask you for the options you want to include in your vspackage. Check on Tool Window because we will require one to get user email credentials.
On next screen type the details of the ‘Tool Window’ that you included in the previous step.
Window name is the name that will appear in the Visual Studio windows list and commandId is the id that will be used in code to uniquely identify it.
Next screen will ask you whether you want to include tests for your project. In this article I have not selected this option as I am not writing any test. This is the final step of wizard. Click on finish.
A project hierarchy will be created for you that will include required files for your VS Package.
Step 2: Creating Tool Window
By default a dummy Tool Window is already created in the project because we have selected one in the wizard. Let’s modify that tool window according to our need.
Open MyControl.xaml and replace the code by the following:
<UserControl x:Class="Microsoft.MailNotifier.MyControl"
xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006"
xmlns:d="http://schemas.microsoft.com/expression/blend/2008"
Background="{DynamicResource VsBrush.Window}"
Foreground="{DynamicResource VsBrush.WindowText}"
mc:Ignorable="d"
d:DesignHeight="300" d:DesignWidth="300"
Name="MyToolWindow">
<Grid>
<StackPanel Orientation="Vertical">
<TextBlock Margin="10" HorizontalAlignment="Center">Notifier</TextBlock>
<Grid >
<TextBlock Margin="25,0,0,0">E-Mail</TextBlock>
<TextBox Width="200" Margin="60,0,0,0" Text="{Binding Email,UpdateSourceTrigger=PropertyChanged}"></TextBox>
</Grid>
<Grid >
<TextBlock Margin="25,0,0,0">Password</TextBlock>
<PasswordBox Width="200" Margin="60,0,0,0" Name="MyPasswordBox"></PasswordBox>
</Grid>
<Button Content="Sign In" Command="{Binding SignInCommand}"
Margin="5"
Width="100" Height="30" Name="button1"
CommandParameter="{Binding ElementName=MyPasswordBox}"/>
</StackPanel>
</Grid>
</UserControl>
This is basically XAML code to create some text blocks, text box, password control and button.
UI is created for our tool window.
Let’s see what other files we have.
- MyToolWindow.cs - It contains the
MyToolWindow class that inherits from ToolWindowPane which has its unique guid and content is set to our XAML control class. We don’t need to modify it. - PkgCmdID.cs - it contains uint code for command to open tool window. We also do not deed to modify it.
- source.extension.vsixmanifest - it contains details of our package, we have already modified it during wizard step.
- MailNotifierPackage.cs – it is the main package that owns our tool window it has methods to show and hide tool window. It add option in menu of Visual Studio to open Tool window. In our case keep it un-touched.
- MailNotifier.vsct – this is the file where you define menu items, their icons and title, shortcut keys etc. but Visual Studio has already created a menu to open tool window so we do not need to touch.
See most of the work has already been done by Visual Studio.
Step 3: Creating View Model for Tool Window
Add a new class file to project and named it NotifierToolWindowViewModel. This will be our view model for tool window.
We need a property to bind to email text box and we need a command to be on click of sign in button.
So add property and delegate command in view model.
public class NotifierToolWindowViewModel
{
private string _email;
private DelegateCommand signIn;
public NotifierToolWindowViewModel()
{
signIn = new DelegateCommand(SignIn);
}
private void SignIn(object obj)
{
}
public ICommand SignInCommand
{
get { return signIn; }
}
public string Email
{
get { return _email; }
set { _email = value; }
}
}
public class DelegateCommand : ICommand
{
private Action<object> _executeMethod;
public DelegateCommand(Action<object> executeMethod)
{
_executeMethod = executeMethod;
}
public bool CanExecute(object parameter)
{
return true;
}
public event EventHandler CanExecuteChanged;
public void Execute(object parameter)
{
_executeMethod.Invoke(parameter);
}
}
}
If your background is WPF then I am sure it is quite easy to understand.
It’s time to build the solution and see what we have achieved until now. Press F5 to run the project. When you run the project an experimental instance of Visual Studio will be open.
Go to View->Other Windows, there you will find our tool window named as ‘Notifier’.
Click on it to open the tool window.
Yeah! Our half of the work is done. Now we need some mechanism through which we can connect to our email and get notifications. There is no implementation in .NET to get emails but there is SMTP client to send emails (though it will not fulfill our needs). This can be achieved using IMAP (Internet Message Access Protocol) and IMAP IDLE which is responsible to notify users to immediately receive any mailbox changes. There are libraries available which can help us achieve what we want so I have S22.Imap library. It can be downloaded from Nuget gallery http://www.nuget.org/packages/S22.Imap/ and we can include it in our project using package console manager with the command ‘Install-Package S22.Imap’.
Now we have S22.Imap DLL included in our project but before we proceed further we need to register this newly added DLL with a strong name because VS Packages requires all assemblies to be signed with a strong name. To register S22.Imap DLL with a strong name please follow the step mentioned in this link. I have already done that for you and then have included the DLL in the project, you could use the one attached with the article.
Step 4: Implementing S22.Imap for email notifications
S22.Imap library is pretty simple to use, we just need to create ImapClient object and then need to pass our credentials and we are good to go.
Let’s see code to use ImapClient.
private ImapClient client;
private void InitializeClient(PasswordBox pwBox)
{
if (client != null)
client.Dispose();
client = new ImapClient("imap.gmail.com", 993,"username","password", AuthMethod.Login, true);
client.NewMessage += client_NewMessage;
client.IdleError += client_IdleError;
}
ImapClient constructor takes hostname, port, username, password and true (means SSL =true) to connect your email account. Then we can subscribe its two events to get notified when a new mail is received and some error occur during idle waiting for mail.
private void client_IdleError(object sender, IdleErrorEventArgs e)
{
}
private void client_NewMessage(object sender, IdleMessageEventArgs e)
{
}
Now we are good to get notified whenever a new mail is received, but there is a catch here. If we try to connect our Gmail account it will throw some connection error because Gmail is very secure and doesn’t let less secure applications to make connections with your account for the purpose of your security. So to make our application connect with Gmail we need to change settings of our account to allow connections from less secure application.
Follow this link to set its security https://www.google.com/settings/security/lesssecureapps
Everything is set now to receive notification.
Step 5: Displaying our custom text in Visual Studio Status bar
To display our custom text in Visual Studio Status bar we need to implement the IVsStatusbar service of Visual Studio which provides method to set text in status bar. Let’s see the code.
private IVsStatusbar StatusBar
{
get
{
if (bar == null)
{
bar = Package.GetGlobalService(typeof(SVsStatusbar)) as IVsStatusbar;
}
return bar;
}
}
public void DisplayMessage(string msg)
{
int frozen;
StatusBar.Clear();
StatusBar.IsFrozen(out frozen);
StatusBar.SetText(msg);
StatusBar.FreezeOutput(0);
}
public void DisplayAndShowIcon(string message, object iconToShow)
{
object icon = (short)iconToShow;
StatusBar.Animation(1, ref icon);
StatusBar.SetText(message);
Thread.Sleep(3000);
StatusBar.Animation(0, ref icon);
StatusBar.FreezeOutput(0);
StatusBar.Clear();
}
SetText() is the method that will do the magic.
We have all the parts in hands, all we need now is to assemble these parts and complete our code.
Below is the complete code of the NotifierToolWindowViewModel class.
using Microsoft.VisualStudio.Shell;
using Microsoft.VisualStudio.Shell.Interop;
using S22.Imap;
using System;
using System.Collections.Generic;
using System.Linq;
using System.Net.Mail;
using System.Text;
using System.Threading;
using System.Threading.Tasks;
using System.Windows;
using System.Windows.Controls;
using System.Windows.Input;
namespace Microsoft.MailNotifier
{
public class NotifierToolWindowViewModel
{
private string _email;
private DelegateCommand signIn;
private IVsStatusbar bar;
private ImapClient client;
private AutoResetEvent reconnectEvent = new AutoResetEvent(false);
public NotifierToolWindowViewModel()
{
signIn = new DelegateCommand(SignIn);
}
private void SignIn(object obj)
{
PasswordBox pwBox = obj as PasswordBox;
System.Threading.Tasks.Task.Run(() =>
{
try
{
while (true)
{
DisplayAndShowIcon("Connecting...", (short)Microsoft.VisualStudio.Shell.Interop.Constants.SBAI_Build);
InitializeClient(pwBox);
DisplayMessage("Connected");
reconnectEvent.WaitOne();
}
}
finally
{
if (client != null)
client.Dispose();
}
});
}
public ICommand SignInCommand
{
get { return signIn; }
}
public string Email
{
get { return _email; }
set { _email = value; }
}
private IVsStatusbar StatusBar
{
get
{
if (bar == null)
{
bar = Package.GetGlobalService(typeof(SVsStatusbar)) as IVsStatusbar;
}
return bar;
}
}
private void InitializeClient(PasswordBox pwBox)
{
if (client != null)
client.Dispose();
client = new ImapClient("imap.gmail.com", 993, _email, pwBox.Password, AuthMethod.Login, true);
client.NewMessage += client_NewMessage;
client.IdleError += client_IdleError;
}
private void client_IdleError(object sender, IdleErrorEventArgs e)
{
DisplayMessage("An error occurred while idling: ");
DisplayMessage(e.Exception.Message);
reconnectEvent.Set();
}
private void client_NewMessage(object sender, IdleMessageEventArgs e)
{
MailMessage msg = client.GetMessage(e.MessageUID);
DisplayMessage("Got a new message!" + " From: " + msg.From +" Subject: " + msg.Subject + " Priority: " + msg.Priority);
}
public void DisplayMessage(string msg)
{
int frozen;
StatusBar.Clear();
StatusBar.IsFrozen(out frozen);
StatusBar.SetText(msg);
StatusBar.FreezeOutput(0);
}
public void DisplayAndShowIcon(string message, object iconToShow)
{
object icon = (short)iconToShow;
StatusBar.Animation(1, ref icon);
StatusBar.SetText(message);
Thread.Sleep(3000);
StatusBar.Animation(0, ref icon);
StatusBar.FreezeOutput(0);
StatusBar.Clear();
}
}
public class DelegateCommand : ICommand
{
private Action<object> _executeMethod;
public DelegateCommand(Action<object> executeMethod)
{
_executeMethod = executeMethod;
}
public bool CanExecute(object parameter)
{
return true;
}
public event EventHandler CanExecuteChanged;
public void Execute(object parameter)
{
_executeMethod.Invoke(parameter);
}
}
}
We have used AutoResetEvent that will notify a waiting thread that an event has occurred.
That’s all folks, we have assembled every piece and it’s time to run the application and test our VS Package. Rebuild the solution and run the application.
- Experimental Instance of Visual Studio will be open.
- Go to View->Other Windows->Notifier.
- Set your email and password in ToolWindow to SignIn.
- Close the Tool Window if you want.
- Wait for new mail.
- New mail notification will be popped in the status bar.
![]()
Conclusion
We have created our own extension for Visual Studio and with minimum effort that’s the little thing we achieved today, but with Visual Studio Extensibility the sky is the limit.
There is lot in here to improve in this code and application. For example, we can implement Google’s API to get email notifications which will be more secure and standard. We can also play with different methods provided by S22.Imap library to get particular mail or search etc. We can also improve UI a bit more and also change default icons of tool window and menus. We can deploy this extension on the market to let other people to use it but these I am leaving to you to explore and improve.
Source Code
Complete source can downloaded from my github link:
https://github.com/vikas0sharma/MailNotifier
