reed · borisrorsvort · Mar 8, 2017 · Mar 14, 2017
diff --git a/Rules b/Rules
@@ -31,7 +31,7 @@ compile '*' do
 end
 
 route '/assets/*' do
-  if item.identifier.include? '/javascripts' 
+  if item.identifier.include? '/javascripts'
     item.identifier[7..-2] + '.js'
   else
     item.identifier[7..-2]

diff --git a/content/libraries/d3.md b/content/libraries/d3.md
@@ -10,6 +10,8 @@ issues:
 
 # D3.js
 
+## Turbolinks-classic
+
 > **[d3js.org](http://d3js.org)**
 
 ### Official Implementation

diff --git a/content/libraries/doubleclick_for_publishers.md b/content/libraries/doubleclick_for_publishers.md
@@ -12,6 +12,8 @@ issues:
 
 > **[google.com/dfp](http://www.google.com/doubleclick/publishers/welcome/)**
 
+## Turbolinks-classic
+
 ### Official Implementation
 
 ```html

diff --git a/content/libraries/facebook.md b/content/libraries/facebook.md
@@ -3,10 +3,10 @@ title: Facebook
 contributors:
   - user:       pomartel
     name:       Pierre Olivier Martel
-    
+
   - user:       reed
     name:       Nick Reed
-    
+
   - user:       rickypai
 
   - user:       manuelmeurer
@@ -22,7 +22,75 @@ issues:
 
 > **[developers.facebook.com/docs/plugins](http://developers.facebook.com/docs/plugins)**
 
-### Official Implementation 
+## Turbolinks
+
+### Official Implementation
+
+```html
+<!-- Include the SDK JavaScript on your page once, ideally right after the opening <body> tag. -->
+
+<script type="text/javascript">
+<div id="fb-root"></div>
+<script>(function(d, s, id) {
+  var js, fjs = d.getElementsByTagName(s)[0];
+  if (d.getElementById(id)) return;
+  js = d.createElement(s); js.id = id;
+  js.src = "//connect.facebook.net/fr_FR/sdk.js#xfbml=1&version=v2.8&appId=247971618578324";
+  fjs.parentNode.insertBefore(js, fjs);
+}(document, 'script', 'facebook-jssdk'));</script>
+
+<!-- Include this where you want to display the widget -->
+<div class="fb-page" data-href="[PAGE_URL]" data-tabs="timeline" data-small-header="false" data-adapt-container-width="true" data-hide-cover="false" data-show-facepile="true">
+  <blockquote cite="[PAGE_URL]" class="fb-xfbml-parse-ignore">
+    <a href="[PAGE_URL]">Page name</a>
+  </blockquote>
+</div>
+```
+
+### Solution
+
+```coffeescript
+bindFacebookEvents = ->
+  $(document)
+    .on('turbolinks:request-start', saveFacebookRoot)
+    .on('turbolinks:render', restoreFacebookRoot)
+    .on('turbolinks:load', ->
+      FB?.XFBML.parse()
+    )
+  window.fbEventsBound = true
+
+saveFacebookRoot = ->
+  if $('#fb-root').length
+    @fbRoot = $('#fb-root').detach()
+
+restoreFacebookRoot = ->
+  if @fbRoot?
+    if $('#fb-root').length
+      $('#fb-root').replaceWith @fbRoot
+    else
+      $('body').append @fbRoot
+
+loadFacebookSDK = ->
+  window.fbAsyncInit = initializeFacebookSDK
+  $.getScript("//connect.facebook.net/en_US/sdk.js")
+
+initializeFacebookSDK = ->
+  FB.init
+    appId  : '[APP_ID]'
+    version: 'v2.7'
+    status : true
+    cookie : true
+    xfbml  : true
+
+loadFacebookSDK()
+bindFacebookEvents() unless window.fbEventsBound
+```
+
+Then you still need to include the markup `fb-page`
+
+## Turbolinks-classic
+
+### Official Implementation
 
 ```html
 <body>
@@ -36,7 +104,7 @@ issues:
       fjs.parentNode.insertBefore(js, fjs);
     }(document, 'script', 'facebook-jssdk'));
   </script>
