├── sdk.js
├── package.js
├── smart.json
├── LICENSE
├── templates.html
└── README.md


/sdk.js:
--------------------------------------------------------------------------------
1 | (function(d, s, id){
2 |  var js, fjs = d.getElementsByTagName(s)[0];
3 |  if (d.getElementById(id)) {return;}
4 |  js = d.createElement(s); js.id = id;
5 |  js.src = "//connect.facebook.net/en_US/all/debug.js";
6 |  fjs.parentNode.insertBefore(js, fjs);
7 | }(document, 'script', 'facebook-jssdk'));
8 | 


--------------------------------------------------------------------------------
/package.js:
--------------------------------------------------------------------------------
1 | Package.describe({
2 |     summary: "Facebook SDK packaged for Meteor"
3 | });
4 | 
5 | Package.on_use(function(api) {
6 |     api.use(['jquery', 'spacebars', 'ui', 'templating', 'meteor', 'mongo-livedata', 'livedata', 'webapp']);
7 |     api.add_files(['sdk.js', 'templates.html'], 'client');
8 | });
9 | 


--------------------------------------------------------------------------------
/smart.json:
--------------------------------------------------------------------------------
 1 | {
 2 |   "name": "facebook-sdk",
 3 |   "description": "Facebook Javascript SDK packaged for Meteor, with template helpers.",
 4 |   "homepage": "https://github.com/hugesuccess/facebook-sdk",
 5 |   "author": "Victor Venters (www.hugesuccess.meteor.com)",
 6 |   "version": "0.0.44",
 7 |   "git": "https://github.com/hugesuccess/facebook-sdk.git",
 8 |   "packages": {
 9 |   }
10 | }
11 | 


--------------------------------------------------------------------------------
/LICENSE:
--------------------------------------------------------------------------------
 1 | The MIT License (MIT)
 2 | 
 3 | Copyright (c) 2014 Victor
 4 | 
 5 | Permission is hereby granted, free of charge, to any person obtaining a copy of
 6 | this software and associated documentation files (the "Software"), to deal in
 7 | the Software without restriction, including without limitation the rights to
 8 | use, copy, modify, merge, publish, distribute, sublicense, and/or sell copies of
 9 | the Software, and to permit persons to whom the Software is furnished to do so,
10 | subject to the following conditions:
11 | 
12 | The above copyright notice and this permission notice shall be included in all
13 | copies or substantial portions of the Software.
14 | 
15 | THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR
16 | IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY, FITNESS
17 | FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE AUTHORS OR
18 | COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER LIABILITY, WHETHER
19 | IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM, OUT OF OR IN
20 | CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE SOFTWARE.
21 | 


--------------------------------------------------------------------------------
/templates.html:
--------------------------------------------------------------------------------
 1 | <template name="facebookLike">
 2 |      <div class="fb-like" data-send="true" data-width="{{width}}" data-show-faces="{{faces}}" data-action="{{action}}" data-colorscheme={{colorscheme}} data-href="{{href}}" data-kid-directed-site={{kid}} data-layout="{{layout}}" data-ref="{{ref}}" data-share="{{share}}"></div>
 3 | </template>
 4 | 
 5 | <template name="facebookShare">
 6 |     <div class="fb-share-button" data-href="{{href}}" data-type="{{type}}" data-width="{{width}}"></div>
 7 | 
 8 | </template>
 9 | 
10 | <template name="facebookPost">
11 |     <div class="fb-post" data-href="{{href}}" data-width="{{width}}"></div>
12 | </template>
13 | 
14 | <template name="facebookComments">
15 |     <div class="fb-comments" data-href="{{href}}" data-numposts="{{num_posts}}" data-colorscheme="{{colorscheme}}" data-width="{{width}}" data-order-by="{{order_by}}" data-mobile="{{mobile}}"></div>
16 | </template>
17 | 
18 | <template name="facebookSend">
19 |     <div class="fb-send" data-href="{{href}}" data-colorscheme="{{colorscheme}}" data-kid-directed-site="{{kid_directed_site}}" data-ref="{{ref}}"></div>
20 | 
21 | </template>
22 | 
23 | <template name="facebookFollow">
24 |     <div class="fb-follow" data-href="{{href}}" data-colorscheme="{{colorscheme}}" data-layout="{{layout}}" data-show-faces="{{faces}}"></div>
25 | 
26 | </template>
27 | 
28 | <template name="facebookActivity">
29 |     <div class="fb-activity" data-site="{{site}}" data-action="{{action}}" data-colorscheme="{{colorscheme}}" data-header="{{header}}" data-filter="{{filter}}" data-linktarget="{{linktarget}}" data-recommendations="{{recommendations}}" data-ref="{{ref}}" data-width="{{width}}"></div>
30 | </template>
31 | 
32 | <template name="facebookRecommendations">
33 |     <div class="fb-recommendations" data-site="{{site}}" data-action="{{action}}" data-colorscheme="{{colorscheme}}" data-header="{{header}}"  data-add-id="{{add_id}}" data-height="{{height}}" data-linktarget="{{linktarget}}" data-ref="{{ref}}" data-width="{{width}}"></div>
34 | 
35 | </template>
36 | 
37 | 


