Upgrading

The Mocha UI feature set is radidly growing. For the next few releases, code structure, naming, and syntax may change considerably from one release to the next in order to accomodate this. Please keep this in mind if you are upgrading from a previous release of Mocha UI. Gradually the code structure and syntax will become more stabilized and upgrading should be a ssimpler process.

FAQ

Why is such and such not working?
Mootools requires an XHTML doctype. Make sure you are using one.
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
Can I use Mocha UI with Prototype?
Maybe. Mootools and Prototype are not compatible, though you might try ProtoSafe which claims to help Mootools and Protoype work together. If your project is using Prototype, Prototype UI may be the way for you to go.
How do I get Mocha UI to work with an older version of Mootools?
I am not familiar with Mootools 1.11 and cannot help you. You will probably have to make a lot of changes. Mocha UI uses new Mootools 1.2 features extensively. You can post in the Mocha UI Google Group asking if anyone is currently working on a port or completed one for the versions of Mocha UI and Mootools you wish to use.
How do I access the parent document's javascript from within an iframe?
Use:
parent.myFunction();
How do I open a new window in the parent document from within an iframe?
Use:
new parent.MochaUI.Window();
How do I close another window from within an iframe?
Use:
parent.MochaUI.closeWindow(parent.$('windowid'));
How do I reload an iframe?
From the parent:
document.frames['windowid_iframe'].location.reload(true);
From an iframe:
parent.frames['windowid_iframe'].location.reload(true);
I have a canvas graphic in a window loaded with xhr. In Internet Explorer 6 and 7 the canvas graphic is displayed the first time the page is loaded, but if the page is refreshed the graphic no longer is displayed.
This is a cache issue in IE6 and 7. Add the date and time to the file you are loading in order to fool IE into treating the file like it would if it were a completely new file.
contentURL: 'plugins/myPlugin/index.html?t=' + new Date().getTime()

Tips for Improved Performance

  • Use the xhr load method rather than loading content into iframes.
  • When not transferring sensitive data, use "get" rather than "post" as your AJAX method.
  • Minify your javascript.
  • Gzip your javascript and css files. This can make them 60-70% smaller. With Apache2 you can use mod_deflate to gzip your files. Older versions of Apache use mod_gzip. Alternatively you can gzip your files with PHP using either zlib.output_compression or ob_gzhandler.

Browser Specific Issues

Internet Explorer

  • In IE6, if you change the opacity of a window it's content will dissappear.
  • In IE7, if you change the opacity of a window the VML graphics with alpha will turn opaque.

Opera 9

  • Though they don't bleed threw thankfully, you can move the scrollbars on windows that are behind other windows.
  • Seems to have issues with Swiff, though you could use SWFobject instead.
  • Resizing windows is very slow in Opera 9.27. There is some performance improvement in Opera 9.5, but it is still slower than the other browsers.

Mac Firefox 2 - Not fully supported

  • Has issues with Flash z-index.

General Issues

If you have a solution for any of these please let me know.

  • In the YouTube example, if the window is maximized and the video is playing, when the browser window is resized, the iframe the flash is in does not resize. This works fine however if the video is paused.

Latest Stable Release

Community

Development

Archive