Insert data to Meteor from Facebook API

Question

I'm following the example given here on pulling data from FB Graph. So far I've managed to pull data from FB however I can't figure out how to insert it into MongoDB.

Right now the data from Facebook renders as follows:

{"data": [ { "picture": "https://photo.jpg", "id": "1234", "created_time": "2013-01-01T00:00:00+0000" }, { "picture": "https://photo.jpg", "id": "12345", "created_time": "2013-01-01T00:00:00+0000" }] }

I created a collection call Photos and I've tried to insert the data with Photos.inser(data). Here is my server code:

 function Facebook(accessToken) {
    this.fb = Meteor.require('fbgraph');
    this.accessToken = accessToken;
    this.fb.setAccessToken(this.accessToken);
    this.options = {
        timeout: 3000,
        pool: {maxSockets: Infinity},
        headers: {connection: "keep-alive"}
    }
    this.fb.setOptions(this.options);
}

Facebook.prototype.query = function(query, method) {
    var self = this;
    var method = (typeof method === 'undefined') ? 'get' : method;
    var data = Meteor.sync(function(done) {
        self.fb[method](query, function(err, res) {
            done(null, res);
        });
    });
    return data.result;
}

Facebook.prototype.getUserData = function() {
    return this.query('me');
}
Facebook.prototype.getPhotos = function() {
    return this.query('/me/photos?fields=picture');
}

Meteor.methods({
    getUserData: function() {
        var fb = new Facebook(Meteor.user().services.facebook.accessToken);
        var data = fb.getUserData();
        return data;
        _.forEach(data.data, function(photo) {
            Photos.insert(photo, function(err) { 
                if(err) console.error(err); 
            });
        });
    }
});

Here is my collections code:

Photos = new Meteor.Collection('picture');

Right now, nothing is being inserted into MongoDB and I can't figure out why.

Any thoughts on what I'm doing wrong here or if there is a better way to approch this problem? Thanks in advance!

Answer 1

Just figured got it to work. Many thanks to Dave and emgee for your help! Below is the code for those who are having the same issue. Also, please let me know if there is a better way to go about this.

Server code:

function Facebook(accessToken) {
    this.fb = Meteor.require('fbgraph');
    this.accessToken = accessToken;
    this.fb.setAccessToken(this.accessToken);
    this.options = {
        timeout: 3000,
        pool: {maxSockets: Infinity},
        headers: {connection: "keep-alive"}
    }
    this.fb.setOptions(this.options);
}

Facebook.prototype.query = function(query, method) {
    var self = this;
    var method = (typeof method === 'undefined') ? 'get' : method;
    var data = Meteor.sync(function(done) {
        self.fb[method](query, function(err, res) {
            done(null, res);
        });
    });
    return data.result;
}

Facebook.prototype.getUserData = function() {
    return this.query('me/photos');
}

Meteor.methods({
    getUserData: function() {
        var fb = new Facebook(Meteor.user().services.facebook.accessToken);
        var data = fb.getUserData();
        _.forEach(data.data, function(photo) {
            Photos.insert(photo, function(err) { 
                if(err) console.error(err); 
            });
        });
    }
});

Meteor.publish('picture', function() {
  return Photos.find();
});

Collections:

Photos = new Meteor.Collection('picture');

Client:

Meteor.subscribe('picture');

Template.facebookphoto.helpers({
        pictures: function () {
             return Photos.find();
          }     
});

Template.fbgraph.events({
    'click #btn-user-data': function(e) {
        Meteor.call('getUserData', function(err, data) {
             $('#result').text(EJSON.stringify(data, undefined, 4));
         });
    }
});

HTML Templates:

<template name="fbgraph">
    <div id="main" class="row-fluid">
      {{> facebookphoto}}
    </div>

    <button class="btn" id="btn-user-data">Get User Data</button>
    <div class="well">
        <pre id="result"></pre>
    </div>
</template>


<template name="facebookphoto">
  <div class="photos">
    {{#each pictures}}
      {{> photoItem}}
    {{/each}}
  </div>
</template>

<template name="photoItem">
  <div class="photo">
    <div class="photo-content">
      <a href="{{source}}">
       <img class="img-rounded" src="{{picture}}">
      </a>
    </div>
  </div>
</template>