<commit_before>= Facebook Social plugins

The Facebook Social plugins for Rails 3 consist of:

* ViewHelper
* ScriptHelper

The `ViewHelper` contains methods for inserting the HTML5 <div> elements for Facebook social plugins

The `ScriptHelper` contains methods for inserting <script> snippets for Facebook integration, such as displaying the Social plugins with the Facebook layout/styling applied etc.

== Script Helpers

* async_init_script(app_id, domain, options = {})
* facebook_script(locale = :en)

The async_init_script requires the Facebook app_id, fx '753632322' and the domain name of the app, fx 'www.example.com'. You can also specify the channel file (will default to channel file in vendor/assets of this gem)

=== Channel File

The channel file addresses some issues with cross domain communication in certain browsers. The contents of the channel.html file can be just a single line:

<script src="//connect.facebook.net/en_US/all.js"></script>

=== JavaScript SDK

The JavaScript SDK provides a rich set of client-side functionality for accessing Facebook's server-side API calls. These include all of the features of the REST API, Graph API, and Dialogs. Further, it provides a mechanism for rendering of the XFBML versions of our Social Plugins, and a way for Canvas pages to communicate with Facebook.

You will need an app ID to initialize the SDK, which you can obtain from the Developer App.

For example usage, check out Facebook for Websites and the Authentication guide. We also have a JavaScript Test Console which allows you to test and debug common JavaScript SDK methods.

The JavaScript SDK supports OAuth 2.0.

*Loading*

The following code will load and initialize the JavaScript SDK with all common options. Replace YOUR_APP_ID and WWW.YOUR_DOMAIN.COM with the appropriate values. The best place to put this code is right after the opening <body> tag.

<div id="fb-root"></div>
<script>
  window.fbAsyncInit = function() {
    FB.init({
      appId      : 'YOUR_APP_ID', // App ID
      channelUrl : '//WWW.YOUR_DOMAIN.COM/channel.html', // Channel File
      status     : true, // check login status
      cookie     : true, // enable cookies to allow the server to access the session
      xfbml      : true  // parse XFBML
    });

    // Additional initialization code here
  };

  // Load the SDK Asynchronously
  (function(d){
     var js, id = 'facebook-jssdk', ref = d.getElementsByTagName('script')[0];
     if (d.getElementById(id)) {return;}
     js = d.createElement('script'); js.id = id; js.async = true;
     js.src = "//connect.facebook.net/en_US/all.js";
     ref.parentNode.insertBefore(js, ref);
   }(document));
</script>
This code loads the SDK asynchronously so it does not block loading other elements of your page. 

*Localization*

The JavaScript SDK is available in all locales that are supported by Facebook. This list of supported locales is available as an XML file. To change the locale of the SDK to match the locale of your site, change en_US to a supported locale code when loading the SDK. For example, if your site is in Spanish, using the following code to load the SDK will cause all Social Plugins to be rendered in Spanish.

<script>
  (function(d){
     var js, id = 'facebook-jssdk'; if (d.getElementById(id)) {return;}
     js = d.createElement('script'); js.id = id; js.async = true;
     js.src = "//connect.facebook.net/es_LA/all.js";
     d.getElementsByTagName('head')[0].appendChild(js);
   }(document));
</script>

== Social plugins

Currently the following Social plugins are included in this gem

* Activity Feed
* Comments
* Facepile
* Like Box
* Like Button
* Live Stream
* Login Button
* Recommendations Box
* Registration
* Send Button
* Subscribe Button

View methods exposed:

* fb_root
* fb_activity (options = {})
* fb_add_to_timeline (options = {})
* fb_comments (options = {})
* fb_facepile (options = {})
* fb_like_box (options = {})
* fb_like_button (options = {})
* fb_live_stream (options = {})
* fb_login_button (options = {})
* fb_recommendations_box (options = {})
* fb_registration (options = {})
* fb_send_button (options = {})
* fb_subscribe_button (options = {})

Note: You don't have to worry about dashed or underscored properties. Conversions will be handled automatically. The Facebook Social plugins API is (sadly) not very consistent when it comes to attribute names. 

=== Activity feed

