old blog,

Obviel.js: Object, View, Element Javascript lib

Izhar Firdaus Izhar Firdaus Follow Support Nov 28, 2011 · 2 mins read
Obviel.js: Object, View, Element Javascript lib
Creative Commons License
This work is licensed under a Creative Commons Attribution 4.0 International License.
I just saw the posts by Martijn Faassen related to Obviel, I was quite busy this past month that I did not notice them, and due to my mail filters I also didn't notice I was added into the obviel googlegroup. (Sorry Martijn >.<)

Anyway, a year ago until a few months back, I was working with Martijn for his client project. It was a pleasure working with him and I learnt quite a lot from him. In the project, we utilize a pattern to allow us to write dynamic site using javascript for the frontend, and JSON at the backend. The server controls what would be displayed in the frontend by returning JSON objects with a specific iface (short for interface). Obviel was then born out from it.

For example, a simple hello world app.

$(document).ready(function(){
$('#main').render('http://path/to/app.json')
})

Where app.json is :

{
iface: 'print',
message: 'Hello world'
}

And the obviel view defined as :

obviel.view({
iface: 'print',
render: function () {
this.el.append('<div>' + this.obj.message + '</div>');
}
})

What Obviel will do is, it will load the JSON, and load the view of the iface of the JSON (in this case, 'print'), and render the view with the data provided by the JSON file (in this case, append the message into #main wrapped in div). Quite cool eh?

Theoretically, you can also use it with WebSocket Push, and have the server fully control what to display in the browser by pushing JSON object. I haven't actually give it a try, but will do when I find the chance, and not feeling lazy. If you want to try it, go ahead, and probably use this radiate socketIO server I wrote 2 months back. It might also be possible to have a view which output Obviel objects for Plone content type, and combine with Diazo, to create a full JS UI for Plone, but those are stuff to poke at when totally not busy.

For more reading, check out Martijn's posts in his blog here http://faassen.n--tree.net/blog/view/weblog/2011/11/02/0 and read up the documentation at the Obviel site: http://www.obviel.org/en/0.-0/index.html
Written by Izhar Firdaus Follow Support
I'm a system architect, data engineer and developer advocate with passion in Free / Open Source software, entrepreneurship, community building, education and martial art. I take enjoyment in bridging and bringing together different FOSS technologies to help businesses and organizations utilize IT infrastructure to aid and optimize their business and organizational process.

[HOWTO] Using Diazo as a standalone server.

Just a little quick note.Diazo, the super cool theming system used by Plone, have 2 WSGI middlewares which will turn it into some sor...

In old blog, Nov 28, 2011

« Previous Post

diazotheme.bootstrap: now with html5slides!!

As promised in my previous post about diazotheme.bootstrap. I've integrated the google html5slides into it.Demo here: http://campusca...

In old blog, Dec 06, 2011

Next Post »