Got server-side Backbone-->jQuery-->XHR working.

jaxzin · Mar 28, 2012 · 09216e4 · 09216e4
1 parent 1f3f3ec
commit 09216e4
Show file tree

Hide file tree

Showing 4 changed files with 28 additions and 10 deletions.
diff --git a/models/collections.js b/models/collections.js
@@ -4,8 +4,16 @@ if (typeof exports !== 'undefined') {
 
     _ = require('underscore')._;
     jQuery = require('jquery');
+    XMLHttpRequest = require("xmlhttprequest").XMLHttpRequest;
+    jQuery.support.cors = true;
+    jQuery.ajaxSettings.xhr = function () {
+        return new XMLHttpRequest;
+    };
     Backbone = require('backbone');
     Backbone.setDomLibrary(jQuery);
+//    Backbone.sync = function(method, model) {
+//        console.log(method + ": " + model.url);
+//    };
 }
 
 Collections.DelayedCollection = Backbone.Collection.extend({
@@ -29,18 +37,20 @@ Collections.DelayedCollection = Backbone.Collection.extend({
 
 Collections.Headlines = Backbone.Collection.extend({
     parse: function (response) {
+        console.log("Parsing headlines response.");
         return response.headlines;
     },
 
     // realistically, this fetch call would go out to some external endpoint (database, cache, service, etc)
     // for this demo, it just uses setTimeout to simulate an asynchronous request that takes some amount of time
-    fetch: function() {
-        var self = this;
-        this.each(function(model) {
-            console.log("Fetching headline:" + headline);
-            self.updateModel(model);
-        });
-    },
+//    fetch: function() {
+//        console.log("Fetching headlines:" + this.url);
+//        var self = this;
+//        this.each(function(model) {
+//            console.log("Fetching headline:" + headline);
+//            self.updateModel(model);
+//        });
+//    },
 
     updateModel: function(model) {
         // TODO: call API here

diff --git a/package.json b/package.json
@@ -8,6 +8,7 @@
         "underscore": "1.3.1",
         "watch-tree-maintained": "*",
         "now": "0.8.1",
-        "jquery": "1.6.3"
+        "jquery": "1.6.3",
+        "xmlhttprequest": "1.3.0"
     }
 }
diff --git a/public/javascripts/headlines.js b/public/javascripts/headlines.js
@@ -1,5 +1,5 @@
 now.ready(function() {
-    now.getModelsToRender($.cookie('collection.id'), render);
+    now.getModelsToRender(0, render);
 });
 
 function render(model) {

diff --git a/web.js b/web.js
@@ -35,6 +35,13 @@ app.get('/headlines', function(req, res, next) {
     collection.model = Models.HeadlineModel;
     collection.url = 'http://api.espn.com/v1/sports/news/headlines/top?apiKey=' + process.env.espn_api_key;
 //    console.log('Fetching headlines: ' + collection.url);
-    collection.fetch();
+    collection.fetch({
+        success: function(collection, response) {
+            console.log("Success!!");
+        },
+        error: function(collection, response) {
+            console.log("Error!!"+ response.statusText);
+        }
+    });
     headlines.render(req, res, collection, 'headlines');
 });