Tuesday, May 15th, 2007
Velocity2JS: Templating within
Category: Examples
, JavaScript, Library
Velocity is a popular templating system for Java developers. Velocity2JS takes the engine and has it output JavaScript functions.
Example Velocity Template
HTML:
JS Output
JAVASCRIPT:
-
-
function helloworld(context) {
-
var text = new StringCat();
-
text.push('<html><body>Hello ');
-
text.push(context.world.name);
-
text.push('<table>');
-
for (var i1=0; i1<context .greetings.length; i1++) {
-
var greeting = context.greetings[i1]);
-
text.push(' <tr> <td>');
-
text.push(greeting.language);
-
text.push('</td><td>');
-
text.push(greeting.text);
-
text.push('</td> <td>');
-
}
-
text.push('</td></context></table></body></html>');
-
return text.toString();
-
}
-
2.9 rating from 30 votes
Don’t anyone know, if there is such thing for php?
It’s called Smarty :)
genshi2js is quite a similar thing. but with the genshi template language as target (genshi is nice for python programmers and proponents of the idea that markup based templating is better for markup output).
http://dev.codeflow.org/trac/genshi2js
There’s also a live demo
http://dev.codeflow.org/projects/genshi2js_demo
Does Velocity2JS really generate so many useless spaces?
Honestly, I didn’t spend much time in optimizing the JS output, yet. My first thoughts were stripping all spaces, but this would lead to some problems. Think of the html tag “” for example.
The indention is added manually for readability and is not added to the JS output of course.
Think of the html tag “pre†for example.
Neat, I always liked Velocity as a template language, it had a few issues, but was always pretty straightforward.
we have a similar project with different sintax, check out
http://jstemplate.sourceforge.net/
the equivalent for PHP is…PHP
woops, the code got stripped out, let me try again:
<table>
<?php foreach($greetings as $greet): ?>
<tr>
<td><?=$greet['language']?></td>
<td><?=$greet['text']?></td>
</tr>
<?php endforeach ?>
</table>
@cdude
you don’t understand the nature of this. This is client side templating. Since when does your PHP run on a webclient? And no, the point isn’t that it’s supposed to run on a server. The point *is* precisely that it doesn’t run on the server.
I’m having a hard time fathoming how this could possibly be useful for anything other than chewing up RAM and CPU and bandwidth I don’t have. Forgive my feeble mind but do I really need to download a library so that I can push strings into an array and then concatonate them? Please enlighten me. I really want to know.
I’m with Vance on this one. What really is the point?
For example you have application that outputs some date divided into many pages. If you use ajax to get new data in json or some other format and then put it into template clientside you wouldn’t have to send ready html code each time user goes to other page. It will shurely save your bandwidth
Then you will get a problem with client side templating, cause JS doesn’t have buit in tools and you dont want to concatinate strings.
Instead you want to use som template language you used to. And this library will help in using Velocity template in JS.
PS: sorry for my English
dienow,
“save your bandwidth” seems like a weak argument…
I mean less data you transfer, faster your application is)
@florian, yes i’m well awared that this is client side. What makes you think I was suggesting otherwise? I was merely demonstrating templating in PHP.
Javascript templating can be useful when creating Rich Internet Application. An example of it is my MindFrame Framework which uses ZParse as template engine: http://www.riiv.net/2007/05/01/mindframe-demystifying-rich-internet-application/