Spotty Mushroom

We make stuff for everyone

22 . 06 . 2011

HORN 1.0 – Weave data into your HTML

A slightly mad looking unicorn with a rainbow horn.While NoticeLocal development has been ongoing and we’ve been busy with client projects, we have finally managed to polish up, document and open source a bit of the magic in NoticeLocal’s UI layer: HORN 1.0 (site: horn.io)

HORN (Html Object RepresentatioN) is a new way to optimize your data-driven web applications. Using a microformat-like approach you can extract data that is already in your HTML – instead of serving up empty pages that then make AJAX requests, or returning your HTML rendered full of data and then serving this data again for your JS code to use! This is not “yet another templating library”, it is a different concept that supports full round trip from HTML to model and back to DOM.

How is this done? Well the HORN 1.0 specification details a relatively simple technique for indicating which content in your page should also act as data for your JS code. You can use either special CSS classes or, if you are creating HTML5 apps, HTML-Data attributes.

We also have provided a jQuery-based reference implementation of a HORN parser complete with full data round-trip (extract from HTML to model –> make changes to data model in JS code –> populate updated model data back into HTML DOM) and type conversions.

The benefits include faster site response times (no extra data request), full SEO of your pages including the data within them, and streamlined JS code that interacts directly with a data model.

You can see an example HORN at work here.

Next up for release, hopefully some time tomorrow, is the HORN-jQuery plugin for Grails which makes it trivial to add data indicators to your markup without understanding the underlying HORN mechanisms.

Enjoy!

Follow us on Twitter for updates or check out the code on GitHub.

09 . 12 . 2010

NoticeLocal enters closed beta

We’re truly delighted to announce that our first major project as a team, our online notice board service NoticeLocal, has entered closed beta. This means that you can use it right now, and request an invite that will enable you to create your own notice boards.

This project has been long in the making – a deceptively simple Grails web application with usability at its core. Some of the innovative features we implemented include:

  • No password for log in – for now we’re skipping that and treating all users as if they ticked “remember me”. This suits the casual usage of the service.
  • “Human scale” data entry. We want it all to be as loose as possible, so it is quick and painless to add notices. This means we also added data detectors that will protect Email addresses you enter, auto extraction of Gravatar(s), automatic link detection and automatic linking to twitter accounts when you enter a twitter id in a notice.
  • Ajax-based drill-down search powered by a user-created regional taxonomy

We’ve got lots more planned for NoticeLocal including premium features in the not too distant future.

We are available for hire.

Spotty Mushroom Proudly powered by WordPress