Remvoing bigfoot.js. It's just not meant for multiple instantiations per-page.

assets.yml

@@ -63,7 +63,6 @@ javascripts:
         - media/js/vendor/bootstrap-transition.js
         - media/js/vendor/highlight.js
         - media/js/vendor/fitvid.js
-        - media/js/vendor/bigfoot.js
         - media/js/newsblur/reader/reader_utils.js
         - media/js/newsblur/reader/reader.js
         - media/js/newsblur/reader/reader_popover.js
@@ -121,7 +120,6 @@ stylesheets:
         - media/css/jquery.tipsy.css
         - media/css/vendor/bootstrap-progressbar.css
         - media/css/vendor/highlight.css
-        - media/css/vendor/bigfoot.css
         - media/css/*.css
     mobile:
         - media/css/mobile/jquery.mobile-1.0b1.css

media/css/vendor/bigfoot.css

@@ -1,295 +0,0 @@
-.footnote-button {
-  position: relative;
-  z-index: 5;
-  top: -0.15em;
-  box-sizing: border-box;
-  -moz-box-sizing: border-box;
-  display: inline-block;
-  padding: 0.34em;
-  margin: 0 0.1em 0 0.2em;
-  border: none;
-  border-radius: 0.3em;
-  cursor: pointer;
-  opacity: 0.3;
-  background-color: #464646;
-  line-height: 0;
-  vertical-align: middle;
-  text-decoration: none;
-  font-smoothing: antialiased;
-  -webkit-transition: opacity;
-  -moz-transition: opacity;
-  -ms-transition: opacity;
-  transition: opacity;
-  -webkit-transition-duration: 0.25s;
-  -moz-transition-duration: 0.25s;
-  transition-duration: 0.25s;
-}
-.footnote-button:hover {
-  opacity: 0.6;
-}
-.footnote-button:active {
-  opacity: 0.6;
-}
-.footnote-button.active {
-  opacity: 0.9;
-  -webkit-transition-delay: 0.15s;
-  -moz-transition-delay: 0.15s;
-  transition-delay: 0.15s;
-}
-
-.footnote-circle {
-  display: inline-block;
-  width: 0.32em;
-  height: 0.32em;
-  margin-right: 0.224em;
-  border-radius: 100%;
-  background-color: #e6e6e6;
-  border: none;
-}
-.footnote-circle:last-child {
-  margin-right: 0;
-}
-
-@media not print {
-  .footnote-print-only {
-    display: none !important;
-  }
-}
-@media print {
-  .footnote-button {
-    display: none !important;
-  }
-}
-.footnote-content {
-  position: fixed;
-  z-index: 10;
-  bottom: auto;
-  left: auto;
-  box-sizing: border-box;
-  -moz-box-sizing: border-box;
-  max-width: 90%;
-  margin: 1.21924em auto;
-  display: inline-block;
-  background: #fafafa;
-  opacity: 0;
-  border-radius: 0.5em;
-  border: 1px solid #c3c3c3;
-  box-shadow: 0px 0px 8px rgba(0, 0, 0, 0.3);
-  -webkit-transition: opacity, -webkit-transform;
-  -moz-transition: opacity, -moz-transform;
-  -ms-transition: opacity, -ms-transform;
-  transition: opacity, transform;
-  -webkit-transition-duration: 0.25s;
-  -moz-transition-duration: 0.25s;
-  transition-duration: 0.25s;
-}
-.footnote-content:not(.fixed-bottom) {
-  -webkit-transform: scale(0.1) translateZ(0);
-  -moz-transform: scale(0.1) translateZ(0);
-  -ms-transform: scale(0.1) translateZ(0);
-  -o-transform: scale(0.1) translateZ(0);
-  transform: scale(0.1) translateZ(0);
-  -webkit-transform-origin: 50% 0;
-  -moz-transform-origin: 50% 0;
-  -ms-transform-origin: 50% 0;
-  -o-transform-origin: 50% 0;
-  transform-origin: 50% 0;
-}
-.footnote-content.active:not(.fixed-bottom) {
-  -webkit-transform: scale(1) translateZ(0);
-  -moz-transform: scale(1) translateZ(0);
-  -ms-transform: scale(1) translateZ(0);
-  -o-transform: scale(1) translateZ(0);
-  transform: scale(1) translateZ(0);
-  opacity: 0.97;
-}
-.footnote-content.bottom {
-  -webkit-transform-origin: top;
-  -moz-transform-origin: top;
-  -ms-transform-origin: top;
-  -o-transform-origin: top;
-  transform-origin: top;
-}
-.footnote-content.top {
-  -webkit-transform-origin: bottom;
-  -moz-transform-origin: bottom;
-  -ms-transform-origin: bottom;
-  -o-transform-origin: bottom;
-  transform-origin: bottom;
-}
-.footnote-content.fixed-bottom {
-  bottom: 0 !important;
-  top: auto !important;
-  left: 0 !important;
-  width: 100%;
-  max-width: 100%;
-  margin: 0;
-  -webkit-transform: translateY(105%);
-  -moz-transform: translateY(105%);
-  -ms-transform: translateY(105%);
-  -o-transform: translateY(105%);
-  transform: translateY(105%);
-  border-radius: 0;
-  opacity: 1;
-  -webkit-transition: -webkit-transform;
-  -moz-transition: -moz-transform;
-  -ms-transition: -ms-transform;
-  transition: transform;
-  -webkit-transition-duration: 0.25s;
-  -moz-transition-duration: 0.25s;
-  transition-duration: 0.25s;
-}
-.footnote-content.fixed-bottom.active {
-  -webkit-transform: translateY(0);
-  -moz-transform: translateY(0);
-  -ms-transform: translateY(0);
-  -o-transform: translateY(0);
-  transform: translateY(0);
-}
-.footnote-content.fixed-bottom .footnote-main-wrapper {
-  max-width: 90%;
-  width: 22em;
-  margin: 0 auto;
-}
-.footnote-content.fixed-bottom .tooltip {
-  display: none;
-}
-.footnote-content.scrollable:after {
-  content: '...';
-  position: fixed;
-  bottom: 0.45em;
-  right: 50%;
-  z-index: 20;
-  width: 1.5em;
-  margin-right: -0.75em;
-  opacity: 1;
-  background-color: #fafafa;
-  font-family: Georgia;
-  font-weight: bold;
-  font-size: 1.8em;
-  text-align: center;
-  color: rgba(0, 0, 0, 0.08);
-  line-height: 0;
-  -webkit-transition: opacity;
-  -moz-transition: opacity;
-  -ms-transition: opacity;
-  transition: opacity;
-  -webkit-transition-duration: 0.25s;
-  -moz-transition-duration: 0.25s;
-  transition-duration: 0.25s;
-  -webkit-transition-delay: 0.4s;
-  -moz-transition-delay: 0.4s;
-  transition-delay: 0.4s;
-}
-.footnote-content.scrollable.fully-scrolled:after {
-  opacity: 0;
-  -webkit-transition-delay: 0s;
-  -moz-transition-delay: 0s;
-  transition-delay: 0s;
-}
-.footnote-content.scrollable .footnote-main-wrapper:before, .footnote-content.scrollable .footnote-main-wrapper:after {
-  content: ' ';
-  position: absolute;
-  width: 100%;
-  z-index: 12;
-}
-.footnote-content.scrollable .footnote-main-wrapper:before {
-  top: -1px;
-  left: 0;
-  height: 1.1em;
-  border-radius: 0.5em 0.5em 0 0;
-  background: #fafafa;
-  background: -moz-linear-gradient(top, #fafafa 0%, #fafafa 50%, rgba(250, 250, 250, 0) 100%);
-  background: -webkit-gradient(linear, left top, left bottom, color-stop(0%, #fafafa), color-stop(50%, #fafafa), color-stop(100%, rgba(250, 250, 250, 0)));
-  background: -webkit-linear-gradient(top, #fafafa 0%, #fafafa 50%, rgba(250, 250, 250, 0) 100%);
-  background: -o-linear-gradient(top, #fafafa 0%, #fafafa 50%, rgba(250, 250, 250, 0) 100%);
-  background: -ms-linear-gradient(top, #fafafa 0%, #fafafa 50%, rgba(250, 250, 250, 0) 100%);
-  background: linear, to bottom, #fafafa 0%, #fafafa 50%, rgba(250, 250, 250, 0) 100%;
-}
-.footnote-content.scrollable .footnote-main-wrapper:after {
-  bottom: -1px;
-  left: 0;
-  height: 1.2em;
-  border-radius: 0 0 0.5em 0.5em;
-  background: #fafafa;
-  background: -moz-linear-gradient(bottom, #fafafa 0%, #fafafa 50%, rgba(250, 250, 250, 0) 100%);
-  background: -webkit-gradient(linear, left bottom, left top, color-stop(0%, #fafafa), color-stop(50%, #fafafa), color-stop(100%, rgba(250, 250, 250, 0)));
-  background: -webkit-linear-gradient(bottom, #fafafa 0%, #fafafa 50%, rgba(250, 250, 250, 0) 100%);
-  background: -o-linear-gradient(bottom, #fafafa 0%, #fafafa 50%, rgba(250, 250, 250, 0) 100%);
-  background: -ms-linear-gradient(bottom, #fafafa 0%, #fafafa 50%, rgba(250, 250, 250, 0) 100%);
-  background: linear, to top, #fafafa 0%, #fafafa 50%, rgba(250, 250, 250, 0) 100%;
-}
-.footnote-content ::-webkit-scrollbar {
-  display: none;
-}
-
-.footnote-main-wrapper {
-  position: relative;
-  z-index: 14;
-  box-sizing: border-box;
-  -moz-box-sizing: border-box;
-  overflow: hidden;
-  margin: 0;
-  max-width: 22em;
-  background-color: #fafafa;
-  border-radius: 0.5em;
-  -webkit-transition: max-height;
-  -moz-transition: max-height;
-  -ms-transition: max-height;
-  transition: max-height;
-  -webkit-transition-duration: 0.25s;
-  -moz-transition-duration: 0.25s;
-  transition-duration: 0.25s;
-}
-
-.footnote-content-wrapper {
-  position: relative;
-  z-index: 8;
-  max-height: 15em;
-  padding: 1.1em 1.3em 1.2em;
-  box-sizing: border-box;
-  -moz-box-sizing: border-box;
-  overflow: auto;
-  -webkit-overflow-scrolling: touch;
-  background: #fafafa;
-  border-radius: 0.5em;
-  -webkit-font-smoothing: subpixel-antialiased;
-}
-.footnote-content-wrapper img {
-  max-width: 100%;
-}
-.footnote-content-wrapper *:last-child {
-  margin-bottom: 0;
-}
-.footnote-content-wrapper *:first-child {
-  margin-top: 0;
-}
-
-.tooltip {
-  position: absolute;
-  z-index: 12;
-  box-sizing: border-box;
-  -moz-box-sizing: border-box;
-  margin-left: -0.65em;
-  width: 1.3em;
-  height: 1.3em;
-  -webkit-transform: rotate(45deg);
-  -moz-transform: rotate(45deg);
-  -ms-transform: rotate(45deg);
-  -o-transform: rotate(45deg);
-  transform: rotate(45deg);
-  background: #fafafa;
-  border: 1px solid #c3c3c3;
-  box-shadow: 0px 0px 8px rgba(0, 0, 0, 0.3);
-  border-top-left-radius: 0;
-}
-
-.bottom .tooltip {
-  top: -0.65em;
-  bottom: auto;
-}
-
-.top .tooltip {
-  bottom: -0.65em;
-  top: auto;
-}

media/js/newsblur/views/story_detail_view.js

@@ -87,12 +87,15 @@ NEWSBLUR.Views.StoryDetailView = Backbone.View.extend({
         this.toggle_intelligence();
         this.generate_gradients();
         this.render_comments();
+        
+        return this;
+    },
+    
+    attach_handlers: function() {
+        this.watch_images_for_story_height();
         this.attach_audio_handler();
-        this.attach_footnotes_handler();
         this.attach_syntax_highlighter_handler();
         this.attach_fitvid_handler();
-
-        return this;
     },
     
     render_header: function(model, value, options) {
@@ -536,17 +539,7 @@ NEWSBLUR.Views.StoryDetailView = Backbone.View.extend({
             this.$('pre').each(function(i, e) {
                 hljs.highlightBlock(e);
             });
-        }, this), 1000);
-    },
-    
-    attach_footnotes_handler: function() {
-        _.delay(_.bind(function() {
-            $.bigfoot({
-                scope: this.$el,
-                actionOriginalFN: 'ignore'
-            });
-        }, this), 500);
-
+        }, this), 100);
     },
     
     attach_fitvid_handler: function() {
@@ -555,7 +548,7 @@ NEWSBLUR.Views.StoryDetailView = Backbone.View.extend({
             this.$el.fitVids({
                 customSelector: "iframe[src*='youtu.be'],iframe[src*='www.flickr.com'],iframe[src*='view.vzaar.com']"
             });
-        }, this), 500);
+        }, this), 50);
     },
     
     // ==========
@@ -564,13 +557,14 @@ NEWSBLUR.Views.StoryDetailView = Backbone.View.extend({
     
     click_link_in_story: function(e) {
         if (NEWSBLUR.hotkeys.shift) return;
+        var $target = $(e.currentTarget);
 
         e.preventDefault();
         e.stopPropagation();
         if (e.which >= 2) return;
         if (e.which == 1 && $('.NB-menu-manage-container:visible').length) return;
 
-        var href = $(e.currentTarget).attr('href');
+        var href = $target.attr('href');
         
         if (NEWSBLUR.assets.preference('new_window') == 1) {
             window.open(href, '_blank');

media/js/newsblur/views/story_list_view.js

@@ -64,7 +64,7 @@ NEWSBLUR.Views.StoryListView = Backbone.View.extend({
         } else {
             this.$el.html(_.pluck(stories, 'el'));
         }
-        _.invoke(stories, 'watch_images_for_story_height');
+        _.invoke(stories, 'attach_handlers');
         this.show_correct_feed_in_feed_title_floater();
         this.stories = stories;
         _.defer(this.check_feed_view_scrolled_to_bottom);
@@ -86,7 +86,7 @@ NEWSBLUR.Views.StoryListView = Backbone.View.extend({
             if (!NEWSBLUR.assets.preference('feed_view_single_story')) {
                 this.$el.append(_.pluck(stories, 'el'));
             }
-            _.invoke(stories, 'watch_images_for_story_height');
+            _.invoke(stories, 'attach_handlers');
             
             this.stories = this.stories.concat(stories);
             _.defer(this.check_feed_view_scrolled_to_bottom);

media/js/newsblur/views/story_title_view.js

@@ -84,7 +84,7 @@ NEWSBLUR.Views.StoryTitleView = Backbone.View.extend({
                 inline_story_title: true
             }).render();
             this.$(".NB-story-detail").html(this.story_detail.$el);
-            this.story_detail.watch_images_for_story_height();
+            this.story_detail.attach_handlers();
         }
     },