Initial commit

Author: reed

.gitignore

@@ -0,0 +1,6 @@
+output
+tmp
+.DS_Store
+.bundle
+bin
+*.log

Gemfile

@@ -0,0 +1,14 @@
+source "http://rubygems.org"
+
+
+gem 'redcarpet'
+gem 'nanoc'
+gem 'nokogiri'
+gem 'pygments.rb'
+#gem 'rake', '~> 0.9.2'
+#gem 'thin'
+
+group :development do
+  gem 'adsf'
+  gem 'fssm'
+end

Gemfile.lock

@@ -0,0 +1,30 @@
+GEM
+  remote: http://rubygems.org/
+  specs:
+    adsf (1.1.1)
+      rack (>= 1.0.0)
+    colored (1.2)
+    cri (2.3.0)
+      colored (>= 1.2)
+    fssm (0.2.10)
+    nanoc (3.4.3)
+      cri (~> 2.2)
+    nokogiri (1.5.6)
+    posix-spawn (0.3.6)
+    pygments.rb (0.3.7)
+      posix-spawn (~> 0.3.6)
+      yajl-ruby (~> 1.1.0)
+    rack (1.5.0)
+    redcarpet (2.2.2)
+    yajl-ruby (1.1.0)
+
+PLATFORMS
+  ruby
+
+DEPENDENCIES
+  adsf
+  fssm
+  nanoc
+  nokogiri
+  pygments.rb
+  redcarpet

README.md

@@ -0,0 +1 @@
+# Turbolinks Compatibility

Rules

@@ -0,0 +1,56 @@
+#!/usr/bin/env ruby
+
+# A few helpful tips about the Rules file:
+#
+# * The string given to #compile and #route are matching patterns for
+#   identifiers--not for paths. Therefore, you can’t match on extension.
+#
+# * The order of rules is important: for each item, only the first matching
+#   rule is applied.
+#
+# * Item identifiers start and end with a slash (e.g. “/about/” for the file
+#   “content/about.html”). To select all children, grandchildren, … of an
+#   item, use the pattern “/about/*/”; “/about/*” will also select the parent,
+#   because “*” matches zero or more characters.
+
+# compile '/stylesheet/' do
+#   # don’t filter or layout
+# end
+# 
+# compile '/github/' do
+#   # don’t filter or layout
+# end
+
+compile '/static/*' do
+end
+
+compile '*' do
+  if item.binary?
+    # don’t filter binary items
+  else
+    filter :erb
+    filter :redcarpet, renderer: HTMLwithLanguage, options: { fenced_code_blocks: true }
+    filter :colorize_syntax, default_colorizer: :pygmentsrb
+    layout 'default'
+  end
+end
+
+# route '/stylesheet/' do
+#   '/style.css'
+# end
+
+route '/static/*' do
+  item.identifier[7..-2]
+end
+
+route '*' do
+  if item.binary?
+    # Write item with identifier /foo/ to /foo.ext
+    item.identifier.chop + '.' + item[:extension]
+  else
+    # Write item with identifier /foo/ to /foo/index.html
+    item.identifier + 'index.html'
+  end
+end
+
+layout '*', :erb

config.yaml

