joosy 1.2.0.alpha.73 → 1.2.0.beta.1

data/source/metamorph.coffee

@@ -1,410 +0,0 @@
-# ==========================================================================
-# Project:   metamorph
-# Copyright: ©2013 Tilde, Inc. All rights reserved.
-# ==========================================================================
-((window) ->
-  K = ->
-
-  guid = 0
-  document = window.document
-  
-  # Feature-detect the W3C range API, the extended check is for IE9 which only partially supports ranges
-  supportsRange = document and ("createRange" of document) and (typeof Range isnt "undefined") and Range::createContextualFragment
-  
-  # Internet Explorer prior to 9 does not allow setting innerHTML if the first element
-  # is a "zero-scope" element. This problem can be worked around by making
-  # the first node an invisible text node. We, like Modernizr, use ­
-  needsShy = document and (->
-    testEl = document.createElement("div")
-    testEl.innerHTML = "<div></div>"
-    testEl.firstChild.innerHTML = "<script></script>"
-    testEl.firstChild.innerHTML is ""
-  )()
-  
-  # IE 8 (and likely earlier) likes to move whitespace preceeding
-  # a script tag to appear after it. This means that we can
-  # accidentally remove whitespace when updating a morph.
-  movesWhitespace = document and (->
-    testEl = document.createElement("div")
-    testEl.innerHTML = "Test: <script type='text/x-placeholder'></script>Value"
-    testEl.childNodes[0].nodeValue is "Test:" and testEl.childNodes[2].nodeValue is " Value"
-  )()
-  
-  # Constructor that supports either Metamorph('foo') or new
-  # Metamorph('foo');
-  # 
-  # Takes a string of HTML as the argument.
-  Metamorph = (html) ->
-    self = undefined
-    if this instanceof Metamorph
-      self = this
-    else
-      self = new K()
-    self.innerHTML = html
-    myGuid = "metamorph-" + (guid++)
-    self.start = myGuid + "-start"
-    self.end = myGuid + "-end"
-    self
-
-  K:: = Metamorph::
-  rangeFor = undefined
-  htmlFunc = undefined
-  removeFunc = undefined
-  outerHTMLFunc = undefined
-  appendToFunc = undefined
-  afterFunc = undefined
-  prependFunc = undefined
-  startTagFunc = undefined
-  endTagFunc = undefined
-  outerHTMLFunc = ->
-    @startTag() + @innerHTML + @endTag()
-
-  startTagFunc = ->
-    
-    #
-    #     * We replace chevron by its hex code in order to prevent escaping problems.
-    #     * Check this thread for more explaination:
-    #     * http://stackoverflow.com/questions/8231048/why-use-x3c-instead-of-when-generating-html-from-javascript
-    #     
-    "<script id='" + @start + "' type='text/x-placeholder'></script>"
-
-  endTagFunc = ->
-    
-    #
-    #     * We replace chevron by its hex code in order to prevent escaping problems.
-    #     * Check this thread for more explaination:
-    #     * http://stackoverflow.com/questions/8231048/why-use-x3c-instead-of-when-generating-html-from-javascript
-    #     
-    "<script id='" + @end + "' type='text/x-placeholder'></script>"
-
-  
-  # If we have the W3C range API, this process is relatively straight forward.
-  if supportsRange
-    
-    # Get a range for the current morph. Optionally include the starting and
-    # ending placeholders.
-    rangeFor = (morph, outerToo) ->
-      range = document.createRange()
-      before = document.getElementById(morph.start)
-      after = document.getElementById(morph.end)
-      if outerToo
-        range.setStartBefore before
-        range.setEndAfter after
-      else
-        range.setStartAfter before
-        range.setEndBefore after
-      range
-
-    htmlFunc = (html, outerToo) ->
-      
-      # get a range for the current metamorph object
-      range = rangeFor(this, outerToo)
-      
-      # delete the contents of the range, which will be the
-      # nodes between the starting and ending placeholder.
-      range.deleteContents()
-      
-      # create a new document fragment for the HTML
-      fragment = range.createContextualFragment(html)
-      
-      # insert the fragment into the range
-      range.insertNode fragment
-
-    removeFunc = ->
-      
-      # get a range for the current metamorph object including
-      # the starting and ending placeholders.
-      range = rangeFor(this, true)
-      
-      # delete the entire range.
-      range.deleteContents()
-
-    appendToFunc = (node) ->
-      range = document.createRange()
-      range.setStart node
-      range.collapse false
-      frag = range.createContextualFragment(@outerHTML())
-      node.appendChild frag
-
-    afterFunc = (html) ->
-      range = document.createRange()
-      after = document.getElementById(@end)
-      range.setStartAfter after
-      range.setEndAfter after
-      fragment = range.createContextualFragment(html)
-      range.insertNode fragment
-
-    prependFunc = (html) ->
-      range = document.createRange()
-      start = document.getElementById(@start)
-      range.setStartAfter start
-      range.setEndAfter start
-      fragment = range.createContextualFragment(html)
-      range.insertNode fragment
-  else
-    
-    ###
-    This code is mostly taken from jQuery, with one exception. In jQuery's case, we
-    have some HTML and we need to figure out how to convert it into some nodes.
-    
-    In this case, jQuery needs to scan the HTML looking for an opening tag and use
-    that as the key for the wrap map. In our case, we know the parent node, and
-    can use its type as the key for the wrap map.
-    ###
-    wrapMap =
-      select: [1, "<select multiple='multiple'>", "</select>"]
-      fieldset: [1, "<fieldset>", "</fieldset>"]
-      table: [1, "<table>", "</table>"]
-      tbody: [2, "<table><tbody>", "</tbody></table>"]
-      tr: [3, "<table><tbody><tr>", "</tr></tbody></table>"]
-      colgroup: [2, "<table><tbody></tbody><colgroup>", "</colgroup></table>"]
-      map: [1, "<map>", "</map>"]
-      _default: [0, "", ""]
-
-    findChildById = (element, id) ->
-      return element  if element.getAttribute("id") is id
-      len = element.childNodes.length
-      idx = undefined
-      node = undefined
-      found = undefined
-      idx = 0
-      while idx < len
-        node = element.childNodes[idx]
-        found = node.nodeType is 1 and findChildById(node, id)
-        return found  if found
-        idx++
-
-    setInnerHTML = (element, html) ->
-      matches = []
-      if movesWhitespace
-        
-        # Right now we only check for script tags with ids with the
-        # goal of targeting morphs.
-        html = html.replace(/(\s+)(<script id='([^']+)')/g, (match, spaces, tag, id) ->
-          matches.push [id, spaces]
-          tag
-        )
-      element.innerHTML = html
-      
-      # If we have to do any whitespace adjustments do them now
-      if matches.length > 0
-        len = matches.length
-        idx = undefined
-        idx = 0
-        while idx < len
-          script = findChildById(element, matches[idx][0])
-          node = document.createTextNode(matches[idx][1])
-          script.parentNode.insertBefore node, script
-          idx++
-
-    
-    ###
-    Given a parent node and some HTML, generate a set of nodes. Return the first
-    node, which will allow us to traverse the rest using nextSibling.
-    
-    We need to do this because innerHTML in IE does not really parse the nodes.
-    ###
-    firstNodeFor = (parentNode, html) ->
-      arr = wrapMap[parentNode.tagName.toLowerCase()] or wrapMap._default
-      depth = arr[0]
-      start = arr[1]
-      end = arr[2]
-      html = "&shy;" + html  if needsShy
-      element = document.createElement("div")
-      setInnerHTML element, start + html + end
-      i = 0
-
-      while i <= depth
-        element = element.firstChild
-        i++
-      
-      # Look for &shy; to remove it.
-      if needsShy
-        shyElement = element
-        
-        # Sometimes we get nameless elements with the shy inside
-        shyElement = shyElement.firstChild  while shyElement.nodeType is 1 and not shyElement.nodeName
-        
-        # At this point it's the actual unicode character.
-        shyElement.nodeValue = shyElement.nodeValue.slice(1)  if shyElement.nodeType is 3 and shyElement.nodeValue.charAt(0) is "­"
-      element
-
-    
-    ###
-    In some cases, Internet Explorer can create an anonymous node in
-    the hierarchy with no tagName. You can create this scenario via:
-    
-    div = document.createElement("div");
-    div.innerHTML = "<table>&shy<script></script><tr><td>hi</td></tr></table>";
-    div.firstChild.firstChild.tagName //=> ""
-    
-    If our script markers are inside such a node, we need to find that
-    node and use *it* as the marker.
-    ###
-    realNode = (start) ->
-      start = start.parentNode  while start.parentNode.tagName is ""
-      start
-
-    
-    ###
-    When automatically adding a tbody, Internet Explorer inserts the
-    tbody immediately before the first <tr>. Other browsers create it
-    before the first node, no matter what.
-    
-    This means the the following code:
-    
-    div = document.createElement("div");
-    div.innerHTML = "<table><script id='first'></script><tr><td>hi</td></tr><script id='last'></script></table>
-    
-    Generates the following DOM in IE:
-    
-    + div
-    + table
-    - script id='first'
-    + tbody
-    + tr
-    + td
-    - "hi"
-    - script id='last'
-    
-    Which means that the two script tags, even though they were
-    inserted at the same point in the hierarchy in the original
-    HTML, now have different parents.
-    
-    This code reparents the first script tag by making it the tbody's
-    first child.
-    ###
-    fixParentage = (start, end) ->
-      end.parentNode.insertBefore start, end.parentNode.firstChild  if start.parentNode isnt end.parentNode
-
-    htmlFunc = (html, outerToo) ->
-      
-      # get the real starting node. see realNode for details.
-      start = realNode(document.getElementById(@start))
-      end = document.getElementById(@end)
-      parentNode = end.parentNode
-      node = undefined
-      nextSibling = undefined
-      last = undefined
-      
-      # make sure that the start and end nodes share the same
-      # parent. If not, fix it.
-      fixParentage start, end
-      
-      # remove all of the nodes after the starting placeholder and
-      # before the ending placeholder.
-      node = start.nextSibling
-      while node
-        nextSibling = node.nextSibling
-        last = node is end
-        
-        # if this is the last node, and we want to remove it as well,
-        # set the `end` node to the next sibling. This is because
-        # for the rest of the function, we insert the new nodes
-        # before the end (note that insertBefore(node, null) is
-        # the same as appendChild(node)).
-        #
-        # if we do not want to remove it, just break.
-        if last
-          if outerToo
-            end = node.nextSibling
-          else
-            break
-        node.parentNode.removeChild node
-        
-        # if this is the last node and we didn't break before
-        # (because we wanted to remove the outer nodes), break
-        # now.
-        break  if last
-        node = nextSibling
-      
-      # get the first node for the HTML string, even in cases like
-      # tables and lists where a simple innerHTML on a div would
-      # swallow some of the content.
-      node = firstNodeFor(start.parentNode, html)
-      
-      # copy the nodes for the HTML between the starting and ending
-      # placeholder.
-      while node
-        nextSibling = node.nextSibling
-        parentNode.insertBefore node, end
-        node = nextSibling
-
-    
-    # remove the nodes in the DOM representing this metamorph.
-    #
-    # this includes the starting and ending placeholders.
-    removeFunc = ->
-      start = realNode(document.getElementById(@start))
-      end = document.getElementById(@end)
-      @html ""
-      start.parentNode.removeChild start
-      end.parentNode.removeChild end
-
-    appendToFunc = (parentNode) ->
-      node = firstNodeFor(parentNode, @outerHTML())
-      nextSibling = undefined
-      while node
-        nextSibling = node.nextSibling
-        parentNode.appendChild node
-        node = nextSibling
-
-    afterFunc = (html) ->
-      
-      # get the real starting node. see realNode for details.
-      end = document.getElementById(@end)
-      insertBefore = end.nextSibling
-      parentNode = end.parentNode
-      nextSibling = undefined
-      node = undefined
-      
-      # get the first node for the HTML string, even in cases like
-      # tables and lists where a simple innerHTML on a div would
-      # swallow some of the content.
-      node = firstNodeFor(parentNode, html)
-      
-      # copy the nodes for the HTML between the starting and ending
-      # placeholder.
-      while node
-        nextSibling = node.nextSibling
-        parentNode.insertBefore node, insertBefore
-        node = nextSibling
-
-    prependFunc = (html) ->
-      start = document.getElementById(@start)
-      parentNode = start.parentNode
-      nextSibling = undefined
-      node = undefined
-      node = firstNodeFor(parentNode, html)
-      insertBefore = start.nextSibling
-      while node
-        nextSibling = node.nextSibling
-        parentNode.insertBefore node, insertBefore
-        node = nextSibling
-  Metamorph::html = (html) ->
-    @checkRemoved()
-    return @innerHTML  if html is `undefined`
-    htmlFunc.call this, html
-    @innerHTML = html
-
-  Metamorph::replaceWith = (html) ->
-    @checkRemoved()
-    htmlFunc.call this, html, true
-
-  Metamorph::remove = removeFunc
-  Metamorph::outerHTML = outerHTMLFunc
-  Metamorph::appendTo = appendToFunc
-  Metamorph::after = afterFunc
-  Metamorph::prepend = prependFunc
-  Metamorph::startTag = startTagFunc
-  Metamorph::endTag = endTagFunc
-  Metamorph::isRemoved = ->
-    before = document.getElementById(@start)
-    after = document.getElementById(@end)
-    not before or not after
-
-  Metamorph::checkRemoved = ->
-    throw new Error("Cannot perform operations on a Metamorph that is not in the DOM.")  if @isRemoved()
-
-  window.Metamorph = Metamorph
-) this