xray-rails 0.1.23 → 0.2.0

checksums.yaml

@@ -1,7 +1,7 @@
 ---
 SHA1:
-  metadata.gz: 43b754b678a67b95ac0d3894d4c21b147d760254
-  data.tar.gz: 4913f797e357d7398bb19c701fa03d79f17d5cbb
+  metadata.gz: af26d9471fb39cf9697c4142f11d1218b282949f
+  data.tar.gz: 2dec43a0a579d6cce8a8159c3b97cb5a42d6168d
 SHA512:
-  metadata.gz: 721030f3a4b17b65c520aa0add7544d4fad43493b8d495681d93f48c90c6e5a42694f54a6e747d38255baf165808689f6cc60d1ad3c7e93289dbc23fd943c135
-  data.tar.gz: aa9b458338cb265942693b3cca64ccd9a2dfbbe26ba7c9b9a3309d0096e38762843fb45f59f3621631b15e82a24f9fec7521706fac26dd04aa23ec50bed2e0e4
+  metadata.gz: 36432e25ecbaa3cebacb6d6942de25567e7af1a082baea0f3946c821a2260aea6f53d436c4109f7428051db2c080daacf68a9f1821895dd37d757bc0f74725aa
+  data.tar.gz: ac7a9ef35f340e7e039d3f0a438c69e7b17e0de362f07a52af7c15e9326fa431cfd0bcc04987aeaab92dda88b5d51cf3da12992e7e99c54dac8b2276378921c6

data/README.md

@@ -6,7 +6,7 @@ Xray-rails
 
 ### Reveal your UI's bones
 
