Introducing Tangelo

Over the past two years, we have spent much of our time developing Tangelo [1] in the pursuit of rich web applications for solving problems both old and new. We recently passed 2000 commits in the repository [2], so now is the time to declare: Happy Tangelo Day!

Tangelo is starting to be ready for prime time, and this blog series is going to tell you some more about it. In this first post, I celebrate Tangelo Day with a high-level introduction to the Tangelo Web Framework.

At its heart, Tangelo is a web application development platform, geared primarily towards data analytics and visualization applications. This platform is made up of Tangelo itself – a web server with a twist – and JavaScript and Python APIs to help drive it, plus an ecosystem of plugins providing support for data management, user interfaces, visualization, and more.

What was that “twist” I mentioned? Simply that, in addition to serving the static components of a standard web application, Tangelo also manufactures server side components from Python scripts included among your HTML, CSS, and JavaScript files. These services can leverage the power and scope of Python to do Pythonic things in your web application. Here’s a silly but illustrative example. Suppose you create this short Python script in the directory being served by Tangelo, now.py:

import datetime

def run():
    return str(datetime.datetime.now())

Because of the presence of that run() function, Tangelo will respond with a string representing the current time.

We can try it out right now. Step one is to install Tangelo – the easiest way is using the Python package manager Pip:

$ pip install tangelo

Step two: create the file now.py from the code listing above. Step three, start Tangelo, letting it know you want to serve files from the current directory:

$ tangelo --root .

(If you get an error in this step, it may be that your computer is already using port 8080, the default, for another application. You can add --port 9090 to the command to choose a different port. And if you are using Windows, you may need to issue the command as python -m tangelo --root . --port 9090 instead) Step four, open http://localhost:8080/now in your favorite web browser – you should see the current time displayed. Refresh the browser and the displayed time should update. Your first Tangelo application!

Of course, the example is superfluous because JavaScript has the same ability to tell you the time with a simple console.log(new Date()). But there is plenty Python can do that JavaScript can’t. What if you want to:

• Retrieve data from a database using a complex query and application-specific post-filtering
• Kick off a long-running compute job on a cluster, and check on its progress periodically
• Use specialized visualization tools, such as Bokeh
• Construct a PNG image to display in your webpage using Python imaging libraries
• Use Whizbang, BeesKnees, CatsMeow, or some other hot new Python module that does something useful, sexy, and fun

In each of these cases, and many others limited only by our collective imagination, Tangelo puts more power in your hands to create data sources, analyses, and visualizations.

We have designed Tangelo around the simple idea that Python should be a first class citizen alongside HTML and JavaScript. The core of Tangelo dedicated to this idea is lean and mean and, thus, well testable. To enable advanced functionality on top of this core, Tangelo includes a powerful and flexible plugin system. Plugins enable a wide space for creatively extending Tangelo’s core abilities. Several plugins come bundled with Tangelo to do some of the following:

• Interact with other Kitware software
  • Girder [3], for bringing high performance data storage to Tangelo applications
  • GeoJS [4], for creating map-based visualizations and animations
  • VTKWeb [5], to create, control, interact with, and terminate VTK-based visualizations in-browser
• Interact with Python packages and other software
  • Bokeh [6], for applying ready-made visualizations to custom data sources
  • Vega [7], to create interactive charts and visualizations
  • PyPNG, to construct PNG images of data for use as a thumbnail or a clickable map, etc.
• Implement powerful functionality unique to Tangelo
  • Converting a basic data service into a streaming service to enable the handling of “big data” sources
• Provide help in constructing HTML user interfaces
  • A control panel for runtime application options that slides out of the way when not needed
  • An SVG legend for use with maps or other SVG diagrams

I mentioned before that Tangelo is aimed somewhat towards visualization and analytics applications, and many of our clients, both inside and outside of Kitware, have been using it to good effect that way. But there’s no reason not to step outside the box a little bit too. For instance, Tangelo could be used to create system tools, such as a wifi manager or print monitor, since Python affords a way to peek into such system level services as well.

Hopefully this gives you a glimpse of the sorts of interesting and useful things we hope will arise from Tangelo’s wider debut. Future articles in this series will cover such topics as, who is using Tangelo, how to build an application from scratch, and how we go about testing Tangelo. For now, please take a look at the Tangelo website (http://www.tangelohub.org/tangelo/) for general information, or the documentation (http://tangelo.readthedocs.org/en/latest/) to install, set up, and try Tangelo yourself. Drop us a note at tangelo-users@public.kitware.com if you run into trouble, have questions, or need help.

Happy webbing and Happy Tangelo Day!

Links

[1] http://www.tangelohub.org/tangelo
[2] https://github.com/Kitware/tangelo
[3] http://girder.readthedocs.org/en/latest
[4] https://github.com/OpenGeoscience/geojs
[5] http://www.kitware.com/news/home/browse/Kitware%3F2014_01_24%26VTK+6.1.0+Ready+for+Release
[6] http://bokeh.pydata.org
[7] http://trifacta.github.io/vega
[8] http://tangelo.readthedocs.org/en/latest
[9] tangelo-users@public.kitware.com