StackOverflow2013

Note that there are some explanatory texts on larger screens.

plurals

PO
text
Body
copied!<p>It is not easy to use to use Facebook SDK with Durandal.</p> <p>Facebook offers <a href="https://developers.facebook.com/docs/howto/javascript/requirejs/" rel="nofollow">instructions</a> how to set it up with require. But sounds like that method is not <a href="https://groups.google.com/forum/#!msg/durandaljs/a4GVyHKzfDk/lS-Ea9_VMlwJ" rel="nofollow">supported in Durandal</a>.</p> <p>I made my dirty version by wrapping global FB object with vm supporting knockout. You could easily use that and bind to any properties like users name.</p> <p>Include that facebook.js from shell.js to make sure it is loaded when app starts.</p> <p>Here is my facebook.js:</p> <pre><code>define(['services/logger'], function (logger) { var vm = { facebook: null, initialized: ko.observable(false), name: ko.observable(""), picturesrc: ko.observable(""), login: login, logout: logout }; $.ajaxSetup({ cache: true }); $.getScript('//connect.facebook.net/en_UK/all.js', function () { window.fbAsyncInit = function () { vm.facebook = FB; vm.facebook.init({ appId: '160000000000499', status: true, cookie: true, xfbml: true, oauth: true }); vm.initialized(true); vm.facebook.getLoginStatus(updateLoginStatus); vm.facebook.Event.subscribe('auth.statusChange', updateLoginStatus); }; }); return vm; function login() { vm.facebook.login( function(response) { //Handled in auth.statusChange } , { scope: 'email' }); } function logout() { vm.facebook.logout( function (response) { vm.picturesrc(""); vm.name(""); }); } function updateLoginStatus(response) { if (response.authResponse) { logger.log("Authenticated to Facebook succesfully"); vm.facebook.api('/me', function (response2) { vm.picturesrc('src="https://graph.facebook.com/' + +response2.id + '/picture"'); vm.name(response2.name); }); } else { logger.log("Not authenticated to Facebook"); vm.picturesrc(""); vm.name(""); } } }); </code></pre> <p>I have not tested my code properly. But atleast logging in and fetching name worked fine in Chrome.</p> <p>Remember change appId and update proper domain at developers.facebook.com.</p>

Querying!

Guidance

An individual column

Larger individual text columns get their own page to allow for proper reading.

SQuiL has stopped working due to an internal error.

If you are curious you may find further information in the browser console, which is accessible through the devtools (F12).

Reload