-The dev tools available to web developers in modern browsers are great. Many of us can't remember what life was like before "Inspect Element". But what we see in the compiled output sent to our browser is often the wrong level of detail - what about visualizing the higher level components of your UI? Controllers, templates, partials, Backbone views, etc.
+The dev tools available to web developers in modern browsers are great. Many of us can't remember what life was like before "Inspect Element". But what we see in the compiled output sent to our browser is often the wrong level of detail - what about visualizing the higher level components of your UI? Controllers, view templates, partials, JS templates, etc.
 
 Xray is the missing link between the browser and your app code. Press **cmd+shift+x** (Mac) or **ctrl+shift+x** to reveal an overlay of the files that rendered your UI, and click anything to open the file in your editor. [See Xray in action](http://f.cl.ly/items/1A0o3y1y3Q13103V3F1l/xray-rails-large.gif).
 
@@ -19,12 +19,11 @@ Xray is intended for Rails 3.1+ and Ruby 1.9+.
 So far, Xray can reveal:
 
   * Rails views and partials
-  * Backbone View instances if using the asset pipeline
   * Javascript templates if using the asset pipeline with the .jst extension
 
 ## Installation
 
-Xray depends on **jQuery**. Backbone is optional.
+Xray depends on **jQuery**.
 
 This gem should only be present during development. Add it to your Gemfile:
 
@@ -44,20 +43,15 @@ Restart your app, visit it in your browser, and press **cmd+shift+x** (Mac) or *
 
 #### Note about `config.assets.debug`
 
-For Xray to insert itself into your views automatically, `config.assets.debug = true` (Rails' default) must be set in development.rb. If you disabled this because of slow assets in Rails 3.2.13, [try this monkey patch instead](http://stackoverflow.com/a/15520932/24848) in an initializer.
+By default, Xray will insert itself into your views automatically. To do this, `config.assets.debug = true` (Rails' default) must be set in development.rb.
 
 Otherwise, you can insert Xray's scripts yourself, for example like so in application.js:
 
 ```js
 //= require jquery
 //= require xray
-...
-//= require backbone
-//= require xray-backbone
 ```
 
-Backbone support via `xray-backbone` is optional.
-
 ## Configuration
 
 By default, Xray will check a few environment variables to determine
@@ -80,7 +74,6 @@ For something more complex, use the `$file` placeholder.
 ## How this works
 
 * At run time, HTML responses from Rails are wrapped with HTML comments containing filepath info.
-* Additionally, JS templates and Backbone view constructors are modified during asset compilation.
 * A middleware inserts `xray.js`, `xray.css`, and the Xray bar into all successful HTML response bodies.
 * When the overlay is shown, `xray.js` examines the inserted filepath info to build the overlay.
 

data/app/assets/javascripts/xray.js

@@ -0,0 +1,471 @@
+// Generated by CoffeeScript 1.9.2
+(function() {
+  var $, MAX_ZINDEX, util,
+    hasProp = {}.hasOwnProperty,
+    bind = function(fn, me){ return function(){ return fn.apply(me, arguments); }; },
+    extend = function(child, parent) { for (var key in parent) { if (hasProp.call(parent, key)) child[key] = parent[key]; } function ctor() { this.constructor = child; } ctor.prototype = parent.prototype; child.prototype = new ctor(); child.__super__ = parent.prototype; return child; };
+
+  window.Xray = {};
+
+  if (!($ = window.jQuery)) {
+    return;
+  }
+
+  MAX_ZINDEX = 2147483647;
+
+  Xray.init = (function() {
+    var is_mac;
+    if (Xray.initialized) {
+      return;
+    }
+    Xray.initialized = true;
+    is_mac = navigator.platform.toUpperCase().indexOf('MAC') !== -1;
+    $(document).keydown(function(e) {
+      if ((is_mac && e.metaKey || !is_mac && e.ctrlKey) && e.shiftKey && e.keyCode === 88) {
+        if (Xray.isShowing) {
+          Xray.hide();
+        } else {
+          Xray.show();
+        }
+      }
+      if (Xray.isShowing && e.keyCode === 27) {
+        return Xray.hide();
+      }
+    });
+    return $(function() {
+      new Xray.Overlay;
+      Xray.findTemplates();
+      return typeof console !== "undefined" && console !== null ? console.log("Ready to Xray. Press " + (is_mac ? 'cmd+shift+x' : 'ctrl+shift+x') + " to scan your UI.") : void 0;
+    });
+  })();
+
+  Xray.specimens = function() {
+    return Xray.ViewSpecimen.all.concat(Xray.TemplateSpecimen.all);
+  };
+
+  Xray.constructorInfo = function(constructor) {
+    var func, info, ref;
+    if (window.XrayPaths) {
+      ref = window.XrayPaths;
+      for (info in ref) {
+        if (!hasProp.call(ref, info)) continue;
+        func = ref[info];
+        if (func === constructor) {
+          return JSON.parse(info);
+        }
+      }
+    }
+    return null;
+  };
+
+  Xray.findTemplates = function() {
+    return util.bm('findTemplates', function() {
+      var $templateContents, _, comment, comments, el, i, id, len, path, ref, results;
+      comments = $('*:not(iframe,script)').contents().filter(function() {
+        return this.nodeType === 8 && this.data.slice(0, 10) === "XRAY START";
+      });
+      results = [];
+      for (i = 0, len = comments.length; i < len; i++) {
+        comment = comments[i];
+        ref = comment.data.match(/^XRAY START (\d+) (.*)$/), _ = ref[0], id = ref[1], path = ref[2];
+        $templateContents = new jQuery;
+        el = comment.nextSibling;
+        while (!(!el || (el.nodeType === 8 && el.data === ("XRAY END " + id)))) {
+          if (el.nodeType === 1 && el.tagName !== 'SCRIPT') {
+            $templateContents.push(el);
+          }
+          el = el.nextSibling;
+        }
+        if ((el != null ? el.nodeType : void 0) === 8) {
+          el.parentNode.removeChild(el);
+        }
+        comment.parentNode.removeChild(comment);
+        results.push(Xray.TemplateSpecimen.add($templateContents, {
+          name: path.split('/').slice(-1)[0],
+          path: path
+        }));
+      }
+      return results;
+    });
+  };
+
+  Xray.open = function(path) {
+    return $.ajax({
+      url: "/_xray/open?path=" + path
+    });
+  };
+
+  Xray.show = function(type) {
+    if (type == null) {
+      type = null;
+    }
+    return Xray.Overlay.instance().show(type);
+  };
+
+  Xray.hide = function() {
+    return Xray.Overlay.instance().hide();
+  };
+
+  Xray.toggleSettings = function() {
+    return Xray.Overlay.instance().settings.toggle();
+  };
+
+  Xray.Specimen = (function() {
+    Specimen.add = function(el, info) {
+      if (info == null) {
+        info = {};
+      }
+      return this.all.push(new this(el, info));
+    };
+
+    Specimen.remove = function(el) {
+      var ref;
+      return (ref = this.find(el)) != null ? ref.remove() : void 0;
+    };
+
+    Specimen.find = function(el) {
+      var i, len, ref, specimen;
+      if (el instanceof jQuery) {
+        el = el[0];
+      }
+      ref = this.all;
+      for (i = 0, len = ref.length; i < len; i++) {
+        specimen = ref[i];
+        if (specimen.el === el) {
+          return specimen;
+        }
+      }
+      return null;
+    };
+
+    Specimen.reset = function() {
+      return this.all = [];
+    };
+
+    function Specimen(contents, info) {
+      if (info == null) {
+        info = {};
+      }
+      this.makeLabel = bind(this.makeLabel, this);
+      this.el = contents instanceof jQuery ? contents[0] : contents;
+      this.$contents = $(contents);
+      this.name = info.name;
+      this.path = info.path;
+    }
+
+    Specimen.prototype.remove = function() {
+      var idx;
+      idx = this.constructor.all.indexOf(this);
+      if (idx !== -1) {
+        return this.constructor.all.splice(idx, 1);
+      }
+    };
+
+    Specimen.prototype.isVisible = function() {
+      return this.$contents.length && this.$contents.is(':visible');
+    };
+
+    Specimen.prototype.makeBox = function() {
+      this.bounds = util.computeBoundingBox(this.$contents);
+      this.$box = $("<div class='xray-specimen " + this.constructor.name + "'>").css(this.bounds).attr('title', this.path);
+      if (this.$contents.css('position') === 'fixed') {
+        this.$box.css({
+          position: 'fixed',
+          top: this.$contents.css('top'),
+          left: this.$contents.css('left')
+        });
+      }
+      this.$box.click((function(_this) {
+        return function() {
+          return Xray.open(_this.path);
+        };
+      })(this));
+      return this.$box.append(this.makeLabel);
+    };
+
+    Specimen.prototype.makeLabel = function() {
+      return $("<div class='xray-specimen-handle " + this.constructor.name + "'>").append(this.name);
+    };
+
+    return Specimen;
+
+  })();
+
+  Xray.ViewSpecimen = (function(superClass) {
+    extend(ViewSpecimen, superClass);
+
+    function ViewSpecimen() {
+      return ViewSpecimen.__super__.constructor.apply(this, arguments);
+    }
+
+    ViewSpecimen.all = [];
+
+    return ViewSpecimen;
+
+  })(Xray.Specimen);
+
+  Xray.TemplateSpecimen = (function(superClass) {
+    extend(TemplateSpecimen, superClass);
+
+    function TemplateSpecimen() {
+      return TemplateSpecimen.__super__.constructor.apply(this, arguments);
+    }
+
+    TemplateSpecimen.all = [];
+
+    return TemplateSpecimen;
+
+  })(Xray.Specimen);
+
+  Xray.Overlay = (function() {
+    Overlay.instance = function() {
+      return this.singletonInstance || (this.singletonInstance = new this);
+    };
+
+    function Overlay() {
+      Xray.Overlay.singletonInstance = this;
+      this.bar = new Xray.Bar('#xray-bar');
+      this.settings = new Xray.Settings('#xray-settings');
+      this.shownBoxes = [];
+      this.$overlay = $('<div id="xray-overlay">');
+      this.$overlay.click((function(_this) {
+        return function() {
+          return _this.hide();
+        };
+      })(this));
+    }
+
+    Overlay.prototype.show = function(type) {
+      if (type == null) {
+        type = null;
+      }
+      this.reset();
+      Xray.isShowing = true;
+      return util.bm('show', (function(_this) {
+        return function() {
+          var element, i, len, results, specimens;
+          _this.bar.$el().find('#xray-bar-togglers .xray-bar-btn').removeClass('active');
+          if (!_this.$overlay.is(':visible')) {
+            $('body').append(_this.$overlay);
+            _this.bar.show();
+          }
+          switch (type) {
+            case 'templates':
+              Xray.findTemplates();
+              specimens = Xray.TemplateSpecimen.all;
+              _this.bar.$el().find('.xray-bar-templates-toggler').addClass('active');
+              break;
+            case 'views':
+              specimens = Xray.ViewSpecimen.all;
+              _this.bar.$el().find('.xray-bar-views-toggler').addClass('active');
+              break;
+            default:
+              Xray.findTemplates();
+              specimens = Xray.specimens();
+              _this.bar.$el().find('.xray-bar-all-toggler').addClass('active');
+          }
+          results = [];
+          for (i = 0, len = specimens.length; i < len; i++) {
+            element = specimens[i];
+            if (!element.isVisible()) {
+              continue;
+            }
+            element.makeBox();
+            element.$box.css({
+              zIndex: Math.ceil(MAX_ZINDEX * 0.9 + element.bounds.top + element.bounds.left)
+            });
+            _this.shownBoxes.push(element.$box);
+            results.push($('body').append(element.$box));
+          }
+          return results;
+        };
+      })(this));
+    };
+
+    Overlay.prototype.reset = function() {
+      var $box, i, len, ref;
+      ref = this.shownBoxes;
+      for (i = 0, len = ref.length; i < len; i++) {
+        $box = ref[i];
+        $box.remove();
+      }
+      return this.shownBoxes = [];
+    };
+
+    Overlay.prototype.hide = function() {
+      Xray.isShowing = false;
+      this.$overlay.detach();
+      this.reset();
+      return this.bar.hide();
+    };
+
+    return Overlay;
+
+  })();
+
+  Xray.Bar = (function() {
+    function Bar(el) {
+      this.el = el;
+    }
+
+    Bar.prototype.$el = function() {
+      if ((this.$el_memo != null) && $.contains(window.document, this.$el_memo[0])) {
+        return this.$el_memo;
+      }
+      this.$el_memo = $(this.el);
+      this.$el_memo.css({
+        zIndex: MAX_ZINDEX
+      });
+      this.$el_memo.find('#xray-bar-controller-path .xray-bar-btn').click(function() {
+        return Xray.open($(this).attr('data-path'));
+      });
+      this.$el_memo.find('.xray-bar-all-toggler').click(function() {
+        return Xray.show();
+      });
+      this.$el_memo.find('.xray-bar-templates-toggler').click(function() {
+        return Xray.show('templates');
+      });
+      this.$el_memo.find('.xray-bar-views-toggler').click(function() {
+        return Xray.show('views');
+      });
+      this.$el_memo.find('.xray-bar-settings-btn').click(function() {
+        return Xray.toggleSettings();
+      });
+      return this.$el_memo;
+    };
+
+    Bar.prototype.show = function() {
+      this.$el().show();
+      this.originalPadding = parseInt($('html').css('padding-bottom'));
+      if (this.originalPadding < 40) {
+        return $('html').css({
+          paddingBottom: 40
+        });
+      }
+    };
+
+    Bar.prototype.hide = function() {
+      this.$el().hide();
+      return $('html').css({
+        paddingBottom: this.originalPadding
+      });
+    };
+
+    return Bar;
+
+  })();
+
+  Xray.Settings = (function() {
+    function Settings(el) {
+      this.displayUpdateMsg = bind(this.displayUpdateMsg, this);
+      this.save = bind(this.save, this);
+      this.toggle = bind(this.toggle, this);
+      this.el = el;
+    }
+
+    Settings.prototype.$el = function() {
+      if ((this.$el_memo != null) && $.contains(window.document, this.$el_memo[0])) {
+        return this.$el_memo;
+      }
+      this.$el_memo = $(this.el);
+      this.$el_memo.find('form').submit(this.save);
+      return this.$el_memo;
+    };
+
+    Settings.prototype.toggle = function() {
+      return this.$el().toggle();
+    };
+
+    Settings.prototype.save = function(e) {
+      var editor;
+      e.preventDefault();
+      editor = this.$el().find('#xray-editor-input').val();
+      return $.ajax({
+        url: '/_xray/config',
+        type: 'POST',
+        data: {
+          editor: editor
+        },
+        success: (function(_this) {
+          return function() {
+            return _this.displayUpdateMsg(true);
+          };
+        })(this),
+        error: (function(_this) {
+          return function() {
+            return _this.displayUpdateMsg(false);
+          };
+        })(this)
+      });
+    };
+
+    Settings.prototype.displayUpdateMsg = function(success) {
+      var $msg;
+      if (success) {
+        $msg = $("<span class='xray-settings-success xray-settings-update-msg'>Success!</span>");
+      } else {
+        $msg = $("<span class='xray-settings-error xray-settings-update-msg'>Uh oh, something went wrong!</span>");
+      }
+      this.$el().append($msg);
+      return $msg.delay(2000).fadeOut(500, (function(_this) {
+        return function() {
+          $msg.remove();
+          return _this.toggle();
+        };
+      })(this));
+    };
+
+    return Settings;
+
+  })();
+
+  util = {
+    bm: function(name, fn) {
+      var result, time;
+      time = new Date;
+      result = fn();
+      return result;
+    },
+    computeBoundingBox: function($contents) {
+      var $el, boxFrame, el, frame, i, len;
+      if ($contents.length === 1 && $contents.height() <= 0) {
+        return util.computeBoundingBox($contents.children());
+      }
+      boxFrame = {
+        top: Number.POSITIVE_INFINITY,
+        left: Number.POSITIVE_INFINITY,
+        right: Number.NEGATIVE_INFINITY,
+        bottom: Number.NEGATIVE_INFINITY
+      };
+      for (i = 0, len = $contents.length; i < len; i++) {
+        el = $contents[i];
+        $el = $(el);
+        if (!$el.is(':visible')) {
+          continue;
+        }
+        frame = $el.offset();
+        frame.right = frame.left + $el.outerWidth();
+        frame.bottom = frame.top + $el.outerHeight();
+        if (frame.top < boxFrame.top) {
+          boxFrame.top = frame.top;
+        }
+        if (frame.left < boxFrame.left) {
+          boxFrame.left = frame.left;
+        }
+        if (frame.right > boxFrame.right) {
+          boxFrame.right = frame.right;
+        }
+        if (frame.bottom > boxFrame.bottom) {
+          boxFrame.bottom = frame.bottom;
+        }
+      }
+      return {
+        left: boxFrame.left,
+        top: boxFrame.top,
+        width: boxFrame.right - boxFrame.left,
+        height: boxFrame.bottom - boxFrame.top
+      };
+    }
+  };
+
+}).call(this);

data/lib/xray-rails.rb

@@ -17,52 +17,6 @@ module Xray
     Thread.current[:request_info] ||= {}
   end
 
-  # Patterns for the kind of JS constructors Xray is interested in knowing the
-  # filepath of. Unforunately, these patterns will result in a lot of false
-  # positives, because we can't only match direct Backbone.View subclasses -
-  # the app's JS may have a more complex class hierarchy than that.
-  CONSTRUCTOR_PATTERNS = [
-    '(?!jQuery|_)[\w\.]+\.extend\({', # Match uses of extend(), excluding jQuery and underscore
-    '\(function\(_super\) {'          # Coffeescript-generated constructors
-  ]
-
-  # Example matches:
-  #   MyView = Backbone.View.extend({ ...
-  #   Foo.MyView = Backbone.View.extend({ ...
-  #   MyView = (function(_super) { ...
-  #
-  # Captures:
-  #   $1 = space before the constructor
-  #   $2 = the constructor's name
-  #   $3 = the beginning of the constructor function
-  CONSTRUCTOR_REGEX = /^( *)([\w\.]+) *= *(#{CONSTRUCTOR_PATTERNS.join('|')})/
-
-  # Returns augmented JS source where constructors Xray wants to know the
-  # filepath of are captured in such a way that at runtime, xray.js can look
-  # up a view constructor's filepath and name.
-  #
-  # This:
-  #   MyView = Backbone.View.extend({ ...
-  #
-  # Becomes:
-  #   MyView = (window.XrayPaths||(window.XrayPaths={}))['{"name":"MyView","path":"/path/to/file.js"}'] = Backbone.View.extend({ ...
-  #
-  # A goal here was to not add any new lines to the source so as not to throw
-  # off line numbers if an exception is thrown, hence the odd pattern of
-  # abusing an object set operation in a multiple assignment.
-  #
-  # TODO: This is simple and gets the job done, but is a bit ridiculous.
-  #       I've also seen this appear in stack traces :( Would love to find a
-  #       way to do this without actually writing to the files.
-  def self.augment_js(source, path)
-    source.gsub(CONSTRUCTOR_REGEX) do
-      space, class_name, func = $1, $2, $3
-      info = {name: class_name, path: path.to_s}
-      xray = "(window.XrayPaths||(window.XrayPaths={}))['#{info.to_json}']"
-      "#{space}#{class_name} = #{xray} = #{func}"
-    end
-  end
-
   # Returns augmented HTML where the source is simply wrapped in an HTML
   # comment with filepath info. Xray.js uses these comments to associate
   # elements with the templates that rendered them.

data/lib/xray/engine.rb

@@ -10,24 +10,12 @@ module Xray
       app.middleware.use Xray::Middleware
 
       # Required by Rails 4.1
-      app.config.assets.precompile += %w(xray.js xray-backbone.js xray.css)
+      app.config.assets.precompile += %w(xray.js xray.css)
     end
 
     config.after_initialize do |app|
       ensure_asset_pipeline_enabled! app
 
-      # Register as a Sprockets processor to augment JS files, including
-      # compiled coffeescript, with filepath information. See
-      # `Xray.augment_js` for details.
-      app.assets.register_postprocessor 'application/javascript', :xray do |context, data|
-        path = context.pathname.to_s
-        if path =~ /^#{app.root}.+\.(js|coffee)(\.|$)/
-          Xray.augment_js(data, path)
-        else
-          data
-        end
-      end
-
       # Monkey patch ActionView::Template to augment server-side templates
       # with filepath information. See `Xray.augment_template` for details.
       ActionView::Template.class_eval do
@@ -52,16 +40,40 @@ module Xray
         alias_method_chain :render, :xray
       end
 
-      # Augment JS templates
-      app.assets.register_preprocessor 'application/javascript', :xray do |context, source|
-        path = context.pathname.to_s
-        if path =~ /^#{app.root}.+\.(jst)(\.|$)/
-          Xray.augment_template(source, path)
-        else
-          source
+      # Sprockets preprocessor interface which supports all versions of Sprockets.
+      # See: https://github.com/rails/sprockets/blob/master/guides/extending_sprockets.md#supporting-all-versions-of-sprockets-in-processors
+      class JavascriptPreprocessor
+        def initialize(filename, &block)
+          @filename = filename
+          @source   = block.call
+        end
+
+        def render(context, empty_hash_wtf)
+          self.class.run(@filename, @source, context)
+        end
+
+        def self.run(filename, source, context)
+          path = context.pathname.to_s
+          if path =~ /^#{Rails.root}.+\.(jst)(\.|$)/
+            Xray.augment_template(source, path)
+          else
+            source
+          end
+        end
+
+        def self.call(input)
+          filename = input[:filename]
+          source   = input[:data]
+          context  = input[:environment].context_class.new(input)
+
+          result = run(filename, source, context)
+          context.metadata.merge(data: result)
         end
       end
 
+      # Augment JS templates
+      app.assets.register_preprocessor 'application/javascript', JavascriptPreprocessor
+
       # This event is called near the beginning of a request cycle. We use it to
       # collect information about the controller and action that is responding, for
       # display in the Xray bar.

data/lib/xray/middleware.rb

@@ -4,9 +4,9 @@ module Xray
   OPEN_PATH = '/_xray/open'
   UPDATE_CONFIG_PATH = '/_xray/config'
 
-  # This middleware is responsible for injecting xray.js, xray-backbone.js, and
-  # the Xray bar into the app's pages. It also listens for requests to open files
-  # with the user's editor.
+  # This middleware is responsible for injecting xray.js and the Xray bar into
+  # the app's pages. It also listens for requests to open files with the user's
+  # editor.
   class Middleware
     def initialize(app)
       @app = app
@@ -44,7 +44,6 @@ module Xray
           elsif Rails.application.config.assets.debug
             # Otherwise try to inject xray.js if assets are unbundled
             if append_js!(body, 'jquery', 'xray')
-              append_js!(body, 'backbone', 'xray-backbone')
               inject_xray_bar!(body)
             end
           end

data/lib/xray/version.rb

@@ -1,3 +1,3 @@
 module Xray
-  VERSION = "0.1.23".freeze
+  VERSION = "0.2.0".freeze
 end

metadata

@@ -1,7 +1,7 @@
 --- !ruby/object:Gem::Specification
 name: xray-rails
 version: !ruby/object:Gem::Version
-  version: 0.1.23
+  version: 0.2.0
 platform: ruby
 authors:
 - Brent Dillingham
@@ -24,20 +24,6 @@ dependencies:
     - - ">="
       - !ruby/object:Gem::Version
         version: 3.1.0
-- !ruby/object:Gem::Dependency
-  name: coffee-rails
-  requirement: !ruby/object:Gem::Requirement
-    requirements:
-    - - ">="
-      - !ruby/object:Gem::Version
-        version: '0'
-  type: :runtime
-  prerelease: false
-  version_requirements: !ruby/object:Gem::Requirement
-    requirements:
-    - - ">="
-      - !ruby/object:Gem::Version
-        version: '0'
 - !ruby/object:Gem::Dependency
   name: rspec-rails
   requirement: !ruby/object:Gem::Requirement
@@ -80,34 +66,6 @@ dependencies:
     - - ">="
       - !ruby/object:Gem::Version
         version: '0'
-- !ruby/object:Gem::Dependency
-  name: backbone-rails
-  requirement: !ruby/object:Gem::Requirement
-    requirements:
-    - - ">="
-      - !ruby/object:Gem::Version
-        version: '0'
-  type: :development
-  prerelease: false
-  version_requirements: !ruby/object:Gem::Requirement
-    requirements:
-    - - ">="
-      - !ruby/object:Gem::Version
-        version: '0'
-- !ruby/object:Gem::Dependency
-  name: sass-rails
-  requirement: !ruby/object:Gem::Requirement
-    requirements:
-    - - ">="
-      - !ruby/object:Gem::Version
-        version: '0'
-  type: :development
-  prerelease: false
-  version_requirements: !ruby/object:Gem::Requirement
-    requirements:
-    - - ">="
-      - !ruby/object:Gem::Version
-        version: '0'
 - !ruby/object:Gem::Dependency
   name: haml
   requirement: !ruby/object:Gem::Requirement
@@ -122,20 +80,6 @@ dependencies:
     - - ">="
       - !ruby/object:Gem::Version
         version: '0'
-- !ruby/object:Gem::Dependency
-  name: eco
-  requirement: !ruby/object:Gem::Requirement
-    requirements:
-    - - ">="
-      - !ruby/object:Gem::Version
-        version: '0'
-  type: :development
-  prerelease: false
-  version_requirements: !ruby/object:Gem::Requirement
-    requirements:
-    - - ">="
-      - !ruby/object:Gem::Version
-        version: '0'
 - !ruby/object:Gem::Dependency
   name: capybara
   requirement: !ruby/object:Gem::Requirement
@@ -151,7 +95,7 @@ dependencies:
       - !ruby/object:Gem::Version
         version: '0'
 description: Provides a dev bar and an overlay in-browser to visualize your UI's rendered
-  partials and Backbone views
+  partials
 email:
 - brentdillingham@gmail.com
 executables: []
@@ -160,7 +104,7 @@ extra_rdoc_files: []
 files:
 - LICENSE
 - README.md
-- app/assets/javascripts/xray-backbone.js.coffee
+- app/assets/javascripts/xray.js
 - app/assets/javascripts/xray.js.coffee
 - app/assets/stylesheets/xray.css
 - app/views/_xray_bar.html.erb
@@ -173,9 +117,7 @@ homepage: https://github.com/brentd/xray-rails
 licenses:
 - MIT
 metadata: {}
-post_install_message: |
-  Backbone.js support will be removed from xray-rails in version 0.2.0.
-  If you need backbone.js support, lock xray-rails to 0.1.22 to avoid breaking changes.
+post_install_message: 
 rdoc_options: []
 require_paths:
 - lib

data/app/assets/javascripts/xray-backbone.js.coffee

@@ -1,20 +0,0 @@
-# Xray Backbone integration. This involves hooking into the lifecycle
-# of Backbone.View by monkey patching its prototype. Would love a cleaner
-# way of doing this, as nobody wants to this stuff in their stack traces.
-
-return unless window.Backbone && window.Xray
-
-# Wrap Backbone.View::_ensureElement to add the view to Xray once
-# its element has been setup.
-_ensureElement = Backbone.View::_ensureElement
-Backbone.View::_ensureElement = ->
-  _.defer =>
-    if info = Xray.constructorInfo @constructor
-      Xray.ViewSpecimen.add @el, info
-  _ensureElement.apply(this, arguments)
-
-# Cleanup when view is removed.
-_remove = Backbone.View::remove
-Backbone.View::remove = ->
-  Xray.ViewSpecimen.remove @el
-  _remove.apply(this, arguments)