OSG is a Open Social application generator. It's use some html code (and some special makup too) and some JS code and gereneate a complex, compressed and optimized application.
It's opensource :)
Changelog
0.4Alpha
- Fix some bugs.
0.3Alpha
- JTidy => htmlparser
- IF BLOCK = <osg:if test="value"></osg:if>
- FOR BLOCK = <osg:forEach var="variable" key="index" itens="array"></osg:forEach>
- INCLUDE = <osg:include template="header" />
- (i'm tired)
0.2Alpha
- Changing self::method() to this.method() in hrref / onclick
- Bug: templates/.file.htm crash (files generated by eclipse)
Features
- Information about application in .JS Annotations.
- Generate javascript DOM code from HTML files. var template = new osg.Template("bar.htm");
template.add("list", [{name:"Jorge", id:1}, {name:"Falcão", id:2}]); template.add("mensagem", "Hello");
template.show();
- if/loop(or for) functionality in templates.
- Automatic IG_Images with absolute URL on <img> tags.
- automatic self::action this.method app.method() bind on href / onclick.
- YUM Compressor (CSS / Javascript)
- new the class "ignore" will ignore the element in template. (testing layout)
- new ANT Task
- and more... :)
Requirements
- JRE 1.5>
- apache-ant
Know Issues
- Don't use style="" in tags.
- Annotations works in anywhere on the jscode.
Examples
Annotations
You can use annotations to define some application settings. Exemple: (application code)
/** * Some comments... * * * @id YOU_APP_ID__MODULE_ID__ * @title OSG Sample application * @height 500 * @description This is a OSG Generated application * @singleton * @thumbnail resources/thumbnail.jpg * @require opensocial-0.5 * @require tabs * @require flash * @initFunction onInit * @include lib/mylib.js * @include resources/another_file.css * */
- @id => The application instance name ($INSTANCE reference on js code)
- @initFunction => first function called on application object.
- @include > add css and javascript.
- @js => include a external javascript
- @css => set the css file. (resources/default.css is added if exists and @css don't exists)
Using if / loop in template.
application code (javascript)
...
var template = new osg.Template("bar.htm");
template.add("list", ['item1', 'item2', 'item3']);
template.add("key", "fasd0f7asdfhasdfalsdf");
template.show();
...in template/foo.htm
<osg:if test="test">
<ul>
<osg:forEach itens="this.list" var="name" key="id">
<li class="time">
<a href="app.method(name, id)">{name} - ID: {id}</a>
</li>
</osg:forEach>
</ul>
</osg:if>Using self::action() this.action() app.action()
application code (javascript)
...
doSomething:function(id) {
// do something with id.
}
...in template/foo.htm
<ul>
<osg:forEach itens="list" var="name" key="id">
<li class="time" >
<span> <a href="app.doSomething(id)">{name}</a> - ID: {id} </span>
</li>
</osg:forEach>
</ul>Complex examples
application code (javascript)
...
var template = new osg.Template("foo.htm");
template.add("object", {foo:function(p) { alert(p); }});
template.add("key", "fasdf0a8fash6a");
template.add("lista", [1,2,3,4]);
template.show();
...in template/foo.htm
<ul if="{list}" >
<osg:forEach itens="list" var="value" key="key">
<li class="time">
<span> <a href="{object.foo(value, key)}">{value}</a></span>
<!-- value is the loop item, and key is a passed data -->
</li>
</osg:forEach>
</ul>Using include
in template/bar.htm
<div> <osg:include template="foo" /> </div>
Using $HOST and $INSTANCE
application code (javascript)
//$INSTANCE is the main application object.
var $INSTANCE = {
onInit:function() {
//$HOST is defined in --host
~~_IG_FetchXmlContent("$HOST/xml/something.xml", function(){});~~
}
}Quickstart
1. Install JRE
2. Create a new project path like sample/tabs or sample/simple
3. Execute
java -jar osg-0.2alpha.jar --charset=UTF8 --host http://YOURAPPHOST sample/simple/app.js
If you like apache-ant use something like:
<target name="build-sample">
<java jar="${file}.jar" fork="true" logerror="true">
<arg value="--charset" />
<arg value="UTF-8" />
<arg value="--host" />
<arg value="http://YOURAPPHOST" />
<arg value="sample/simple/app.js" />
</java>
</target>4. The app.xml generated in /sample/project1/ path.
