Last time, in Understand Backbone Forms and Backbone.Model’s Two-Way Data Binding by Playing Around in the Chrome Developer Console, you got to play around in the Chrome Console with some awesome, and extremely powerful features of Backbone Forms and Backbone.Model — like simplified DTO creation and two way data binding.
But, so far in this series, we’ve only used the VersionOne REST Data API, but there are two other APIs, Meta and Localization. Let’s use them now.
And, since every respectable library or web site of the past ten years has dispensed with using the letter e at the end of its name, we’ll create the MetaMorformizr, because it will transform VersionOne meta data into HTML forms.
MetaMorformizr: into the wild blue yonder!
As just mentioned, there’s another aspect to the VersionOne API that can take us up to an even higher level of abstraction and mastery. Right now, you might feel like you’re still in a cocoon, like a caterpillar, eager to fly.
With the VersionOne Meta and Localization APIs you can break free. You can undergo metamorphosis!
VersionOne Meta API
The VersionOne Meta API allows us to query information about the VersionOne Information Model. Quoting from the main documenatation source:
The Meta API provides a facility for retrieving information about the VersionOne business objects. This includes getting information about the asset types, attribute definitions, relationships and operations.
So, here’s a URL you can type in your browser’s address bar to get the meta information for the
Story asset type: http://evel.versionone.net/platformtest/meta.v1/Story?accept=application/json
Distilled down to our normal three stooges,
Name, Description, Estimate, we have:
VersionOne Localization API
Name, Description, Estimate attributes are all one word identifiers, so they can serve as nice titles for fields too, but what if we want to add the
RequestedBy attribute? Do you, as a programmer, want to search and prefix capital letters, after the first character, with a space? You might say, “Hey, that should be easy, let me try it out!”, like I did:
Sure, but no. How to use Localization for real?
Notice the property
DisplayName from the JSON meta output above: AttributeDefinition’Name’Story
This value can be passed to the Localization API to get the label for the field title. But, let’s try it with RequestedBy: http://eval.versionone.net/platformtest/loc.v1?AttributeDefinition%27RequestedBy%27Story
It returns “Requested By”.
There’s a lot more to the Localization API, including getting language-specific strings, so check out the documentation for more information.
Let the transformation begin
Armed with this, we can now dynamically create even the
formSchema itself that we built by hand last time. And, what’s more, we can even dynamically supply the field names on the query string or from a select list.
The HTML has lots of improvements, and some instructional text, plus a hard-coded subset of the possible Story attributes in a select list.
The CSS has improvements too
Try your creation out now, or try the live MetaMorformizr JSFiddle!
There is not all that much different code from the Backbone-Fortified example, except of course for the Meta and Localization API calls and setup. That stuff might look a little bit hairy, but it turns out not so bad.
There are a lot of Underscore.js helper functions in use, plus a feature of jQuery called Deferred Objects. We explains a bit about that in a previous article.
I’ve written most of these articles over the course of just a few days, so I am taking a REST for now. You can HTTP GET this jQuery documentation page to learn more about Deferred Objects, and GET this one to study up on the Underscore.js functions you see in the code.
This Stackoverflow link helped me do the array of deferred objects properly, and notice that it requires a closure, otherwise the variable always ends up pointing to the most recent value in the loop iteration.
Head over to Just for Fun: Convert MetaMorformizr to CoffeeScript to close out this series!
Until next time, stay agile, not fragile.