IntroToZimlets

Introduction to Zimlets

   KB 2900        Last updated on 2015-07-12  




0.00
(0 votes)
License Terms

Introduction to Zimbra Architecture

When you think about the Internet chances are you immediately think about the World Wide Web. However it was E-Mail that was the Internet’s first “killer application.” The most common Email environments, such as Exchange and Notes, are hard to customize which has led to organizations being forced to adapt to how their tools do things, rather then adapting the tools to their needs.

Unlike the chaotic nature of the web, E-Mail tends to be highly structured and centralized. This helps to explain why proprietary applications such as Exchange and Notes have been the only real choice for enterprise messaging. Both platforms are hard to customize which has led to organizations being forced to adapt to how Exchange and Notes do things, rather then adapting Exchange and Notes to their needs.

Zimbra is an Open Source program that marries the best of E-mail with the flexibility and accessibility of the web. In this series of articles Joshua Prismon will teach you how to extend Zimbra to reflect your needs.

Introducing Zimbra

At the simplest level Zimbra is a complete mail and calendaring platform. The platform is capable of sending and receiving email via the standard email protocol that the Internet uses for email: SMTP. Zimbra can also support specific types of email – email about calendar events, tasks, and general documents. All of this functionality can be expanded by developers. In this shortcut we will expand our functionality in three ways. For the first example this document will show you how to integrate syndicated data directly into the Zimbra Web Client. The second example will take that a bit farther by integrate outside data sources into the user’s experience. Finally we will integrate a full application into Zimbra allowing users to be more productive without ever leaving their email. These extensions are possible because Zimbra is open source. Open source not only means that the platform is expandable, but it also is lower risk to corporations. Zimbra can be extended without having to depend on closed APIs. Services can be written in such a manner that they work for your users even if you move to a different platform in the future. Zimbra consists of server backend which sends and receives mail and two web-based front ends. The first front end is the administration interface which allows for easy management of the server. The second front end is that of the standard user application: the Zimbra Web Client.

While it is possible to expand all three components, this shortcut will focus on extending the Zimbra Web Client. Zimbra provides several extension methods that isolate you from the complexities of the ZWC.The first extension method is simply using the Zimbra GUI to integrate data from the Internet. The second is defining a “zimlet” to integrate outside services. Finally we will extend the ZWC using JavaScript.

Zimbra Web Client


The ZWC, shown in Figure 1, has tabs along the top for each of its major functions: Mail, Address Book, Calendar, Tasks, Documents and Options. The interface looks familiar to anyone who has used products such as Microsoft Outlook, Mozilla Thunderbird, or other web mail applications. Messages can be sent, received, saved, and deleted. Calendars and events can be managed. There is also functionality for contact management, centralized documents, task management and individual user options.

An Internet Application

There are two popular models for email services today: web mail pages and dedicated desktop applications. The “web mail” approach has become more popular with the rise of free mail services such as HotMail. In this approach a user connects to the webmail server via a web browser. The browser requests the start page from the server. The server validates the user. Once the user is valid the web server pulls the email messages using a protocol like IMAP and then converts messages from their native format into html. Finally that HTML back to the client. The user reads, deletes, or composes new messages using different pages that are provided by the server. There are a few drawbacks to this model:

  • The biggest drawback is that the model is almost completely server based. Any change in functionality requires access to the server, where the programmer manipulates the HTML output in a message to contain the functionality.
  • Because HTML wasn’t designed for rich interactive applications, the interface tends to be clunky. The browser buttons (Home, Back, etc.) don't map well to tasks in an email application.
  • The server must create an entire HTML page for every function the user wants to do and send it to the client. This is bandwidth intensive and a drag on performance.
  • The single-page HTML model also breaks the principle of separation of concerns, because the HTML generated is a mix of data, presentation markup, and bits for managing the application (links to other pages to send new email, delete messages, etc).
  • The client has no sense of state, so the server must do additional magic to keep track of each client.

This approach can be contrasted to programs that run directly on the desktop. In this model each machine has a specialized program that speaks its own exotic protocol to a dedicated server which provides email and calendar information back to the client. The server doesn’t need to worry about how to display the data or how to keep track of every user. The desktop application does that for them. The desktop application is written for the local operating system and has access to rich user interface API’s that webmail applications can not access. Of course desktop email applications have their set of drawbacks too.

Different Types of Applications
  • To access email, users must have the client installed on their machine. This results in more maintenance requirements for IT departments, more investments in hardware and software, location dependence (you can't use your mother's computer to read your mail when you are on a visit to her), and possibly in vendor lock-in.
  • Extendibility is hard, because extensions must be written for the same platform the client is in. To run on different hardware or different operating system, both the desktop application and the extensions must be ported.
  • Extensions can not easily access the Internet.


The Zimbra Web Client blends the best features of these two approaches by providing an application that runs in your web browser. Unlike the webmail approach ZWC is an application in its own right. The client downloads executable JavaScript code not static pages. This code then runs inside the browser and communicates with the server much like any desktop application would. However unlike a desktop application the code is downloaded from the server and run without any installation eliminating the vendor lock-in and distribution costs of a desktop client.