--------------------------------------------------------------------------------
/README.md:
--------------------------------------------------------------------------------
  1 | ##facebook-sdk
  2 | 
  3 | 
  4 | The Facebook Javascript SDK packaged for Meteor.js. Be sure to review the full [documentation](https://developers.facebook.com/docs/javascript) for a full description of the Facebook SDK and how to use it.
  5 | 
  6 | How to Install
  7 | ------------------
  8 | 
  9 | mrt add facebook-sdk
 10 | 
 11 | How to Initialize
 12 | ------------------
 13 | 
 14 | Be sure to include the FB.init() method somewhere in your client directory to initialize the SDK, replace {your-app-id} with your actual application id.
 15 | 
 16 | ```javascript
 17 | if(Meteor.isClient) {
 18 |   window.fbAsyncInit = function() {
 19 |     FB.init({
 20 |       appId      : '{your-app-id}',
 21 |       status     : true,
 22 |       xfbml      : true
 23 |     });
 24 |   };
 25 | }
 26 | ```
 27 | 
 28 | Usage
 29 | ---------------
 30 | 
 31 | Once you have initialized the SDK, you can use FB methods anywhere in client facing script files. To quickly test if the SDK has been initialized correctly try to trigger a basic feed dialog like so.
 32 | 
 33 | ```javascript
 34 | FB.ui(
 35 |  {
 36 |   method: 'feed'
 37 |  }
 38 | );
 39 | ```
 40 | 
 41 | Along with calling FB methods directly from Javascript, you can also embed [Social Plugins](https://developers.facebook.com/docs/plugins) by using standard HTML5. For example, to add a Like button to your page use the following snippit where {your-url} is replaced with the url you want to like:
 42 | 
 43 | ```html
 44 | <div class="fb-like" data-href="{your-url}" data-layout="standard" data-action="like" data-show-faces="true" data-share="true"></div>'
 45 | ```
 46 | 
 47 | Template Helpers
 48 | ------------------
 49 | 
 50 | While the Social Plugins are great, "ain't nobody got time for all that" copy and pasting. Also included in this package are a set of template helpers for social plugins. Use these helpers to quickly add standard facebook functionality to your application. Add a configuration object which maps to the configurable settings for each individual plugin. For example, if you would like to set the colorscheme attribute to "dark" be sure to pass a configuration object to the helper with the parameter colorscheme set to the string "dark". Be sure to visit the facebook [Social Plugin documentation](https://developers.facebook.com/docs/plugins/) for a full list of settings.
 51 | 
 52 | Example Configuration Object
 53 | ```javascript
 54 | {colorscheme: "dark"}
 55 | ```
 56 | 
 57 | 
 58 | * [Like Button](https://developers.facebook.com/docs/plugins/like-button/)
 59 | 
 60 | {{> facebookLike config}}
 61 |  
 62 | 
 63 | * [Share Button](https://developers.facebook.com/docs/plugins/share-button/)
 64 | 
 65 | {{> facebookShare config}}
 66 | 
 67 | * [Embedded Posts](https://developers.facebook.com/docs/plugins/embedded-posts/)
 68 | 
 69 | {{> facebookPost config}}
 70 | 
 71 | 
 72 | * [Comments](https://developers.facebook.com/docs/plugins/comments/)
 73 | 
 74 | {{> facebookComments config}}
 75 | 
 76 | 
 77 | * [Send button](https://developers.facebook.com/docs/plugins/send-button/)
 78 | 
 79 | {{> facebookSend config}}
 80 | 
 81 | 
 82 | * [Follow button](https://developers.facebook.com/docs/plugins/follow-button/)
 83 | 
 84 | {{> facebookFollow config}}
 85 | 
 86 | 
 87 | * [Activity Feed](https://developers.facebook.com/docs/plugins/activity/)
 88 | 
 89 | {{> facebookActivity config}}
 90 | 
 91 | 
 92 | * [Recommendations Feed](https://developers.facebook.com/docs/plugins/recommendations/)
 93 | 
 94 | {{> facebookRecommendations config}}
 95 | 
 96 | 
 97 | 
 98 | Facebook-SDK with Iron-Router
 99 | -------------
100 | 
101 | If you're not using [Iron-Router](https://github.com/EventedMind/iron-router) in your Meteor project, you probably should. One of the things you'll notice is that with Iron Router when you navigate away from a page with a Social Plugin, then return to that page your social widget will vanish to the abyss. Obviously, this is not good. To insure that your Social Plugins are always displayed (for both HTML5 embed and handlebars helpers) use the following snipit of Javascript (note that this requires jQuery, but you should have it installed already for obvious reasons).
102 | 
103 | ```javascript
104 | Template.<template-name>.rendered = function() {
105 |     try {
106 |         FB.XFBML.parse();
107 |     }catch(e) {}   
108 | };
109 | ```
110 | 
111 | Remember to replace <template-name> with actual name of your template, and to repeat the process for every template that contains a social widget.
112 | 
113 | Customizing Social Plugins
114 | -----------------------------
115 | 
116 | If you would like to use custom parameters for your Social Plugins, in order to change things like the color scheme or dimensions, just use the HTML5 snippets provided by Facebook and style to your hearts content.
117 | 
118 | License
119 | -----------------
120 | 
121 | MIT 
122 | 
123 | 
124 | 
125 | 


--------------------------------------------------------------------------------