Child pages
  • How Fluid Can Help With Sakai Authoring
Skip to end of metadata
Go to start of metadata

Fluid in a Content Authoring Environment

  1. Reuse and adapt existing components
  2. Build new components using the Fluid Framework
  3. Help us implement our skinning system in Sakai
  4. Accessible authoring
  5. Learn about user's needs with our Personas and file management scenarios

Using Fluid Components

Fluid has a focused collection of user interface components that can be used to support content authoring. They are designed to work across different presentation technologies, including pure JavaScript, GWT, and a variety of server-side technologies, making them ideal for use within a portal such as Sakai. They've been designed with usability and accessibility in mind, and they play nice in the kinds of mashups and compositions common to Web 2.0-style content authoring.

Relevant components include:

Building New Fluid Components

As of Infusion 0.5, which will be released next week, Fluid has a small and useful framework for user interface developers. Infusion is designed to solve the common problems encountered by DHTML authors, without adding too much extra complexity or overhead. It is based on the excellent jQuery JavaScript toolkit, and shares its unobtrusive style.

The Fluid framework offers several key tools:

  • Views, which provide a simple way to build up small pieces of presentation-layer code
  • Model Events, a pure JavaScript event system designed to provide loose coupling between views and their models.
  • Declarative Configuration, allowing users to heavily customize the settings of a component. This also encourages very loose coupling of components using a simple JSON-based approach to Inversion of Control
  • Undo, a component "decorator" that provides reusable undo support for model-driven components
  • DOM Binder, which provides an easy way to ensure your components don't break when users customize their markup templates.

The Fluid framework is designed to make it easy to support unobtrusiveness and progressive enhancement, separating presentation, structure, and logic. It offers a model-view-controller based design, and was built from the ground up to work play nice in portals and mashups. The Fluid framework provides a declarative style of programming that helps make it easy for your users to configure and customize your designs. Component declarations are driven by JSON.

Skinning and Accessibility Adaptation

As part of our effort to build the next generation of our PreferAble and StyleAble tools, Fluid is building a new skinning system that will apply different themes and skins to components and web applications. This skinning system will form the backbone of our personalized accessibility strategy, allowing users to adjust the appearance and structure of their user interface.


PreferAble is a user interface preferences editor, allowing the user to select pre-baked themes such as High Contrast and Large Print, along with individual customization of various UI features.

PreferAble 2.0 will be built as a client-side Fluid component using our new template rendering engine. Preferences will be conveyed as simple, JSON-based objects representing the AccessForAll PNP (Personal Needs and Preferences). This new binding will address the substantial weaknesses found in many of the current PNP implementations by providing a straightforward API with a flat hierarchy and a loose type system. A PNP validation library will be paired with this data model to ensure integrity and spec compliance, but without requiring the onerous data typing and nesting of our current Java-based implementation. We'll also define a set of RESTful conventions for storing and retrieving user preferences in AccessForAll format.


StyleAble transforms the interface based on the user's preferences. It has two main capabilities: 1) dynamic reskinning of the user interface, and 2) injecting navigation enhancements such as a table of contents and list of links into a page. These navigation enhancements will be built as Fluid components. In addition to providing quick ways to navigate through a page for keyboard-only users, they also provide useful functionality for content authors. The Table of Contents and List of Links components will provide a simple way to embed page summaries and navigation within any page, similar to Confluence's toc macro.

Accessible Authoring

The Adaptive Technology Resource Centre has already done some work on the TinyMCE rich text editor to improve its accessibility, including offering tools for content authors to ensure their content is accessible to others. Perhaps there is more room to help authors build accessible materials? The W3C's ATAG spec is worth looking at.

Architectures for Collaboration

  • RESTful conventions for describing and accessing content
  • Dynamic component invocation
  • Progressive enhancement: JSON and markup