Sunday, May 26, 2013

Wolfram Alpha Widget App for Office 365/SharePoint 2013

Description of how to create a SharePoint 2013 App

Introduction
SharePoint 2013 uses the new app model to enable all developers to easily create re-uable components that can't negatively affect farm stability, because they do not rely on code deployments on the server itself.
The apps can only use a small subset of the options the SharePoint object model provides, similar to Sandboxed Solutions in SharePoint 2010 (still available in 2013 btw).
The main focus of development with the App model lies in HTML+CSS+Client side code with SharePoint's own Client-side Object Model and/or jQuery.
It is difficult to see just yet what the App model adds to SharePoint development, and what actually the added benefits compared to Sandboxed Solutions are (that already wasnt a very successful new methodology in SP2010).
Solution in Visual Studio 2012
But let's not complain until 2013 has gained more ground and it becomes more clear what the practicality is of the new development model. For now, we can only try it out and see the (im)possibilities of a SharePoint app.

To do just that, and because I became interested again in Wolfram Alpha, I decided to make a SharePoint App that can be used to dynamically pull in some of their user generated widgets. 
Yes indeed, an App that does nothing but show other 'apps' :-)

Wolfram is known in the Computer Science and Mathematics scene for o.a. Mathematica, a very advanced tool for doing and learning about mathematics, and also the search engine that uses some kind of inferencing magic to give you 'smart results' instead of just comparing the search query with the index. The user generated widgets they provide on their site use that search/inefrencing engine in order to create small widgets that provide a specific function.

On the right is an image of the VS2012 solution, most noteworthy is the WolframSharePointApp.js file, that contains all the client side code that makes the app function, the default.aspx that contains the html and script references for the app, and the list instance WolframWidgets. This list holds the information required to fetch the Wolfram Widgets, and will be added to a drop down list so a user can select a single Widget.

See the app below after selecting the Derivative Solver. Also available for selection are the human growth chart, a currency convert, a time zone converter, a calculator and then some. As you can see, with very limited amount of code and by using pre-existing widgets freely available you can quickly create a fun, versatile and perhaps even useful App for SharePoint 2013/Office 365.

The App in Office 365 with the Derivative Solver selected.
Of course the App is not perfect yet (javascript is a bitch!), when it is I'll expand this post with the code and a link to the final product.