-  
+
   <!-- Like button -->
   <div class="fb-like" data-send="true" data-layout="button_count" data-width="450" data-show-faces="true"></div>
 </body>

diff --git a/content/libraries/fancybox.md b/content/libraries/fancybox.md
@@ -2,7 +2,7 @@
 title: FancyBox
 contributors:
   - user:     R-osey
-  
+
   - user:     jd-erreape
     name:     Juan de Dios Herrero
 issues:
@@ -14,6 +14,8 @@ issues:
 
 > **[fancybox.net/howto](http://fancybox.net/howto)**
 
+## Turbolinks-classic
+
 FancyBox (>= 2.1.2) is known to work with Turbolinks without modifications.
 
 For version 1.3.4, just add this to your application's javascript:

diff --git a/content/libraries/google_adsense.md b/content/libraries/google_adsense.md
@@ -16,6 +16,8 @@ issues:
 
 #### UPDATE: Google has cancelled AJAX support for AdSense, so this solution no longer works.  Your best course of action is to use [DoubleClick for Publishers](/doubleclick_for_publishers.html).  
 
+## Turbolinks-classic
+
 ### Official Implementation
 
 ```html
@@ -49,29 +51,29 @@ google_ad_height = 250;
             @clearAds()
           $(document).on 'page:load', =>
             @initPage()
-  
+
       initPage: =>
         ad.load() for id, ad of @ads
-    
+
       clearAds: ->
         @ads = {}
         window.google_prev_ad_slotnames_by_region[''] = '' if window.google_prev_ad_slotnames_by_region
         window.google_num_ad_slots = 0
-  
+
       newAd: (container, options) ->
         id = (options.format || 'ad') + '_' + container.id
         @ads[id] = new Ad @, id, container, options
     ```
     ```coffeescript
     class Ad
       constructor: (@adsense, @id, @container, @options) ->
-  
+
       load: ->
         if @ad_object? then @refresh() else @create()
-    
+
       refresh: ->
         @ad_object.refresh()
-  
+
       create: ->
         @ad_object = new google.ads.Ad @adsense.ad_client, @container, @options
     ```

diff --git a/content/libraries/google_analytics.md b/content/libraries/google_analytics.md
@@ -12,6 +12,8 @@ issues:
 
 > **[google.com/analytics](http://www.google.com/analytics/)**
 
+## Turbolinks-classic
+
 Many of the [solutions](https://github.com/shukydvir/google-analytics-turbolinks) [out](http://railsapps.github.io/rails-google-analytics.html) [there](http://stackoverflow.com/questions/18945464/rails-4-turbolinks-with-google-analytics) either only work with Turbolinks and don't gracefully degrade, or track multiple page views on the initial page load. To get around this, you need to take the following approach:
 
 1. Move the Google Analytics script from the `<body>` to the `<head>`. Modify it to not actually track the pageview -- you just want to initialize Google Analytics.

diff --git a/content/libraries/google_plus.md b/content/libraries/google_plus.md
@@ -12,6 +12,8 @@ issues:
 
 > **[developers.google.com/+/web/+1button](https://developers.google.com/+/web/+1button/)**
 
+## Turbolinks-classic
+
 ### Official Implementation
 
 ```html
@@ -22,18 +24,17 @@ issues:
 ### Solution
 
 1.  Move the script tag inside the `<head>` and set the loading mechanism to 'explicit'.
-  
+
     ```html
     <head>
       <script type="text/javascript" src="https://apis.google.com/js/plusone.js" parsetags="explicit"></script>
     </head>
     ```
-    
+
 2.  Add the following lines to your application's javascript:
 
     ```coffeescript
     $ ->
       gapi.plusone.go()
       $(document).on 'page:load', gapi.plusone.go
     ```
-
diff --git a/content/libraries/google_plus_platform_api.md b/content/libraries/google_plus_platform_api.md
@@ -9,7 +9,9 @@ contributors:
 
 > **[developers.google.com/+/web/signin/](https://developers.google.com/+/web/signin/)**
 
-### Official Implementation 
+## Turbolinks-classic
+
+### Official Implementation
 
 Set configuration using [page-level configuration options](https://developers.google.com/+/web/signin/reference#page-config), and include the script in the page head.
 
@@ -48,7 +50,7 @@ restoreGoogleFrame = ->
     $('body').append google_frame
 
 loadGoogleSDK = ->
-  # We load the platform script directly and load the 
+  # We load the platform script directly and load the
   # client library in the callback
   $.getScript('//apis.google.com/js/platform.js', initializeGoogleSDK)
 

diff --git a/content/libraries/google_universal_analytics.md b/content/libraries/google_universal_analytics.md
@@ -16,6 +16,8 @@ issues:
 
 > **[support.google.com/analytics/answer/2790010](https://support.google.com/analytics/answer/2790010?hl=en)**
 
+## Turbolinks-classic
+
 ### Official Implementation
 
 ```html

diff --git a/content/libraries/groove.md b/content/libraries/groove.md
@@ -9,6 +9,8 @@ contributors:
 
 > **[groovehq.com/apps/widget](https://www.groovehq.com/apps/widget)**
 
+## Turbolinks-classic
+
 ### Official Implementation
 After creating and customizing a widget, you will be give an embed code similar to this:
 

diff --git a/content/libraries/linkedin.md b/content/libraries/linkedin.md
@@ -9,6 +9,8 @@ contributors:
 
 > **[linkedin.com/plugins/share-plugin-generator](https://developer.linkedin.com/plugins/share-plugin-generator)**
 
+## Turbolinks-classic
+
 ### Official Implementation
 
 ```html

diff --git a/content/libraries/livechatinc.md b/content/libraries/livechatinc.md
@@ -3,7 +3,7 @@ title: LiveChat
 contributors:
   - user:     maddijoyce
     name:     Maddi Joyce
-    
+
   - user:     reed
     name:     Nick Reed
 issues:
@@ -15,6 +15,8 @@ issues:
 
 > **[livechatinc.com](https://www.livechatinc.com)**
 
+## Turbolinks-classic
+
 ### Official Implementation
 
 ```html

diff --git a/content/libraries/map_generator.md b/content/libraries/map_generator.md
@@ -12,6 +12,8 @@ issues:
 
 > **[map-generator.net](http://map-generator.net)**
 
+## Turbolinks-classic
+
 ### Overview
 
 After customizing the map you want, you will be given a generated code snippet that looks something like this:
@@ -42,7 +44,7 @@ $(document).bind 'page:load', ->
 
 This solution handles multiple maps on the same page or on separate pages of the application.
 
-1.  Add a class to the script tag for each map you have in your application. 
+1.  Add a class to the script tag for each map you have in your application.
 
     ```html
     <script class="init_map_generator" type="text/javascript">
@@ -56,7 +58,7 @@ This solution handles multiple maps on the same page or on separate pages of the
 
     $(document).bind 'page:restore', ->
       cleanMapGenerator true
-  
+
     cleanMapGenerator = (init) ->
       window.mapObjWrapper = undefined
       window.google.maps = undefined

diff --git a/content/libraries/mathjax.md b/content/libraries/mathjax.md
@@ -12,6 +12,8 @@ issues:
 
 > **[mathjax.org](http://mathjax.org)**
 
+## Turbolinks-classic
+
 ### Official Implementation
 
 ```html
-Original file line number
+Diff line change
@@ Expand Up / @@ -10,6 +10,8 @@ issues: @@
     # D3.js
+    ## Turbolinks-classic
     > **[d3js.org](http://d3js.org)**
     ### Official Implementation
@@ Expand Down @@