AJAX and Mashups

While the term AJAX (Asynchronous JavaScript and XML) was actually created elsewhere, AJAX as a technique was basically invented by Google. When Google introduced their Google Maps technology they didn’t want to the user to be forced to reload the page when they scrolled the screen to the north, east, west, or south. So instead of writing all of the logic to display the map on the server, they instead wrote it for the Client-side in JavaScript. Instead of the server determining what to display the Client would figure out what is needed, ask the server for the data (in this case map graphics) via XmlHttpRequest, and then stitch the data into the users interface. Like all great technology it was then used for a purpose that Google never imagined. Outside users discovered that they also could load the JavaScript application code into their web pages to display maps and could even add outside sources of data to present new maps. By mashing up different sets of data new applications could be created independently of what Google originally intended. These hybrid applications were later named “Mashups.” This means that Zimbra only has one HTML page: the initial page that loads all the JavaScript code that creates the Zimbra Web Client. Once that JavaScript is loaded, Zimbra uses XmlHttpRequest to load data and JavaScript dynamically creates HTML that the user interacts with.

Zimbra has one more huge advantage. Since ZWC runs inside the browser Zimbra can do anything the browser can. That includes accessing information or other applications on the Internet. Unlike webmail applications (that must have the server changed for every new feature added) or desktop applications (that don’t natively support Internet access) extending Zimbra to communicate with the outside world is simple and easy. There are downsides to the model as well. The biggest is that JavaScript is an interpreted language and is therefore slower than desktop applications all things being equal.

Microsoft and XmlHttpRequest

The functionality that Zimbra and the rest of the Web 2.0 applications utilize was created by Microsoft. Microsoft was trying to create a proprietary web application that would mimic their Outlook desktop application. To get around the page refresh problems they introduced a new ActiveX object designed to interact directly with the server without needing a HTML reload: XmlHttpRequest.

XmlHttpRequest can fetch or post data to and from the server directly into JavaScript. From there JavaScript can use the Document Object Model (DOM) to change the markup and the data on the page accordingly. XmlHttpRequest is the backbone of ZWC.

Zimbra has only one HTML page: the initial page that loads all the JavaScript code that creates the Zimbra Web Client. Once that JavaScript is loaded Zimbra uses XmlHttpRequest to load data and Javascript dynamically creates the interface that the user interacts with. While props must be given to Microsoft for extending JavaScript in this matter, Microsoft implemented XmlHttpRequest in such a way that it only worked in Internet Explorer. This ensured that the XmlHttpRequest was almost completely ignored outside of Microsoft and even Microsoft ignored it for a while as they let Internet Explorer atrophy. It’s only recently with Firefox and the Google applications that XmlHttpRequest (under its more hip name of AJAX) has become popular and widely accepted.

Zimbra Extensions

There's a special place in heaven for whoever had the patience to get all of that JavaScript right."

- Paul Ambrose

Zimbra does email and calendaring very well. Since you and your users spend plenty of time looking at email and calendars it makes sense to try and integrate it with outside sources of information. Previously this type of integration required complex server programming in Java, Perl, PHP, as well as control of both data sources. Recently new web techniques and technologies (called AJAX) have allowed web pages and clients to do the same level of integration at the browser using JavaScript instead of the server. This technique of integrating separate data sources at the client has been given the marketable name of “Mashups.”

The good news is that ZWC is written completely in JavaScript which means very easy integration. The bad news is that ZWC is written completely in JavaScript and JavaScript can be scary. Just the word JavaScript invokes nightmares of cutsey mouse-over tool-tips, incompatible browsers, and pages that break completely with default browser settings. Zimbra’s thousands and thousands of lines of JavaScript is enough to make the most experienced Web Page Developers, Java coders, and sysadmins wake up in the dark of night in a cold sweat.

Zimbra provides several extension methods that isolate you from the complexities of the ZWC. This shortcut will walk you through three different extensions that correspond to three stages of functionality and flexibility. The first and most simple is the built in RSS and iCal support which is directly integrated into Zimbra’s calendar and folder areas. The second stage will use outside services to aggregate and manipulate data in a way that can integrate with Zimbra’s mail view window. The final stage will show you how to integrate a full application into Zimbra.

Extending Zimbra by Joshua Prismon is licensed under a Creative Commons Attribution-Noncommercial-Share Alike 3.0 United States License


Verified Against: unknown Date Created: 6/18/2009
Article ID: https://wiki.zimbra.com/index.php?title=IntroToZimlets Date Modified: 2015-07-12



Try Zimbra

Try Zimbra Collaboration with a 60-day free trial.
Get it now »

Want to get involved?

You can contribute in the Community, Wiki, Code, or development of Zimlets.
Find out more. »

Looking for a Video?

Visit our YouTube channel to get the latest webinars, technology news, product overviews, and so much more.
Go to the YouTube channel »

Jump to: navigation, search