diff --git a/demo/index.html b/demo/index.html
index e9203232..b25163ac 100755
--- a/demo/index.html
+++ b/demo/index.html
@@ -8,8 +8,12 @@
 	<link rel="stylesheet" href="style/style.css" media="screen">
   <!-- only using jqueryui for draggable -- a lighter solution would be nice -->
 	<script type="text/javascript" src="../src/deps-min.js"></script>
+  <!-- TODO: move Backbone in deps-min -->
+  <script src="../vendor/backbone/0.5.1/backbone.js"></script>
+
 	<script type="text/javascript" src="../src/util.js"></script>
 	<script type="text/javascript" src="../src/costco.js"></script>
+	<script type="text/javascript" src="../src/dataset.js"></script>
 	<script type="text/javascript" src="../src/recline.js"></script>
 	<script type="text/javascript" src="js/app.js"></script>
 </head> 
diff --git a/demo/js/app.js b/demo/js/app.js
index 1043110f..30a42f30 100755
--- a/demo/js/app.js
+++ b/demo/js/app.js
@@ -16,34 +16,21 @@ app.handler = function(route) {
 app.routes = {
   home: function() {
     // HACK: this should be in the html file (and really we need a much simpler example and keep this as recline-full example)
-    var dataset = {
-      getTabularData: function() {
-        var dfd = $.Deferred();
-        dfd.resolve(this.tabularData);
-        return dfd.promise();
-      }
-      , tabularData: {
-          headers: ['x', 'y', 'z']
-        , rows: [
-            {x: 1, y: 2, z: 3}
-          , {x: 2, y: 4, z: 6}
-          , {x: 3, y: 6, z: 9}
-          , {x: 4, y: 8, z: 12}
-          , {x: 5, y: 10, z: 15}
-          , {x: 6, y: 12, z: 18}
-        ]
-        , getLength: function() { return this.rows.length; }
-        , getRows: function(numRows, start) {
-          if (start === undefined) {
-            start = 0;
-          }
-          var dfd = $.Deferred();
-          var results = this.rows.slice(start, start+numRows);
-          dfd.resolve(results);
-          return dfd.promise();
-        }
-      }
+    var demoData = {
+        headers: ['x', 'y', 'z']
+      , rows: [
+          {x: 1, y: 2, z: 3}
+        , {x: 2, y: 4, z: 6}
+        , {x: 3, y: 6, z: 9}
+        , {x: 4, y: 8, z: 12}
+        , {x: 5, y: 10, z: 15}
+        , {x: 6, y: 12, z: 18}
+      ]
     };
+    var dataset = new RECLINE.Model.Dataset({
+        title: 'My Demo Dataset'
+      },
+      demoData);
     recline.bootstrap(dataset);
   }
 }
diff --git a/src/recline.js b/src/recline.js
index 5a16e646..33fdfdaf 100755
--- a/src/recline.js
+++ b/src/recline.js
@@ -147,9 +147,10 @@ var recline = function() {
     showDialog('busy');
     dataset.getTabularData().then(function ( tabularData ) {
       util.hide('dialog');
-      app.headers = tabularData.headers;
+      app.headers = tabularData.get('headers');
       // TODO: should this be callback like
       app.rowCount = tabularData.getLength();
+      // TODO: delete?
       util.render( 'actions', 'project-actions', $.extend({}, app.dbInfo, {url: app.csvUrl}) );    
       var offset = 0;
       app.tabularData = tabularData;