Add Twitter Web Intents

app/assets/javascripts/twitter.js

@@ -0,0 +1,43 @@
+(function() {
+  if (window.__twitterIntentHandler) return;
+  var intentRegex = /twitter\.com(\:\d{2,4})?\/intent\/(\w+)/,
+      windowOptions = 'scrollbars=yes,resizable=yes,toolbar=no,location=yes',
+      width = 550,
+      height = 420,
+      winHeight = screen.height,
+      winWidth = screen.width;
+
+  function handleIntent(e) {
+    e = e || window.event;
+    var target = e.target || e.srcElement,
+        m, left, top;
+
+    while (target && target.nodeName.toLowerCase() !== 'a') {
+      target = target.parentNode;
+    }
+
+    if (target && target.nodeName.toLowerCase() === 'a' && target.href) {
+      m = target.href.match(intentRegex);
+      if (m) {
+        left = Math.round((winWidth / 2) - (width / 2));
+        top = 0;
+
+        if (winHeight > height) {
+          top = Math.round((winHeight / 2) - (height / 2));
+        }
+
+        window.open(target.href, 'intent', windowOptions + ',width=' + width +
+                                           ',height=' + height + ',left=' + left + ',top=' + top);
+        e.returnValue = false;
+        e.preventDefault && e.preventDefault();
+      }
+    }
+  }
+
+  if (document.addEventListener) {
+    document.addEventListener('click', handleIntent, false);
+  } else if (document.attachEvent) {
+    document.attachEvent('onclick', handleIntent);
+  }
+  window.__twitterIntentHandler = true;
+}());

app/assets/stylesheets/_tweets.css.sass

@@ -8,12 +8,22 @@
       :border 1px solid #c1c5cb
       :border-width 1px 0
       :padding 15px
-      .avatar
-        :width 60px
+      .left
         :float left
-        img
-          :width 48px
-          :height 48px
+        :width 60px
+        .avatar
+          img
+            :width 48px
+            :height 48px
+        ul.actions
+          li
+            :padding 0
+            a
+              :float left
+              img
+                :width 16px
+                :height 16px
+                :vertical-align bottom
       .tweet_content_fix
         :float left
         :width 0

app/views/layouts/_base.html.haml

@@ -3,6 +3,7 @@
   %head
     %title= @title
     = stylesheet_link_tag "application"
+    = javascript_include_tag "twitter"
   %body
     .navbar.navbar-static-top
       .navbar-inner

app/views/shared/_tweet.html.haml

@@ -1,7 +1,13 @@
 .item
   .tweet
-    .avatar
-      = link_to image_tag(item.user.profile_image_url, :alt => item.user.screen_name, :title => item.user.name), :controller => "users", :action => "best", :screen_name => item.user.screen_name
+    .left
+      .avatar
+        = link_to image_tag(item.user.profile_image_url, :alt => item.user.screen_name, :title => item.user.name), :controller => "users", :action => "best", :screen_name => item.user.screen_name
+      %ul.inline.actions
+        %li
+          = link_to image_tag("reply.png", :alt => "reply"), "https://twitter.com/intent/tweet?in_reply_to=#{item.id}"
+          = link_to image_tag("retweet.png", :alt => "retweet"), "https://twitter.com/intent/retweet?tweet_id=#{item.id}"
+          = link_to image_tag("favorite.png", :alt => "favorite"), "https://twitter.com/intent/favorite?tweet_id=#{item.id}"
     .tweet_content_fix
     .tweet_content
       .user