diff --git a/index.html b/index.html index 47a006d4..4593c718 100644 --- a/index.html +++ b/index.html @@ -43,14 +43,17 @@ Recline Data Explorer
+
@@ -98,35 +101,6 @@
CSS: the demo utilizes bootstrap but you can integrate with your own HTML and CSS. Data Explorer specific CSS can be found here in the repo: https://github.com/okfn/recline/tree/master/css.
-
-// Note: you should have included the relevant JS libraries (and CSS)
-// See above for dependencies
-
-// Dataset is a Backbone model
-var dataset = recline.Model.Dataset({
- id: 'my-id'
- backend: {
- // backend ID so we can look backend up in the registry (see below)
- type: 'memory'
- // other backend config (e.g. API url with which to communicate)
- // this will usually be backend specific
- ...
- }
-});
-// DataExplorer is a Backbone View
-var explorer = recline.View.DataExplorer({
- model: dataset,
- // you can specify any element to bind to in the dom
- el: $('.data-explorer-here')
-});
-// Start Backbone routing (if you want routing support)
-Backbone.history.start();
-
- More details and examples: see docs below and the Demo (hit view source). The javascript you want for - actual integration is in: app.js.
-Recline has a simple structure layered on top of the basic Model/View distinction inherent in Backbone. There are the following three domain objects (all Backbone Models):
@@ -142,7 +116,33 @@ Backbone.history.start();
+// Note: you should have included the relevant JS libraries (and CSS)
+// See above for dependencies
+
+// Dataset is a Backbone model so the first hash become model attributes
+var dataset = recline.Model.Dataset({
+ id: 'my-id'
+ },
+ // Either a backend instance or string id for a backend in the registry
+ backend
+);
+// DataExplorer is a Backbone View
+var explorer = recline.View.DataExplorer({
+ model: dataset,
+ // you can specify any element to bind to in the dom
+ el: $('.data-explorer-here')
+});
+// Start Backbone routing (if you want routing support)
+Backbone.history.start();
+
+ More details and examples: see docs below and the Demo -- just hit view source (NB: the javascript for the + demo is in: app.js).
+ + +