@@ -0,0 +1,81 @@
+# A list of file extensions that nanoc will consider to be textual rather than
+# binary. If an item with an extension not in this list is found,  the file
+# will be considered as binary.
+text_extensions: [ 'coffee', 'css', 'erb', 'haml', 'handlebars', 'hb', 'htm', 'html', 'js', 'less', 'markdown', 'md', 'ms', 'mustache', 'php', 'rb', 'sass', 'scss', 'txt', 'xhtml', 'xml' ]
+
+# The path to the directory where all generated files will be written to. This
+# can be an absolute path starting with a slash, but it can also be path
+# relative to the site directory.
+output_dir: output
+
+# A list of index filenames, i.e. names of files that will be served by a web
+# server when a directory is requested. Usually, index files are named
+# “index.html”, but depending on the web server, this may be something else,
+# such as “default.htm”. This list is used by nanoc to generate pretty URLs.
+index_filenames: [ 'index.html' ]
+
+# Whether or not to generate a diff of the compiled content when compiling a
+# site. The diff will contain the differences between the compiled content
+# before and after the last site compilation.
+enable_output_diff: false
+
+prune:
+  # Whether to automatically remove files not managed by nanoc from the output
+  # directory. For safety reasons, this is turned off by default.
+  auto_prune: false
+
+  # Which files and directories you want to exclude from pruning. If you version
+  # your output directory, you should probably exclude VCS directories such as
+  # .git, .svn etc.
+  exclude: [ '.git', '.hg', '.svn', 'CVS' ]
+
+# The data sources where nanoc loads its data from. This is an array of
+# hashes; each array element represents a single data source. By default,
+# there is only a single data source that reads data from the “content/” and
+# “layout/” directories in the site directory.
+data_sources:
+  -
+    # The type is the identifier of the data source. By default, this will be
+    # `filesystem_unified`.
+    type: filesystem_unified
+
+    # The path where items should be mounted (comparable to mount points in
+    # Unix-like systems). This is “/” by default, meaning that items will have
+    # “/” prefixed to their identifiers. If the items root were “/en/”
+    # instead, an item at content/about.html would have an identifier of
+    # “/en/about/” instead of just “/about/”.
+    items_root: /
+
+    # The path where layouts should be mounted. The layouts root behaves the
+    # same as the items root, but applies to layouts rather than items.
+    layouts_root: /
+
+    # Whether to allow periods in identifiers. When turned off, everything
+    # past the first period is considered to be the extension, and when
+    # turned on, only the characters past the last period are considered to
+    # be the extension. For example,  a file named “content/about.html.erb”
+    # will have the identifier “/about/” when turned off, but when turned on
+    # it will become “/about.html/” instead.
+    allow_periods_in_identifiers: false
+
+  -
+    type: static
+    items_root: /static
+
+# Configuration for the “watch” command, which watches a site for changes and
+# recompiles if necessary.
+watcher:
+  # A list of directories to watch for changes. When editing this, make sure
+  # that the “output/” and “tmp/” directories are _not_ included in this list,
+  # because recompiling the site will cause these directories to change, which
+  # will cause the site to be recompiled, which will cause these directories
+  # to change, which will cause the site to be recompiled again, and so on.
+  dirs_to_watch: [ 'content', 'layouts', 'lib' ]
+
+  # A list of single files to watch for changes. As mentioned above, don’t put
+  # any files from the “output/” or “tmp/” directories in here.
+  files_to_watch: [ 'config.yaml', 'Rules' ]
+
+  # When to send notifications (using Growl or notify-send).
+  notify_on_compilation_success: true
+  notify_on_compilation_failure: true

content/facebook.md

