[#180,demos/search][s]: support for getting config from url (not used yet) plus refactor so that template is just for one result.

demos/search/app.js

@@ -1,41 +1,66 @@
 jQuery(function($) {
   var $el = $('.search-here');
 
-  // var url = 'http://openspending.org/api/search';
-  // var url = 'http://localhost:9200/tmp/sfpd-last-month';
+  // Check for config from url query string
+  // (this allows us to point to specific data sources backends)
+  var config = recline.View.parseQueryString(decodeURIComponent(window.location.search));
+  if (config.backend) {
+    setupMoreComplexExample(config);
+    return;
+  }
 
-  // Crate our Recline Dataset
-  // Here we are just using the local data
+  // the simple example case
+
+  // Create our Recline Dataset
+  // We'll just use some sample local data (see end of this file)
   var dataset = new recline.Model.Dataset({
-    records: simpleData
+    records: sampleData
   });
 
-  // Optional
-  // Let's configure the initial query a bit and set up facets
-  dataset.queryState.set({
-      size: 10
-    },
-    {silent: true}
-  );
-  dataset.queryState.addFacet('Author');
-  dataset.query();
-
-  // The search view allows us to customize the template used to render the
-  // list of results
-  var template = getTemplate();
+  // Set up the search View
+  
+  // We give it a custom template for rendering the example records
+  var template = ' \
+    <div class="record"> \
+      <h3> \
+        {{title}} <em>by {{Author}}</em> \
+      </h3> \
+      <p>{{description}}</p> \
+      <p><code>${{price}}</code></p> \
+    </div> \
+  ';
   var searchView = new SearchView({
     el: $el,
     model: dataset,
     template: template 
   });
   searchView.render();
+
+  // Optional - we configure the initial query a bit and set up facets
+  dataset.queryState.set({
+      size: 10
+    },
+    {silent: true}
+  );
+  dataset.queryState.addFacet('Author');
+  // Now do the first query
+  // After this point the Search View will take over handling queries
+  dataset.query();
 });
 
+
 // Simple Search View
 //
 // Pulls together various Recline UI components and the central Dataset and Query (state) object
 //
 // Plus support for customization e.g. of template for list of results
+//
+// 
+//      var view = new SearchView({
+//        el: $('some-element'),
+//        model: dataset
+//        template: mustache-template-or-function
+//      });
 var SearchView = Backbone.View.extend({
   initialize: function(options) {
     this.el = $(this.el);
@@ -59,7 +84,9 @@ var SearchView = Backbone.View.extend({
   ',
 
   render: function() {
-    var results = Mustache.render(this.templateResults, {
+    // templateResults is just for one result ...
+    var tmpl = '{{#records}}' + this.templateResults + '{{/records}}'; 
+    var results = Mustache.render(tmpl, {
       records: this.model.records.toJSON()
     });
     var html = Mustache.render(this.template, {
@@ -86,24 +113,12 @@ var SearchView = Backbone.View.extend({
 });
 
 // --------------------------------------------------------
-// Stuff specific to this demo
+// Stuff very specific to this demo
 
-function getTemplate() {
-  template = ' \
-    {{#records}} \
-      <div class="record"> \
-        <h3> \
-          {{title}} <em>by {{Author}}</em> \
-        </h3> \
-        <p>{{description}}</p> \
-        <p><code>${{price}}</code></p> \
-      </div> \
-    {{/records}} \
-  ';
-  return template;
-}
+function setupMoreComplexExample(config) {
+};
 
-var simpleData = [
+var sampleData = [
   {
     title: 'War and Peace',
     description: 'The epic tale of love, war and history',