itemscript, a specification for restful json integration
DESCRIPTION
a briefing on the Itemscript project and a demonstration of the Item Lens proof of concept.TRANSCRIPT
Itemscript
A declarative languagebased on JSON
Vision
Simple schema
data storeapplication markup
Applications from componentsDe-couple technical details
Lean developmentBusiness agility
Itemscript is Declarative
• Separates design (what) from construction (how)o Simple APIo Lends itself to iterative developmento Technical details are hiddeno Controls are exposedo Swap components without breaking the API
Itemscript Philosophy
Applications are multi-layered• Core is compiled code• Wrapped around that are configuration files• Wrapped around that are user settings • Compiled settings are the hardest to change• Configuration files help,
but only offer limited access• User settings are usually very limited
Applications should expose all useful settings
Core
Configuration
User settings
Itemscript is JSON
• JSON is simple• JSON has widespread support• JSON is an ideal data-interchange language
JSON easily maps to native objects
JSON Objects• Native objects & packages• Nested object graphs• Maps/hashes/dictionaries• Databases• Key-value stores• Cloud databases
JSON Arrays• Lists/arrays/sets• Query results
Extending JSON
• Deal with more data than fits in memoryo Databaseso Queries
• Handle references• Manage local and remote data• Handle identifiers• Support schemas• Manage persistence• Handle events
Semantics
• Itemscript Schema JSON Schema language
• Itemscript JAM
JSON Application Markup
Itemscript schemaDog Type"com.example.petstore.SCHEMA" :{"Dog" : {"ID name" : "","weight" : 0,"REQUIRED owner" : "","breed" : "","isFixed" : true,}}item of type Dog:"com.example.petstore.dogs.Bella" : {"TYPE" : "com.example.petstore.SCHEMA.Dog","name" : "Bella","weight" : 9.2,"owner" : "Vera","breed" : "Cavalier King Charles","isFixed" : true}
http://itemscript.org/ItemscriptSchema.html
Itemscript JAM
{ "widget" : "GWT.Image", "title" : "Itemscript Logo", "width" : "100px", "height" : "100px", "url" : "./itemscript-logo.jpg" }
Business agility
• Lean development using declarationso Developer & user iterate togethero Discover needs as you develop solutions
• Iterate applications as requirements developo Add elements & event handlers as you need themo Trade up as better options arrive
Proof of Concept
• Item Lens (JAM animator)o rich web UI based on Google GWT
• Item Store (Column store)o persistence based on Apache Derby
• Item Hash (Model application)
o item tracker built using Itemscript JAM
Itemscript execution
Itemscript
Item Lens Item Store
SchemaJAM
Item StoreProtocol
SQL
MQ
Cache
XML
Itemscript Applications
“Small pieces loosely joined” a collection of Lego bricks
Compiled objects are managed in libraries, by type
All "wiring-up" is done using JSON declarations
No sharp distinction between application-building, configuration, or user settings
http://www.smallpieces.com
How we built it
• Build objects that can be configured using JSON.• Use semantics that describe the domain
widget, handler, page ticket, priority, status
white • For each object type,
build a factory that trades JSON for an object instance.• For each class of object (e.g. widget),
combine the factories into a foundry.• Factor out common code.
Itemscript System
• Each system has one "root" JSON objecto Acts as shared in-memory database for your application.o Application configurationo Application state
• You can load additional Items - hold as long as needed, natively-garbage-collected.o Load system and initial configurationo Load Item from remote datastoreo Copy part of Item to current application stateo Discard Item
The Item
The smallest unit of transferrable data.• Guaranteed to be transmitted as a whole.• Guaranteed to be fully navigable locally/synchronously.
Consists of a JSON Object, including nested other objects.
Metadata and data live together in the JSON Object. _ prefix denotes metadata.
_CONNECTION key tells you where this Item came from._ID key gives you the GUID key for an Item.
_PARENT_ID key gives you the GUID key for a parent
Item Lens applications
• Application o a set of nested Widgets.o usually includes a PagePanel.
• PagePanel shows the Pages that have been defined.• Each Page is a set of nested Widgets.
• Popups are also a set of nested Widgets.• Dialog boxes• Error boxes
Item Lens bootstrap
• Item Lens starts an application: o loads modules (using GWT module system), o modules register Foundries containing Factories, or register
additional Factories in existing Foundries. e.g. WidgetFoundry
• Item Lens loads and stores the script file.o Reads script file for more definitions - widgets, pages, popupso stores them in the corresponding Foundry.
• Item Lens reads script file to build the application.
Item Store
The Item Store is a key-value store of Items. Any Item can be the root of another key-value store.
o May map to: database-table-row.o Or to: database-table-row-subTable-rowset.
Easily replaced with SQL tables, key/value stores Maps Item Store namespace locations to connect to
remote locations and services.
Item Store
• Item Store RPCo Simple data store
Get Put Remove
o Simple proxy for the service provider Connect services when your application is ready Swap out services without changing applications
Developing Itemscript applications
• Client sideo Wrap widgets and components in Itemscripto Wire up components to build interfaces
• Server sideo Declare Itemscript data types o Assign types to locationso Connect locations to services
Item Hash
• Building the model application o item hash use caseo item hash design processo pulldown list exampleo date picker exampleo event exampleo adding a new fieldo adding a new event handler
Item Hash Page Nesting
New Case Page Nesting
Editing the Form
{ "widget" : "GWT.VerticalPanel", "contents" : [ { "widget" : "GWT.Html", "html" : "<small>Priority</small>" "id" : "Priority" }, { "widget" : "GWT.ListBox", "width" : "200px", "height" : "20px" "data" : "ItemHash.db/priorities" } ] }
Item Lens
"Can I set the date picker to tomorrow?"
Changing the Date Picker
What would the JSON look like?
{ "widget" : "ItemLens.DatePickerTextBox" "width" : "200px", "height" : "25px", "date" : "tomorrow"}
Changing the Date Picker
When the "date" declaration says "tomorrow", what logic do we need to add?
if (params.hasOptionalString("date")) { String dateStr = params.getString("date"); if (dateStr.equalsIgnoreCase("tomorrow")) { Date tomorrow = new Date(new Date().getTime()+DAY_AS_MILLISECONDS); box.setValue(tomorrow); }}
Event Handling
"Let's make the login box pop up."
Event Handling
What would the JSON look like?
{ "widget" : "GWT.Html" "cellHorizontalAlignment" : "right" "html" : "<small><b>login</b></small>" "clickHandlers" : { "clickHandler" : "ItemLens.PopupPanelShowClickHandler", "popup" : "loginPrompt" }}
Event Handling
Implementing a "clickHandler"
Register a factory to create an action.
Animating "popup" : "loginPrompt"
• Read the "loginPrompt" object in "popups" section.• Parse loginPrompt for the parameter needed.• Build a popup widget.
Event Handling"popups": { "loginPrompt" : { "widget" : "GWT.DialogBox", "id" : "Login", "title" : "user login", "showRelativeTo" : "searchbox", "width" : "100px", "cellHorizontalAlignment" : "center", "cellVerticalAlignment" : "bottom", "html" : "<strong>User Login</strong>", "autohide" : false, "contents" : { "widget" : "GWT.VerticalPanel", "cellSpacing" : 5 "contents" : [ ...
Adding Widget Libraries
GChart{ "widget" : "GChart.Chart", "canvas" : true, "chartHeight" : 200, "chartWidth" : 300, "chartTitle" : "<h3>2008 Sales by Pie Flavor<br>(Puny Pies, Inc.) </h3>", "legendVisible" : false, "initialPieSliceOrientation" : 0.425, "curves" : [ { "symbol" : "pieSliceOptimalShading", "modelWidth" : 6, "backgroundColor" : "green", "borderColor" : "white", "height" : 0, "fillSpacing" : 0, "fillThickness" : 3, "hoverText" : "Apple, 65%", "pieSliceSize" : 0.65, "points" : [ { "point" : "5,5", "annotationText" : "Apple", "annotationLocation" : "outsidePieArc" } ...
• Designers learn a few new declarations, not a new API
• Full demo at http://tinyurl.com/gchartdemo
Downloads
• Item Lens AJAX using Google GWT Components from Google Maps, Gchart, GWT Widget library
• Itemscript Core Libraries Convenient JSON library for Java & GWT applications
What's Next?
• Item Store
• Itemscript schema validator
• Declarative security model
• Hosted Service
• Application exchange
Working with Itemscript
Project pageshttp://itemscript.orghttp://code.google.com/p/itemscript/
Twitter updateshttp://twitter.com/itemscript
FAQhttp://code.google.com/p/itemscript/wiki/itemscriptfaq