In this article we will look at how to modify the sample Add-in app and make it do something other than the sample app.

Introduction

In the previous articles we have looked at how to create a sample app, how it works and how to make it contextual. In this article we will make the sample Add-In actually link to something useful.

Bluemix Websockets chat

A while ago I created a sample websockets chat demo – https://xominosocket.mybluemix.net/. It is hosted on IBM’s Bluemix PaaS cloud and uses Socket.io ontop of a node.js server. The back end application runs an in-memory data cache using Redis.

None of which is anything in the slightest to do with Microsoft! Which is the main reason I picked it (the fact that I am lazy and it was just sitting out there as a great example already has nothing to do with it….)

Modifying the sample app

In this article we are going to make a few simple changes to the sample app Home.html which will make the Bluemix Chat demo appear contextually within a email.

Admittedly this is a bit of a hack but hey – it is just a demo.

• I removed App.js, App.css, Home.js and Home.css – don’t need them
• I removed the contents of the Body of Home.html and replaced it with an iframe pointing at the websockets demo.
• I added a little styling to make it seamless
  and ran it

 

As far as the user is aware – we now have a websockets chat application embedded within their Outlook email. The Websockets chat is fully functional within the context of the email.

Marky’s Use Cases #1: Helpdesk support Add-in

So there is an application for this Add-in technology. A “Contact the Helpdesk” link within a business email which would facilitate pulling up a web chat session with a helpdesk representative. The context of the email from whence it was created could be passed to the helpdesk and they would then be able to assist the user.

How cool is that 🙂

Conclusion

In this article we have seen how to insert a completely non-Office application, contextually within an email which only contains the word websockets.