Although the align=”" method is quite useful for making simple layouts, it became clear that for more advanced layouts, one might want to use a different system. Although the markup isn’t as clean the following method allows for N dimensional complete layouts to be created:
This layouting method is available as of PlatForm 0.98.2. The align=”" method is also available, because I feel they are complementary.
Loading and Saving state
After making this generalization step I felt it could be even better. I looked at how well-known applications solve their layouts. Programs like Photoshop offer loading and saving of the layout state. They do this to offer their users a way to easily switch layouts when needed, for instance to execute a different task with the same program, or when working on a different screen resolution.
To start I put all the layout information in a seperate file called layouts.xml.
Each node is connected to a component using the name attribute, which points to the component’s id. We create the components using the following bit of JML; You can set up your entire application without worrying about the layout.
As you can see the components don’t have any layout associated with them. Running the code now would show only a bunch of red lines on the screen. We want to specify that the application starts with loading a layout from the file. We set this up using the j:appsettings tag with a datasource instruction in the layout attribute.
These layout examples are very impressive and seem to function properly in FF and IE.
BUT: I have just updated my Opera browser to version 9.5; in this version, the layout
examples are shot after having moved a splitter.
[…] I’ve never been a big fan of the Eclipse IDE’s user interface, but personal biases aside, Ruben Daniels has come up with a pretty impressive feature in his Javeline framework: a dockable frames system for Ajax applications. […]
Unfortunatly I’m a prototype/scriptaculous user and adding JavaLine would be too heavy for my web application
Is there a way to use the latest example as a standalone feature ? What are the minimum JavaLine component needed to make it works ? Is JavaLine compatible with Prototype ?
We are working on compatibility with js solutions that enhance coding and animation. This is planned for v0.99. We will integrate with jquery, prototype, scriptaculous first. You can use the Javeline Packager (available on http://developer.javeline.net/downloads.php) to repackage Javeline Platform with just the components you need. Be aware, that Javeline PlatForm is a development platform for Ajax Applications/Sites. It is a declarative solution where you create an application using namespaced tags in html. Check out the other articles on my blog to get more info on what you can do with it. (If you use JPF, you will probably not only use docking windows, but also many of the other widgets to create your GUI. Like <j:tree /> etc)
To answer your questions directly. Yes, from the next version you will be able to easily combine it with prototype (you might already, but it’s untested. Javeline PlatForm has everything nicely in one namespace, but you might have the window.onload problem). Yes, you can make it smaller, but it will still be 80kb compressed minimum. Hope this helps. You can join the PlatForm mailinglist if you wanna ask more questions. http://developer.javeline.net/mailinglists.php.
Can Javeline be used as a stand-alone client-side framework for developing javascript applications without the need for using any other Javascript libraries? I am trying to understand what Javeline Framework actually is and how it compares to other frameworks like Dojo, YUI, jQuery or Sproutcore.
The latest version of Javeline PlatForm is downloadable at http://developer.javeline.net. The docking example itself is simply a matter of saving the html file and running it with the latest version of Javeline PlatForm. If you need any help with it you can use the mailinglist to ask questions. http://developer.javeline.net/mailinglists.php
I can’t save this example too. If I save html and runnig it with Javeline PlatForm - i see the following error:
[Exception… “‘Error: 1077′ when calling method: [nsIDOMEventListener::handleEvent]” nsresult: “0×8057001c (NS_ERROR_XPC_JS_THREW_JS_OBJECT)” location: “JS frame :: chrome://firebug/content/spy.js :: onHTTPSpyReadyStateChange :: line 491″ data: no]
[Break on this error] null
spy.js (line 491)
switchLayout is not defined
[Break on this error] if(attr[i].nodeName.substr(0,2) == “o…eName, new Function(attr[i].nodeValue));
Firefox 3.0.1
You also have to save the docking.js and docking.js file and skins.xml. In a few weeks we’ll be releasing version 1.0 of Javeline PlatForm which will include this example and many more in an easy to download package.
This is impressive, I’ve had the urge to implement docking windows in my own framework.
But after reading JAcon Nielsens usability book I’ve concluded that no normal users would be able to take advantage of docking windows. Docking windows are really only used in very advanced desktop applications. You would only need this kind of functionality if you’re building a new webbased eclipse or something for simularly advanced users. So be carefull in using this, normal users will not know how to use your application if it has docking windows.
Having said that, if you do have an application for very advanced users, this is great stuff.
I absolutely agree. I wasn’t actually adding a docking feature. I was just getting the alignment engine with splitters in place. Adding docking was just a step further, so I felt an irrational urge to implement that too.