<div class="fb-activity" data-width="300" data-height="300" data-header="true" data-recommendations="false"></div>

* site - the domain for which to show activity; include just the full domain name, without http:// or a path. The XFBML version defaults to the current domain.
* action - a comma separated list of actions to show activities for.
* app_id - will display all actions, custom and global, associated with this app_id.
* width - the width of the plugin in pixels. Default width: 300px.
* height - the height of the plugin in pixels. Default height: 300px.
* header - specifies whether to show the Facebook header.
* colorscheme - the color scheme for the plugin. Options: 'light', 'dark'
* font - the font to display in the plugin. Options: 'arial', 'lucida grande', 'segoe ui', 'tahoma', 'trebuchet ms', 'verdana'
* border_color - the border color of the plugin.
* recommendations - specifies whether to always show recommendations in the plugin. 
* linktarget - This specifies the context in which content links are opened. 
* ref - a label for tracking referrals; must be less than 50 characters 
* max_age - a limit on recommendation and creation time of articles that are surfaced in the plugins, the default is 0 (days)

=== Comments

<div class="fb-comments" data-href="http://example.com" data-num-posts="2" data-width="470"></div>

href - the URL for this Comments plugin. News feed stories on Facebook will link to this URL.
width - the width of the plugin in pixels. Minimum recommended width: 400px.
colorscheme - the color scheme for the plugin. Options: 'light', 'dark'
num_posts - the number of comments to show by default. Default: 10. Minimum: 1
mobile - whether to show the mobile-optimized version. Default: auto-detect.

=== Like box

<div class="fb-like" data-send="true" data-width="450" data-show-faces="true"></div><commit_msg>add fb root element to doc<commit_after>= Facebook Social plugins

The Facebook Social plugins for Rails 3 consist of:

* ViewHelper
* ScriptHelper

The `ViewHelper` contains methods for inserting the HTML5 <div> elements for Facebook social plugins

The `ScriptHelper` contains methods for inserting <script> snippets for Facebook integration, such as displaying the Social plugins with the Facebook layout/styling applied etc.

== Script Helpers

* async_init_script(app_id, domain, options = {})
* facebook_script(locale = :en)

The async_init_script requires the Facebook app_id, fx '753632322' and the domain name of the app, fx 'www.example.com'. You can also specify the channel file (will default to channel file in vendor/assets of this gem)

=== Channel File

The channel file addresses some issues with cross domain communication in certain browsers. The contents of the channel.html file can be just a single line:

<script src="//connect.facebook.net/en_US/all.js"></script>

=== JavaScript SDK

The JavaScript SDK provides a rich set of client-side functionality for accessing Facebook's server-side API calls. These include all of the features of the REST API, Graph API, and Dialogs. Further, it provides a mechanism for rendering of the XFBML versions of our Social Plugins, and a way for Canvas pages to communicate with Facebook.

You will need an app ID to initialize the SDK, which you can obtain from the Developer App.

For example usage, check out Facebook for Websites and the Authentication guide. We also have a JavaScript Test Console which allows you to test and debug common JavaScript SDK methods.

The JavaScript SDK supports OAuth 2.0.

*Loading*

The following code will load and initialize the JavaScript SDK with all common options. Replace YOUR_APP_ID and WWW.YOUR_DOMAIN.COM with the appropriate values. The best place to put this code is right after the opening <body> tag.

<script>
  window.fbAsyncInit = function() {
    FB.init({
      appId      : 'YOUR_APP_ID', // App ID
      channelUrl : '//WWW.YOUR_DOMAIN.COM/channel.html', // Channel File
      status     : true, // check login status
      cookie     : true, // enable cookies to allow the server to access the session
      xfbml      : true  // parse XFBML
    });

    // Additional initialization code here
  };

  // Load the SDK Asynchronously
  (function(d){
     var js, id = 'facebook-jssdk', ref = d.getElementsByTagName('script')[0];
     if (d.getElementById(id)) {return;}
     js = d.createElement('script'); js.id = id; js.async = true;
     js.src = "//connect.facebook.net/en_US/all.js";
     ref.parentNode.insertBefore(js, ref);
   }(document));
