 
 # Scans the document for templates, creating Xray.Elements for them.
 Xray.addTemplateElements = ->
-  for beginScript in $('script[type="xray-template-start"]')
-    path = $(beginScript).attr('data-xray-path')
-    # This could very well be multiple elements. Xray.add() supports adding
-    # a jQuery object wrapping multiple elements for this reason.
-    el = $(beginScript).nextUntil('script[type="xray-template-end"]')
-    continue if Xray.findElement(el)
-    Xray.add el,
+  comments = $('*').contents().filter ->
+    this.nodeType == 8 and this.data[0..10] == " XRAY START"
+  for comment in comments
+    [_, id, path] = comment.data.match(/^ XRAY START (\d+) (.*) $/)
+    $templateContents = new jQuery
+    el = comment.nextSibling
+    until !el or (el.nodeType == 8 and el.data == " XRAY END #{id} ")
+      $templateContents.push el if el.nodeType == 1
+      el = el.nextSibling
+    Xray.add $templateContents,
       name: path.split('/').slice(-1)[0]
       path: path
 


# Add a DOM element with associated metadata to be tracked by Xray
Xray.add = (el, info = {}) ->
  console.log info
  Xray.elements.push new Xray.Element(el, info)

# Remove a DOM element from Xray
Xray.remove = (el) ->

    @$box = $('<div>').css
      position   : 'absolute'
      background : 'rgba(255,255,255,0.8)'
      color      : '#666'
      fontFamily : '"Helvetica Neue", sans-serif'
      fontSize   : '13px'
      zIndex     : 99999
      top        : bbox.top
      left       : bbox.left
