OnionML: Server Side JavaScript Layout Engine

<p>Marcello BastÃ©a-Forte has developed OnionML, a layout template language that uses server side JavaScript with Rhino and E4X on the back end.

The high-level goal of the template engine is to be something with utility not unlike CSS, but for intended layout and composition. The actual functionality is similar to XSLT, but with the design goal of being simple and easily extensible.

Onion ML is an XML template system designed with a bias toward modularity.

Onion ML lets you easily custom XML tags to make modular content design simple and easy to mix with HTML. It is somewhat comparable to XSLT and JSF, but intended to be easier to understand.

You define custom tags either as markup in XML files or as custom JavaScript functions which generate output.

Onion ML also provides several control flow methods necessary for dynamic content. Methods for iterating over data sets and conditionally displaying tags are core to Onion ML's functionality.

You end up building nested tag layouts. For example, you first define a tag:

PLAIN TEXT

HTML:

<tag :mylayout>
<html>
<head>
<title><arg :title/></title>
<style> ... </style>
</head>
<body>
<h1><arg :title/></h1>
<div id="contents"><arg :body/></div>
<div id="footer"><copyright><arg :year/></copyright></div>
</body>
</html>
</tag>
<tag :copyright>Copyright <arg :all/> All rights reserved</tag>

and then you can use it:

PLAIN TEXT

HTML:

<mylayout>
<title>Hello world!</title>
<body>This is my <b>world</b>, too.</body>
<year>2008</year>
</mylayout>

You can also do the work directly in JavaScript:

PLAIN TEXT

JAVASCRIPT:

var onion = new Onion(
<onion>
<tag :mytag>woot, <arg :all/>!</tag>
</onion>
);
onion.add(
<tag :anothertag>play the <mytag>tuba</mytag></tag>
);
onion.add("date", function() {
return new Date().toString()
});

1 Comment »

Comments feed TrackBack URI

Thanks for posting this! I am looking to get feedback on the language and suggestions on the open questions: namely how to deal with assigning attributes and data processing.
Comment by Marcello — February 14, 2008

Ajax Questions and Answers

Caching and dynamic views
My client does not want to change his cache settings on IE and I'm trying to figure out a way to dynamically update a view each time it is visited. I...

IE 8 Crashing Problem
Hello Everyone, Here\'s the situation: two iSeries boxes - Dev and Prod both V5R4M0 We\'re using AJAX to dynamically load content using a tabbed...

JQuery Function Not Defined?
[div]Hi there,[/div] [div][/div] [div]I\'m trying to set a php session variable from a radio button. The idea is that a jquery function is called...