MochaUI is a web applications user interface library built on the Mootools javascript framework. Canvas tag graphics are used for much of the Mocha GUI components.

IE8 RC1 Compatibility

As of r426 in the SVN, all of the MochaUI demos should now be compatible with IE8 RC1 in both the "IE=7" and "IE=8" X-UA-Compatible modes.

As long as it isn't too far off in the future, sometime after the final release of IE8 I will probably release MochaUI 1.0. So if you want to get your sites IE8 compatible before that time please get the code from the SVN.

Uses

• Web Applications
• Web Desktops
• Web Sites
• Widgets
• Standalone Windows, Modal Dialogs and Wizards

Features

Layout

• Horizontally and vertically fluid layout module with columns and panels.
• Optional toolbars.
• Columns and panels can be collapsed, expanded, and resized.
• Panels can be tabbed.
• Panel content can be loaded with innerHTML, XHR, or an iFrame.
• Toolboxes can be inserted in the toolbars.

Windows

• The windows and their drop shadows are drawn with the canvas element.
• Windows can be focused, dragged, resized, collapsed/expanded, maximized/restored, minimized/restored and closed.
• Windows are resizable in 8 directions.
• Adjustable rounded corner radius.
• Adjustable shadow blur.
• Windows can have tabs and toolbars.
• Dynamically create new windows on demand and load their content with innerHTML, XHR, or an iFrame.
• The ability to create multiple new windows from a single Json data request.
• Create modal and notification dialog windows.
• Dynamically update window content.

General

• Minimal HTML markup required.
• Tested in Firefox 3, Internet Explorer 6 & 7, Safari 3, and Opera 9.5.
• Validates as XHTML 1.0 Strict if you use no target attributes in your anchors and validates as XHTML 1.0 Transitional if you do.

Featured Sites Using MochaUI

• Corbis Stock Photography
• Career Day by Chase Wilson of Echo::Factory

Featured Application Using MochaUI

• Pork.Generator

More Sites using MochaUI

• Soundseller
• Universal Curve

Change Log

Next Release

• Themes
• Split panels and windows
• Bezier Path Animation
• IE8 RC1 Compatibility

v0.9.5 9/07/2008

• Added a horizontally and vertically fluid layout module with columns and panels.
• Columns and panels can be collapsed, expanded, and resized.
• Panels can be tabbed.
• Panel content can be loaded with innerHTML, XHR, or an iFrame.
• Added toolboxes which can be inserted in the toolbars.
• Added a second toolbar to the windows so you can now have top and bottom toolbars.
• Added a simple file tree plugin.

v0.9 6/11/2008

• Windows are resizable in 8-directions
• Adjustable drop-shadow width
• Gauges (round windows)
• Sortable dock
• Tabbed windows
• Windows can now be collapsed by double-clicking on their titlebars
• Overhauled code structure to make it more modular
• Added more window options and events

v0.8 3/13/2008

• Added functionality for creating multiple new windows from a single Json data request
• Added animated canvas loading icon to xhr and iframe load methods
• onContentLoaded now works with iframes
• Added styling options which can be set globally and for individual windows
• Added global effects option which toggles most of the window transition effects
• Now you can set individual windows to be draggable, resizable, closable, maximizable, or minimizable, overriding the global settings (Joel Lindau)
• Added closeAll() method which closes all windows at once
• Added more examples
• Fixed scrollbar bug in Firefox 2 on the Mac. Scrollbars no longer bleed through windows that are above them
• Made speed optimizations (Joel Lindau)

v0.7 r22 12/11/2007

• Iframes now resize when you resize a window
• Fixed it so that if the desktop toolbars are removed the rest of the code still works
• Modal windows can now be used standalone without any Mocha UI html markup
• Removed the inline javascript from the example html
• Added optional autohide to the dock (Scott F. Frederick)
• Added the following options to new windows: onContentLoaded, onFocus, onResize, onMinimize, onMaximize, onClose and onCloseComplete (Joel Lindau)
• Added screens/workspaces (Joel Lindau)
• Pulled the slider function out of the core class
• Code optimizations

v0.7 - 12/03/2007

• Added minimize functionality (Scott F. Frederick)
• Added mouseover "title" to close, maximize, and minimize buttons (Scott F. Frederick)
• Added onmouseover "title" to minimized window buttons displaying full header title (Scott F. Frederick)
• The close, maximize, and minimize buttons are now individually optional
• Added several options for setting the properties and style of new windows
• Added additional ajax and iframe support
• Reconfigured how the core class is loaded so it is easier to access the class methods
• Added optional toolbars to the "desktop"
• Added modal dialog windows
• Code optimizations

v0.6 - 11/26/2007

• Fixed the IE6 select issue
• Added a couple more class options
• Minor code optimizations

v0.5 - 11/17/2007

• Initial release