</script>
This code loads the SDK asynchronously so it does not block loading other elements of your page. 

*Localization*

The JavaScript SDK is available in all locales that are supported by Facebook. This list of supported locales is available as an XML file. To change the locale of the SDK to match the locale of your site, change en_US to a supported locale code when loading the SDK. For example, if your site is in Spanish, using the following code to load the SDK will cause all Social Plugins to be rendered in Spanish.

<script>
  (function(d){
     var js, id = 'facebook-jssdk'; if (d.getElementById(id)) {return;}
     js = d.createElement('script'); js.id = id; js.async = true;
     js.src = "//connect.facebook.net/es_LA/all.js";
     d.getElementsByTagName('head')[0].appendChild(js);
   }(document));
</script>

== Social plugins

Currently the following Social plugins are included in this gem

* Root
* Activity Feed
* Comments
* Facepile
* Like Box
* Like Button
* Live Stream
* Login Button
* Recommendations Box
* Registration
* Send Button
* Subscribe Button

View methods exposed:

* fb_root
* fb_activity (options = {})
* fb_add_to_timeline (options = {})
* fb_comments (options = {})
* fb_facepile (options = {})
* fb_like_box (options = {})
* fb_like_button (options = {})
* fb_live_stream (options = {})
* fb_login_button (options = {})
* fb_recommendations_box (options = {})
* fb_registration (options = {})
* fb_send_button (options = {})
* fb_subscribe_button (options = {})

Note: You don't have to worry about dashed or underscored properties. Conversions will be handled automatically. The Facebook Social plugins API is (sadly) not very consistent when it comes to attribute names. 

=== Facebook root

<div id="fb-root"></div>

A Facebook placeholder div

=== Activity feed

<div class="fb-activity" data-width="300" data-height="300" data-header="true" data-recommendations="false"></div>

* site - the domain for which to show activity; include just the full domain name, without http:// or a path. The XFBML version defaults to the current domain.
* action - a comma separated list of actions to show activities for.
* app_id - will display all actions, custom and global, associated with this app_id.
* width - the width of the plugin in pixels. Default width: 300px.
* height - the height of the plugin in pixels. Default height: 300px.
* header - specifies whether to show the Facebook header.
* colorscheme - the color scheme for the plugin. Options: 'light', 'dark'
* font - the font to display in the plugin. Options: 'arial', 'lucida grande', 'segoe ui', 'tahoma', 'trebuchet ms', 'verdana'
* border_color - the border color of the plugin.
* recommendations - specifies whether to always show recommendations in the plugin. 
* linktarget - This specifies the context in which content links are opened. 
* ref - a label for tracking referrals; must be less than 50 characters 
* max_age - a limit on recommendation and creation time of articles that are surfaced in the plugins, the default is 0 (days)

=== Comments

<div class="fb-comments" data-href="http://example.com" data-num-posts="2" data-width="470"></div>

href - the URL for this Comments plugin. News feed stories on Facebook will link to this URL.
width - the width of the plugin in pixels. Minimum recommended width: 400px.
colorscheme - the color scheme for the plugin. Options: 'light', 'dark'
num_posts - the number of comments to show by default. Default: 10. Minimum: 1
mobile - whether to show the mobile-optimized version. Default: auto-detect.

=== Like box

<div class="fb-like" data-send="true" data-width="450" data-show-faces="true"></div>
{'fraction_non_alphanumeric': 0.0909668201301794, 'fraction_numerical': 0.006826480393713288, 'mean_word_length': 4.063906752411576, 'pattern_counts': {'":': 0, '<': 37, '<?xml version=': 0, '>': 37, 'https://': 0, 'lorem ipsum': 0, 'www.': 2, 'xml': 0}, 'pii_count': 0, 'substrings_counts': 0, 'word_list_counts': {'cursed_substrings.json': 30, 'profanity_word_list.json': 0, 'sexual_word_list.json': 0, 'zh_pornsignals.json': 0}}
{'dir': 'git-commits-cleaned', 'id': '1938991', 'n_tokens_mistral': 3589, 'n_tokens_neox': 3425, 'n_words': 1591}