@@ -0,0 +1,66 @@
+---
+title: Facebook
+---
+
+## Facebook Social Plugins
+
+[developers.facebook.com/docs/plugins](http://developers.facebook.com/docs/plugins)
+
+**Official Implementation**
+
+```html
+<body>
+  <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/en_US/all.js#xfbml=1";
+      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>
+```
+
+**Solution**
+
+Remove the script from the body and load the following script inside the `<head>`.
+
+```coffeescript
+fb_root = null
+
+$ ->
+  load_facebook_sdk()
+  $(document)
+    .on('page:fetch', saveFacebookRoot)
+    .on('page:change', restoreFacebookRoot)
+    .on('page:load', ->
+      FB?.XFBML.parse()
+
+saveFacebookRoot = ->
+  fb_root = $('#fb-root').detach()
+  
+restoreFacebookRoot = ->
+  if $('#fb-root').length > 0
+    $('#fb-root').replaceWith fb_root
+  else
+    $('body').append fb_root
+  
+loadFacebookSDK = ->
+  window.fbAsyncInit = initializeFacebookSDK
+  $.getScript("//connect.facebook.net/en_US/all.js#xfbml=1")
+
+initializeFacebookSDK = ->
+  FB.init
+    appId     : 'YOUR_APP_ID'
+    channelUrl: '//WWW.YOUR_DOMAIN.COM/channel.html'
+    status    : true
+    cookie    : true
+    xfbml     : true
+```
+
+*Credit:* [Pierre Olivier Martel](https://github.com/pomartel) *(partial)*

content/fancybox.md

@@ -0,0 +1,16 @@
+---
+title: FancyBox
+---
+
+## FancyBox
+
+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:
+
+```coffeescript
+$(document).bind 'page:change', ->
+  $.fancybox.init()
+```
+
+*Credit:* [Rose](https://github.com/R-osey), [Juan de Dios Herrero](https://github.com/jd-erreape)

content/google_analytics.md

@@ -0,0 +1,17 @@
+---
+title: "Google Analytics"
+---
+
+## Google Analytics
+
+Move the javascript snippet from the head to the body and load the following script inside the `<head>`.
+
+```coffeescript
+$(document).on 'page:change', ->
+  if window._gaq?
+    _gaq.push ['_trackPageview']
+  else if window.pageTracker?
+    pageTracker._trackPageview()
+```
+
+*Credit:* [Shuky Dvir](https://github.com/shukydvir)

content/index.md

@@ -0,0 +1,8 @@
+---
+title: Home
+---
+
+## Plugins
+
+[facebook](/facebook)
+[map-generator](/map_generator)

content/map_generator.md

@@ -0,0 +1,60 @@
+---
+title: Map-Generator
+---
+
+## Map-Generator
+
+[map-generator.net](http://map-generator.net)
+
+After customizing the map you want, you will be given a generated code snippet that looks something like this:
+
+```html
+<div id="map_canvas_custom_48259" style="width:830px; height:350px" ></div>
+<script type="text/javascript">
+  // Line breaks inserted for readability.
+  (function(d, t) {
+    var g = d.createElement(t), s = d.getElementsByTagName(t)[0];
+    g.src = "http://map-generator.net/en/maps/48259.js?point=New+York%2C+NY%2C+USA";
+    s.parentNode.insertBefore(g, s);
+  }(document, "script"));
+</script>
+<a class="mapgen-link" style="font:8px Arial;text-decoration:none;color:#5C5C5C;text-align: right; display: block; width: 830px;" href="http://map-generator.net/en">map-generator.net</a>
+```
+
+**Basic Solution**
+
+If you only have one map on a single page of your application, you can get away with just adding the following to your application JS:
+
+```coffeescript
+$(document).bind 'page:load', ->
+  initializeMgMaps() if $('#mggapiloader')?
+```
+
+**Advanced Solution**
+
+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. 
+
+    ```html
+    <script class="init_map_generator" type="text/javascript">
+    ```
+
+2.  In your application JS, create a function to unload/remove Google Maps and bind it to both the `page:fetch` and `page:restore` events.
+
+    ```coffeescript
+    $(document).bind 'page:fetch', ->
+      cleanMapGenerator()
+
+    $(document).bind 'page:restore', ->
+      cleanMapGenerator true
+  
+    cleanMapGenerator = (init) ->
+      window.mapObjWrapper = undefined
+      window.google.maps = undefined
+      $('#mggapiloader').remove()
+      $('[src*="google-analytics.com/ga.js"]').remove()
+      $('[src*="map-generator.net"]').remove()
+      $('[src*="maps.gstatic.com"]').remove()
+      window.eval initMapGenerator.text() if init and (initMapGenerator = $('script.init_map_generator'))?
+    ```

content/olark.md

@@ -0,0 +1,52 @@
+---
+title: Olark
+---
+
+## Olark chat widget 
+
+[olark.com](http://olark.com)
+
+The supplied javascript will look something like this:
+
+```html
+<script>
+  window.olark || (function(c){
+    // initialization code
+  })({ 
+    loader: "static.olark.com/jsclient/loader0.js", 
+    name: "olark", 
+    methods: ["configure", "extend", "declare", "identify"]
+  });
+  olark.identify('<your identity string>');
+</script>
+```
+
+To get it working with Turbolinks:
+
+1. Move the script inside the head tags.
+2. Convert the anonymous initialization function into a named function.
+3. Bind this new function to the `page:load` event.
+
+An example solution, in jQuery:
+
+```javascript
+function initOlark(){
+  c = {
+    loader: "static.olark.com/jsclient/loader0.js", 
+    name: "olark", 
+    methods: ["configure", "extend", "declare", "identify"]
+  };
+  //initialization code
+}
+
+window.olark || initOlark();
+
+$(document).bind('page:load', function(){
+  initOlark();
+  olark.identify('<your identity string>');
+});
+```
+
+For a more detailed explanation, check out [empact.posterous.com/running-olark-under-turbolinks](http://empact.posterous.com/running-olark-under-turbolinks).
+
+*Credit:* [Ben Woosley](https://github.com/Empact)

content/stripe.md

@@ -0,0 +1,9 @@
+---
+title: Stripe
+---
+
+## Stripe Checkout
+
+https://stripe.com/docs/checkout
+
+As of version 2 of the Stripe API, the official implementation is Turbolinks-ready.  

content/twitter.md

@@ -0,0 +1,37 @@
+---
+title: Twitter
+---
+
+# Twitter Buttons
+
+[twitter.com/about/resources/buttons](https://twitter.com/about/resources/buttons)
+
+Fix: Replace the supplied javascript snippet with an external script tag pointing to platform.twitter.com/widgets.js.  
+
+**Before:**
+
+```html
+<body>
+  <a href="https://twitter.com/share" class="twitter-share-button" data-via="njreed86" data-size="large">Tweet</a>
+  <script>
+  !function(d,s,id){
+    var js, fjs = d.getElementsByTagName(s)[0];
+    if (!d.getElementById(id)){
+      js = d.createElement(s);
+      js.id = id;
+      js.src = "//platform.twitter.com/widgets.js";
+      fjs.parentNode.insertBefore(js,fjs);
+    }
+  }(document,"script","twitter-wjs");
+  </script>
+</body>
+```
+
+**After:**
+
+```html
+<body>
+  <a href="https://twitter.com/share" class="twitter-share-button" data-via="njreed86" data-size="large">Tweet</a>
+  <script src="//platform.twitter.com/widgets.js"></script>
+</body>
+```

layouts/default.html

@@ -0,0 +1,34 @@
+<!DOCTYPE HTML>
+<html lang="en">
+  <head>
+    <meta charset="utf-8">
+    <title>Turbolinks Compatibility - <%= @item[:title] %></title>
+    <link rel="stylesheet" type="text/css" href="/css/style.css" media="screen">
+    <link rel="stylesheet" type="text/css" href="/css/bootstrap.css" media="screen">
+    <link rel="stylesheet" type="text/css" href="/css/github.css" media="screen">
+    <meta name="viewport" content="width=device-width, initial-scale=1.0">
+    <!-- you don't need to keep this, but it's cool for stats! -->
+    <meta name="generator" content="nanoc <%= Nanoc::VERSION %>"> 
+  </head>
+  <body>
+    <div class="container-fluid">
+      <div class="page-header">
+      <h1>Turbolinks <small>Compatibility</small></h1>
+    </div>
+      <div class="row-fluid">
+        <div id="sidebar" class="span2">
+          <ul class="nav nav-pills nav-stacked">
+            <% @items.each do |item| %>
+              <% if item[:title] %>
+              <li <%= 'class="active"' if item == @item %>><a href="<%= item.path %>"><%= item[:title] %></a></li>
+              <% end %>
+            <% end %>
+          </ul>
+        </div>
+        <div id="main" class="span10 markdown-body">
+          <%= yield %>
+        </div>
+      </div>
+    </div>
+  </body>
+</html>

lib/default.rb

@@ -0,0 +1,11 @@
+# All files in the 'lib' directory will be loaded
+# before nanoc starts compiling.
+
+require 'redcarpet'
+require 'cgi'
+
+class HTMLwithLanguage < Redcarpet::Render::HTML
+  def block_code(code, language)
+    "<pre><code class=\"language-#{language}\">#{CGI::escapeHTML(code)}</code></pre>"
+  end
+end

lib/github_filter.rb

@@ -0,0 +1,36 @@
+class Github < Nanoc::Filter
+  identifier :github
+
+  def run(content, params={})
+    gfm(content)
+  end
+  
+  def gfm(content)
+    text = content
+    
+    # Extract pre blocks
+    extractions = {}
+    text = text.gsub(%r{<pre>.*?</pre>}m) do |match|
+      md5 = Digest::MD5.hexdigest(match)
+      extractions[md5] = match
+      "{gfm-extraction-#{md5}}"
+    end
+ 
+    # prevent foo_bar_baz from ending up with an italic word in the middle
+    text = text.gsub(/(^(?! {4}|\t)\w+_\w+_\w[\w_]*)/) do |x|
+      x.gsub('_', '\_') if x.split('').sort.to_s[0..1] == '__'
+    end
+ 
+    # in very clear cases, let newlines become <br /> tags
+    text = text.gsub(/^[\w\<][^\n]*\n+/) do |x|
+      x =~ /\n{2}/ ? x : (x.strip!; x << "  \n")
+    end
+ 
+    # Insert pre block extractions
+    text = text.gsub(/\{gfm-extraction-([0-9a-f]{32})\}/) do
+      "\n\n" + extractions[$1]
+    end
+ 
+    text
+  end
+end

lib/static.rb

@@ -0,0 +1,55 @@
+require 'digest/sha1'
+
+module Nanoc3::DataSources
+
+  class Static < Nanoc3::DataSource
+
+    identifier :static
+
+    def items
+      # Get prefix
+      prefix = config[:prefix] || 'static'
+
+      # Get all files under prefix dir
+      filenames = Dir[prefix + '/**/*'].select { |f| File.file?(f) }
+
+      # Convert filenames to items
+      filenames.map do |filename|
+        attributes = {
+          :extension => File.extname(filename)[1..-1],
+          :filename  => filename,
+        }
+        identifier = filename[(prefix.length+1)..-1] + '/'
+
+        mtime      = File.mtime(filename)
+        checksum   = checksum_for(filename)
+
+        Nanoc3::Item.new(
+          filename,
+          attributes,
+          identifier,
+          :binary => true, :mtime => mtime, :checksum => checksum
+        )
+      end
+    end
+
+  private
+
+    # Returns a checksum of the given filenames
+    # TODO un-duplicate this somewhere
+    def checksum_for(*filenames)
+      filenames.flatten.map do |filename|
+        digest = Digest::SHA1.new
+        File.open(filename, 'r') do |io|
+          until io.eof
+            data = io.readpartial(2**10)
+            digest.update(data)
+          end
+        end
+        digest.hexdigest
+      end.join('-')
+    end
+
+  end
+
+end

static/css/bootstrap.css

@@ -0,0 +1,109 @@
+body {
+  background: url('/images/bg.gif') repeat center center;
+}
+#sidebar {
+  padding-top: 30px;
+  border-right: 1px solid #ccc;
+}
+
+//* {
+//  margin: 0;
+//  padding: 0;
+//
+//  font-family: Georgia, Palatino, Times, 'Times New Roman', sans-serif;
+//}
+//
+//body {
+//  background: #fff;
+//}
+//
+//a {
+//  text-decoration: none;
+//}
+//
+//a:link,
+//a:visited {
+//  color: #f30;
+//}
+//
+//a:hover {
+//  color: #f90;
+//}
+//
+//#main {
+//  position: absolute;
+//
+//  top: 40px;
+//  left: 280px;
+//
+//  width: 500px;
+//}
+//
+//#main h1 {
+//  font-size: 40px;
+//  font-weight: normal;
+//
+//  line-height: 40px;
+//
+//  letter-spacing: -1px;
+//}
+//
+//#main p {
+//  margin: 20px 0;
+//  
+//  font-size: 15px;
+//  
+//  line-height: 20px;
+//}
+//
+//#main ul, #main ol {
+//  margin: 20px;
+//}
+//
+//#main li {
+//  font-size: 15px;
+//  
+//  line-height: 20px;
+//}
+//
+//#main ul li {
+//  list-style-type: square;
+//}
+//
+//#sidebar {
+//  position: absolute;
+//
+//  top: 40px;
+//  left: 20px;
+//  width: 200px;
+//
+//  padding: 20px 20px 0 0;
+//
+//  border-right: 1px solid #ccc;
+//
+//  text-align: right;
+//}
+//
+//#sidebar h2 {
+//  text-transform: uppercase;
+//
+//  font-size: 13px;
+//
+//  color: #333;
+//
+//  letter-spacing: 1px;
+//
+//  line-height: 20px;
+//}
+//
+//#sidebar ul {
+//  list-style-type: none;
+//
+//  margin: 20px 0;
+//}
+//
+//#sidebar li {
+//  font-size: 14px;
+//
+//  line-height: 20px;
+//}