kiteditor 1.0.12 → 1.0.13

data/{app → vendor}/assets/javascripts/mercury/page_editor.js.coffee

@@ -3,14 +3,13 @@ class @Mercury.PageEditor
   # options
   # saveStyle: 'form', or 'json' (defaults to json)
   # saveDataType: 'xml', 'json', 'jsonp', 'script', 'text', 'html' (defaults to json)
-  # saveMethod: 'POST', or 'PUT', create or update actions on save (defaults to PUT)
+  # saveMethod: 'POST', or 'PUT', create or update actions on save (defaults to POST)
   # visible: boolean, if the interface should start visible or not (defaults to true)
   constructor: (@saveUrl = null, @options = {}) ->
     throw Mercury.I18n('Mercury.PageEditor can only be instantiated once.') if window.mercuryInstance
 
-    @options.visible = true unless (@options.visible == false || @options.visible == 'false')
+    @options.visible = true unless (@options.visible == false || @options.visible == 'no')
     @visible = @options.visible
-    @options.saveDataType = 'json' unless (@options.saveDataType == false || @options.saveDataType)
 
     window.mercuryInstance = @
     @regions = []
@@ -21,28 +20,25 @@ class @Mercury.PageEditor
   initializeInterface: ->
     @focusableElement = jQuery('<input>', {class: 'mercury-focusable', type: 'text'}).appendTo(@options.appendTo ? 'body')
 
-    @iframe = jQuery('<iframe>', {id: 'mercury_iframe', name: 'mercury_iframe', class: 'mercury-iframe', frameborder: '0', src: 'about:blank'})
+    @iframe = jQuery('<iframe>', {id: 'mercury_iframe', class: 'mercury-iframe', seamless: 'true', frameborder: '0', src: 'about:blank'})
     @iframe.appendTo(jQuery(@options.appendTo).get(0) ? 'body')
 
-    @toolbar = new Mercury.Toolbar(jQuery.extend(true, {}, @options, @options.toolbarOptions))
-    @statusbar = new Mercury.Statusbar(jQuery.extend(true, {}, @options, @options.statusbarOptions))
+    @toolbar = new Mercury.Toolbar(@options)
+    @statusbar = new Mercury.Statusbar(@options)
     @resize()
 
-    @iframe.one 'load', => @bindEvents()
     @iframe.on 'load', => @initializeFrame()
-    @loadIframeSrc(null)
+    @iframe.get(0).contentWindow.document.location.href = @iframeSrc(null, true)
 
 
   initializeFrame: ->
     try
       return if @iframe.data('loaded')
       @iframe.data('loaded', true)
-
-      # set document reference of iframe
+      Mercury.notify("Opera isn't a fully supported browser, your results may not be optimal.") if jQuery.browser.opera
       @document = jQuery(@iframe.get(0).contentWindow.document)
-
-      # inject styles for document to be able to highlight regions and other tools
-      jQuery("<style mercury-styles=\"true\">").html(Mercury.config.injectedStyles).appendTo(@document.find('head'))
+      stylesToInject = Mercury.config.injectedStyles.replace(/{{regionClass}}/g, Mercury.config.regions.className)
+      jQuery("<style mercury-styles=\"true\">").html(stylesToInject).appendTo(@document.find('head'))
 
       # jquery: make jQuery evaluate scripts within the context of the iframe window
       iframeWindow = @iframe.get(0).contentWindow
@@ -51,15 +47,12 @@ class @Mercury.PageEditor
       iframeWindow.Mercury = Mercury
       iframeWindow.History = History if window.History && History.Adapter
 
-      # (re) initialize the editor against the new document
-      @bindDocumentEvents()
+      @bindEvents()
       @resize()
       @initializeRegions()
       @finalizeInterface()
-
-      # trigger ready events
       Mercury.trigger('ready')
-      iframeWindow.jQuery(iframeWindow).trigger('mercury:ready') if iframeWindow.jQuery
+      jQuery(iframeWindow).trigger('mercury:ready')
       iframeWindow.Event.fire(iframeWindow, 'mercury:ready') if iframeWindow.Event && iframeWindow.Event.fire
       iframeWindow.onMercuryReady() if iframeWindow.onMercuryReady
 
@@ -70,8 +63,8 @@ class @Mercury.PageEditor
 
   initializeRegions: ->
     @regions = []
-    @buildRegion(jQuery(region)) for region in jQuery("[#{Mercury.config.regions.attribute}]", @document)
-    return unless @visible
+    @buildRegion(jQuery(region)) for region in jQuery(".#{Mercury.config.regions.className}", @document)
+    return unless @options.visible
     for region in @regions
       if region.focus
         region.focus()
@@ -82,7 +75,11 @@ class @Mercury.PageEditor
     if region.data('region')
       region = region.data('region')
     else
-      type = (region.attr(Mercury.config.regions.attribute) || Mercury.config.regions.determineType?(region) || 'unknown').titleize()
+      type = (
+        region.data('type') ||
+        ( jQuery.type(Mercury.config.regions.determineType) == 'function' && Mercury.config.regions.determineType(region) ) ||
+        'unknown'
+      ).titleize()
       throw Mercury.I18n('Region type is malformed, no data-type provided, or "%s" is unknown for the "%s" region.', type, region.attr('id') || 'unknown') if type == 'Unknown' || !Mercury.Regions[type]
       if !Mercury.Regions[type].supported
         Mercury.notify('Mercury.Regions.%s is unsupported in this client. Supported browsers are %s.', type, Mercury.Regions[type].supportedText)
@@ -93,46 +90,43 @@ class @Mercury.PageEditor
 
 
   finalizeInterface: ->
-    @santizerElement = jQuery('<div>', {id: 'mercury_sanitizer', contenteditable: 'true', style: 'position:fixed;width:100px;height:100px;min-width:0;top:0;left:-100px;opacity:0;overflow:hidden'})
+    @santizerElement = jQuery('<div>', {id: 'mercury_sanitizer', contenteditable: 'true', style: 'position:fixed;width:100px;height:100px;top:0;left:-100px;opacity:0;overflow:hidden'})
     @santizerElement.appendTo(@options.appendTo ? @document.find('body'))
 
-    @snippetToolbar.release() if @snippetToolbar
     @snippetToolbar = new Mercury.SnippetToolbar(@document)
 
     @hijackLinksAndForms()
-    Mercury.trigger('mode', {mode: 'preview'}) unless @visible
-
-
-  bindDocumentEvents: ->
-    @document.on 'mousedown', (event) ->
-      Mercury.trigger('hide:dialogs')
-      if Mercury.region
-        Mercury.trigger('unfocus:regions') unless jQuery(event.target).closest("[#{Mercury.config.regions.attribute}]").get(0) == Mercury.region.element.get(0)
-
-    jQuery(@document).bind 'keydown', (event) =>
-      return unless event.ctrlKey || event.metaKey
-      if (event.keyCode == 83) # meta+S
-        Mercury.trigger('action', {action: 'save'})
-        event.preventDefault()
+    Mercury.trigger('mode', {mode: 'preview'}) unless @options.visible
 
 
   bindEvents: ->
     Mercury.on 'autosave', =>  @autosave()
-    Mercury.on 'initialize:frame', => setTimeout(@initializeFrame, 100)
+    Mercury.on 'initialize:frame', => setTimeout(100, @initializeFrame)
     Mercury.on 'focus:frame', => @iframe.focus()
-    Mercury.on 'focus:window', => setTimeout((=> @focusableElement.focus()), 10)
+    Mercury.on 'focus:window', => setTimeout(10, => @focusableElement.focus())
     Mercury.on 'toggle:interface', => @toggleInterface()
     Mercury.on 'reinitialize', => @initializeRegions()
     Mercury.on 'mode', (event, options) => @previewing = !@previewing if options.mode == 'preview'
     Mercury.on 'action', (event, options) =>
       action = Mercury.config.globalBehaviors[options.action] || @[options.action]
       return unless typeof(action) == 'function'
-      event.preventDefault()
+      options.already_handled = true
       action.call(@, options)
 
+    @document.on 'mousedown', (event) ->
+      Mercury.trigger('hide:dialogs')
+      if Mercury.region
+        Mercury.trigger('unfocus:regions') unless jQuery(event.target).closest(".#{Mercury.config.regions.className}").get(0) == Mercury.region.element.get(0)
+
     jQuery(window).on 'resize', =>
       @resize()
 
+    jQuery(@document).bind 'keydown', (event) =>
+      return unless event.ctrlKey || event.metaKey
+      if (event.keyCode == 83) # meta+S
+        Mercury.trigger('action', {action: 'save'})
+        event.preventDefault()
+
     jQuery(window).bind 'keydown', (event) =>
       return unless event.ctrlKey || event.metaKey
       if (event.keyCode == 83) # meta+S
@@ -144,25 +138,22 @@ class @Mercury.PageEditor
 
   toggleInterface: ->
     if @visible
+      Mercury.trigger('mode', {mode: 'preview'}) if @previewing
       @visible = false
       @toolbar.hide()
       @statusbar.hide()
-      Mercury.trigger('mode', {mode: 'preview'}) unless @previewing
-      @previewing = true
-      @resize()
     else
       @visible = true
-      @iframe.animate({top: @toolbar.height(true)}, 200, 'easeInOutSine', => @resize())
       @toolbar.show()
       @statusbar.show()
-      Mercury.trigger('mode', {mode: 'preview'})
-      @previewing = false
+    Mercury.trigger('mode', {mode: 'preview'})
+    @resize()
 
 
   resize: ->
     width = jQuery(window).width()
     height = @statusbar.top()
-    toolbarHeight = @toolbar.top() + @toolbar.height()
+    toolbarHeight = @toolbar.height()
 
     Mercury.displayRect = {top: toolbarHeight, left: 0, width: width, height: height - toolbarHeight, fullHeight: height}
 
@@ -176,25 +167,14 @@ class @Mercury.PageEditor
 
 
   iframeSrc: (url = null, params = false) ->
-    # remove the /editor segment of the url if it gets passed through
     url = (url ? window.location.href).replace(Mercury.config.editorUrlRegEx ?= /([http|https]:\/\/.[^\/]*)\/editor\/?(.*)/i,  "$1/$2")
-    url = url.replace(/[\?|\&]mercury_frame=true/gi, '').replace(/\&_=\d+/gi, '').replace(/#$/, '')
+    url = url.replace(/[\?|\&]mercury_frame=true/gi, '')
     if params
-      # add a param allowing the server to know that the request is coming from mercury
-      # and add a cache busting param so we don't get stale content
-      return "#{url}#{if url.indexOf('?') > -1 then '&' else '?'}mercury_frame=true&_=#{new Date().getTime()}"
+      return "#{url}#{if url.indexOf('?') > -1 then '&' else '?'}mercury_frame=true"
     else
       return url
 
 
-  loadIframeSrc: (url)->
-    # clear any existing events if we are loading a new iframe to replace the existing one
-    @document.off() if @document
-
-    @iframe.data('loaded', false)
-    @iframe.get(0).contentWindow.document.location.href = @iframeSrc(url, true)
-
-
   hijackLinksAndForms: ->
     for element in jQuery('a, form', @document)
       ignored = false
@@ -202,7 +182,7 @@ class @Mercury.PageEditor
         if jQuery(element).hasClass(classname)
           ignored = true
           continue
-      if !ignored && (element.target == '' || element.target == '_self') && !jQuery(element).closest("[#{Mercury.config.regions.attribute}]").length
+      if !ignored && (element.target == '' || element.target == '_self') && !jQuery(element).closest(".#{Mercury.config.regions.className}").length
         jQuery(element).attr('target', '_parent')
 
 
@@ -234,35 +214,22 @@ class @Mercury.PageEditor
     }
 
   save: (callback) ->
-    url = @saveUrl ? Mercury.saveUrl ? @iframeSrc()
+    url = @saveUrl ? Mercury.saveURL ? @iframeSrc()
     data = @serialize()
-    data = {content: data}
-
-    if @options.saveMethod == 'POST'
-      method = 'POST'
-    else
-      method = 'PUT'
-      data['_method'] = method
-
     Mercury.log('saving', data)
-
-    options = {
+    data = jQuery.toJSON(data) unless @options.saveStyle == 'form'
+    method = 'PUT' if @options.saveMethod == 'PUT'
+    jQuery.ajax url, {
       headers: Mercury.ajaxHeaders()
-      type: method
-      dataType: @options.saveDataType
-      data: data
-      success: (response) =>
+      type: method || 'POST'
+      data: {content: data, _method: method}
+      success: =>
         Mercury.changes = false
-        Mercury.trigger('saved', response)
+        Mercury.trigger('saved')
         callback() if typeof(callback) == 'function'
-      error: (response) =>
-        Mercury.trigger('save_failed', response)
+      error: =>
         Mercury.notify('Mercury was unable to save to the url: %s', url)
     }
-    if @options.saveStyle != 'form'
-      options['data'] = jQuery.toJSON(data)
-      options['contentType'] = 'application/json'
-    jQuery.ajax url, options
 
 
   serialize: ->
@@ -271,4 +238,3 @@ class @Mercury.PageEditor
       Mercury.log("region", region)
       serialized[region.name] = region.serialize() 
     return serialized
-

data/{app → vendor}/assets/javascripts/mercury/palette.js.coffee

@@ -16,7 +16,7 @@ class @Mercury.Palette extends Mercury.Dialog
 
   position: (keepVisible) ->
     @element.css({top: 0, left: 0, display: 'block', visibility: 'hidden'})
-    position = @button.position()
+    position = @button.offset()
     width = @element.width()
 
     position.left = position.left - width + @button.width() if position.left + width > jQuery(window).width()

data/{app → vendor}/assets/javascripts/mercury/panel.js.coffee

@@ -6,7 +6,7 @@ class @Mercury.Panel extends Mercury.Dialog
 
   build: ->
     @element = jQuery('<div>', {class: 'mercury-panel loading', style: 'display:none;'})
-    @titleElement = jQuery("<h1><span>#{Mercury.I18n(@options.title)}</span></h1>").appendTo(@element)
+    @titleElement = jQuery("<h1>#{Mercury.I18n(@options.title)}</h1>").appendTo(@element)
     @paneElement = jQuery('<div>', {class: 'mercury-panel-pane'}).appendTo(@element)
 
     if @options.closeButton
@@ -57,7 +57,6 @@ class @Mercury.Panel extends Mercury.Dialog
       @titleElement.find('.mercury-panel-close').animate({opacity: 1}, 100)
 
       @paneElement.css({display: 'block', width: postWidth})
-      jQuery(@paneElement.find('.focusable').get(0)).focus()
       @makeDraggable()
 
     @hide() unless @visible
@@ -101,7 +100,7 @@ class @Mercury.Panel extends Mercury.Dialog
   makeDraggable: ->
     elementWidth = @element.width()
     @element.draggable {
-      handle: 'h1 span',
+      handle: 'h1',
       axis: 'x',
       opacity: 0.70
       scroll: false,

data/{app → vendor}/assets/javascripts/mercury/plugins/save_as_xml/mercury/page_editor.js.coffee

@@ -1,7 +1,7 @@
 class Mercury.PageEditor extends Mercury.PageEditor
 
   save: ->
-    url = @saveUrl ? Mercury.saveUrl ? @iframeSrc()
+    url = @saveUrl ? Mercury.saveURL ? @iframeSrc()
     data = @serializeAsXml()
     console.log('saving', data)
     return
@@ -25,4 +25,4 @@ class Mercury.PageEditor extends Mercury.PageEditor
       for snippetName, snippetProperties of regionProperties['snippets']
         snippetNodes.push("<#{snippetName} name=\"#{snippetProperties['name']}\"><![CDATA[#{jQuery.toJSON(snippetProperties['options'])}]]></#{snippetName}>")
       regionNodes.push("<region name=\"#{regionName}\" type=\"#{regionProperties['type']}\"><value>\n<![CDATA[#{regionProperties['value']}]]>\n</value><snippets>#{snippetNodes.join('')}</snippets></region>")
-    return "<regions>#{regionNodes.join('')}</regions>"
+    return "<regions>#{regionNodes.join('')}</regions>"

data/{app → vendor}/assets/javascripts/mercury/region.js.coffee

@@ -1,7 +1,10 @@
 class @Mercury.Region
+  type = 'region'
 
   constructor: (@element, @window, @options = {}) ->
-    Mercury.log("building #{@type()}", @element, @options)
+    @type = 'region' unless @type
+    Mercury.log("building #{@type}", @element, @options)
+
     @document = @window.document
     @name = @element.attr(Mercury.config.regions.identifier)
     @history = new Mercury.HistoryBuffer()
@@ -11,9 +14,6 @@ class @Mercury.Region
     @element.data('region', @)
 
 
-  type: -> 'unknown'
-
-
   build: ->
 
 
@@ -28,15 +28,15 @@ class @Mercury.Region
       @focus()
 
     Mercury.on 'action', (event, options) =>
-      return if @previewing || Mercury.region != @ || event.isDefaultPrevented()
+      return if @previewing || Mercury.region != @
       @execCommand(options.action, options) if options.action
 
     @element.on 'mousemove', (event) =>
       return if @previewing || Mercury.region != @
-      snippet = jQuery(event.target).closest('[data-snippet]')
+      snippet = jQuery(event.target).closest('.mercury-snippet')
       if snippet.length
         @snippet = snippet
-        Mercury.trigger('show:toolbar', {type: 'snippet', snippet: @snippet}) if @snippet.data('snippet')
+        Mercury.trigger('show:toolbar', {type: 'snippet', snippet: @snippet})
 
     @element.on 'mouseout', =>
       return if @previewing
@@ -48,13 +48,11 @@ class @Mercury.Region
       @element.html(value)
     else
       # sanitize the html before we return it
-      # create the element without jQuery since $el.html() executes <script> tags
-      container = document.createElement('div')
-      container.innerHTML = @element.html().replace(/^\s+|\s+$/g, '')
-      container = $(container)
+      container = jQuery('<div>').appendTo(@document.createDocumentFragment())
+      container.html(@element.html().replace(/^\s+|\s+$/g, ''))
 
       # replace snippet contents to be an identifier
-      if filterSnippets then for snippet in container.find('[data-snippet]')
+      if filterSnippets then for snippet in container.find('.mercury-snippet')
         snippet = jQuery(snippet)
         snippet.attr({contenteditable: null, 'data-version': null})
         snippet.html("[#{snippet.data('snippet')}]")
@@ -65,11 +63,11 @@ class @Mercury.Region
   togglePreview: ->
     if @previewing
       @previewing = false
-      @element.attr(Mercury.config.regions.attribute, @type())
+      @element.addClass(Mercury.config.regions.className).removeClass("#{Mercury.config.regions.className}-preview")
       @focus() if Mercury.region == @
     else
       @previewing = true
-      @element.removeAttr(Mercury.config.regions.attribute)
+      @element.addClass("#{Mercury.config.regions.className}-preview").removeClass(Mercury.config.regions.className)
       Mercury.trigger('region:blurred', {region: @})
 
 
@@ -78,7 +76,7 @@ class @Mercury.Region
     @pushHistory() unless action == 'redo'
 
     Mercury.log('execCommand', action, options.value)
-    Mercury.changes = true
+    Mercury.changes = true unless options.already_handled
 
 
   pushHistory: ->
@@ -89,19 +87,20 @@ class @Mercury.Region
     snippets = {}
     for element in @element.find('[data-snippet]')
       snippet = Mercury.Snippet.find(jQuery(element).data('snippet'))
-      continue unless snippet
+      snippet.setVersion(jQuery(element).data('version'))
       snippets[snippet.identity] = snippet.serialize()
     return snippets
 
 
   dataAttributes: ->
     data = {}
-    data[attr] = (@container || @element).attr('data-' + attr) for attr in Mercury.config.regions.dataAttributes
+    o = if @type=='simple' then jQuery(this.container[0]) else @element
+    data[attr] = o.attr('data-' + attr) for attr in Mercury.config.regions.dataAttributes
     return data
 
   serialize: ->
     return {
-      type: @type()
+      type: @type
       data: @dataAttributes()
       value: @content(null, true)
       snippets: @snippets()

data/{app/assets/javascripts/mercury/regions/full.js.coffee → vendor/assets/javascripts/mercury/regions/editable.js.coffee}

@@ -1,11 +1,12 @@
-class @Mercury.Regions.Full extends Mercury.Region
-  # No IE < 10 support because those versions don't follow the W3C standards for HTML5 contentEditable (aka designMode).
-  @supported: document.designMode && !jQuery.browser.konqueror && (!jQuery.browser.msie || (jQuery.browser.msie && parseFloat(jQuery.browser.version, 10) >= 10))
-  @supportedText: "Chrome 10+, Firefox 4+, Safari 5+, Opera 11.64+"
-  type = 'full'
-  type: -> type
+class @Mercury.Regions.Editable extends Mercury.Region
+  # No IE support yet because it doesn't follow the W3C standards for HTML5 contentEditable (aka designMode).
+  @supported: document.designMode && !jQuery.browser.konqueror && !jQuery.browser.msie
+  @supportedText: "Chrome 10+, Firefox 4+, Safari 5+"
+
+  type = 'editable'
 
   constructor: (@element, @window, @options = {}) ->
+    @type = 'editable'
     super
 
 
@@ -25,7 +26,7 @@ class @Mercury.Regions.Full extends Mercury.Region
     @element.get(0).contentEditable = true
 
     # make all snippets not editable, and set their versions to 1
-    for element in @element.find('[data-snippet]')
+    for element in @element.find('.mercury-snippet')
       element.contentEditable = false
       jQuery(element).attr('data-version', '1')
 
@@ -46,7 +47,7 @@ class @Mercury.Regions.Full extends Mercury.Region
 
     Mercury.on 'region:update', =>
       return if @previewing || Mercury.region != @
-      setTimeout((=> @selection().forceSelection(@element.get(0))), 1)
+      setTimeout(1, => @selection().forceSelection(@element.get(0)))
       currentElement = @currentElement()
       if currentElement.length
         # setup the table editor if we're inside a table
@@ -68,17 +69,16 @@ class @Mercury.Regions.Full extends Mercury.Region
       return if @previewing
       event.preventDefault() unless Mercury.snippet
       event.originalEvent.dataTransfer.dropEffect = 'copy'
-      # removed to fix chrome update issue #362 https://github.com/jejacks0n/mercury/issues/362
-      # if jQuery.browser.webkit
-        # clearTimeout(@dropTimeout)
-        # @dropTimeout = setTimeout((=> @element.trigger('possible:drop')), 10)
+      if jQuery.browser.webkit
+        clearTimeout(@dropTimeout)
+        @dropTimeout = setTimeout(10, => @element.trigger('possible:drop'))
 
     @element.on 'drop', (event) =>
       return if @previewing
 
       # handle dropping snippets
       clearTimeout(@dropTimeout)
-      @dropTimeout = setTimeout((=> @element.trigger('possible:drop')), 1)
+      @dropTimeout = setTimeout(1, => @element.trigger('possible:drop'))
 
       # handle any files that were dropped
       return unless event.originalEvent.dataTransfer.files.length
@@ -93,9 +93,9 @@ class @Mercury.Regions.Full extends Mercury.Region
     # read: http://www.quirksmode.org/blog/archives/2009/09/the_html5_drag.html
     @element.on 'possible:drop', =>
       return if @previewing
-      if Mercury.snippet
+      if snippet = @element.find('img[data-snippet]').get(0)
         @focus()
-        Mercury.Snippet.displayOptionsFor(Mercury.snippet.name, {}, Mercury.snippet.hasOptions)
+        Mercury.Snippet.displayOptionsFor(jQuery(snippet).data('snippet'))
         @document.execCommand('undo', false, null)
 
     # custom paste handling: we have to do some hackery to get the pasted content since it's not exposed normally
@@ -115,7 +115,7 @@ class @Mercury.Regions.Full extends Mercury.Region
     @element.on 'focus', =>
       return if @previewing
       Mercury.region = @
-      setTimeout((=> @selection().forceSelection(@element.get(0))), 1)
+      setTimeout(1, => @selection().forceSelection(@element.get(0)))
       Mercury.trigger('region:focused', {region: @})
 
     @element.on 'blur', =>
@@ -194,13 +194,13 @@ class @Mercury.Regions.Full extends Mercury.Region
 
   focus: ->
     if Mercury.region != @
-      setTimeout((=> @element.focus()), 10)
+      setTimeout(10, => @element.focus())
       try
         @selection().selection.collapseToStart()
       catch e
         # intentially do nothing
     else
-      setTimeout((=> @element.focus()), 10)
+      setTimeout(10, => @element.focus())
 
     Mercury.trigger('region:focused', {region: @})
     Mercury.trigger('region:update', {region: @})
@@ -217,9 +217,7 @@ class @Mercury.Regions.Full extends Mercury.Region
         element.contentEditable = false
         element = jQuery(element)
         if snippet = Mercury.Snippet.find(element.data('snippet'))
-          if element.data('version')
-            snippet.setVersion(element.data('version'))
-          else
+          unless element.data('version')
             try
               version = parseInt(element.html().match(/\/(\d+)\]/)[1])
               if version
@@ -279,7 +277,7 @@ class @Mercury.Regions.Full extends Mercury.Region
     super
 
     # use a custom handler if there's one, otherwise use execCommand
-    if handler = Mercury.config.behaviors[action] || Mercury.Regions.Full.actions[action]
+    if handler = Mercury.config.behaviors[action] || Mercury.Regions.Editable.actions[action]
       handler.call(@, @selection(), options)
     else
       sibling = @element.get(0).previousSibling if action == 'indent'
@@ -310,7 +308,7 @@ class @Mercury.Regions.Full extends Mercury.Region
       @history.push(@content(null, false, true))
     else if keyCode
       # set a timeout for pushing to the history
-      @historyTimeout = setTimeout((=> @history.push(@content(null, false, true))), waitTime * 1000)
+      @historyTimeout = setTimeout(waitTime * 1000, => @history.push(@content(null, false, true)))
     else
       # push to the history immediately
       @history.push(@content(null, false, true))
@@ -319,7 +317,7 @@ class @Mercury.Regions.Full extends Mercury.Region
 
 
   selection: ->
-    return new Mercury.Regions.Full.Selection(@window.getSelection(), @document)
+    return new Mercury.Regions.Editable.Selection(@window.getSelection(), @document)
 
 
   path: ->
@@ -351,7 +349,7 @@ class @Mercury.Regions.Full extends Mercury.Region
       sanitizer = jQuery('#mercury_sanitizer', @document).focus()
 
       # set 1ms timeout to allow paste event to complete
-      setTimeout =>
+      setTimeout 1, =>
         # sanitize the content
         content = @sanitize(sanitizer)
 
@@ -362,13 +360,11 @@ class @Mercury.Regions.Full extends Mercury.Region
         # paste sanitized content
         @element.focus()
         @execCommand('insertHTML', {value: content})
-      , 1
 
 
   sanitize: (sanitizer) ->
     # always remove nested regions
-    sanitizer.find("[#{Mercury.config.regions.attribute}]").remove()
-    sanitizer.find('[src*="webkit-fake-url://"]').remove()
+    sanitizer.find(".#{Mercury.config.regions.className}").remove()
 
     if Mercury.config.pasting.sanitize
       switch Mercury.config.pasting.sanitize
@@ -426,7 +422,7 @@ class @Mercury.Regions.Full extends Mercury.Region
 
     redo: -> @content(@history.redo())
 
-    horizontalRule: -> @execCommand('insertHTML', {value: '<hr/>'})
+    horizontalRule: -> this.execCommand('insertHorizontalRule')
 
     removeFormatting: (selection) -> selection.insertTextNode(selection.textContent())
 
@@ -470,7 +466,7 @@ class @Mercury.Regions.Full extends Mercury.Region
 
 
 # Helper class for managing selection and getting information from it
-class Mercury.Regions.Full.Selection
+class Mercury.Regions.Editable.Selection
 
   constructor: (@selection, @context) ->
     return unless @selection.rangeCount >= 1
@@ -494,13 +490,7 @@ class Mercury.Regions.Full.Selection
 
 
   textContent: ->
-    return @content().textContent
-
-
-  htmlContent: ->
-    content = @content()
-    return jQuery('<div>').html(content).html()
-    return null
+    return @range.cloneContents().textContent
 
 
   content: ->
@@ -518,15 +508,15 @@ class Mercury.Regions.Full.Selection
     range = @context.createRange()
 
     if @range
-      if @commonAncestor(true).closest('[data-snippet]').length
-        lastChild = @context.createTextNode("\x00")
+      if @commonAncestor(true).closest('.mercury-snippet').length
+        lastChild = @context.createTextNode('\x00')
         element.appendChild(lastChild)
     else
       if element.lastChild && element.lastChild.nodeType == 3 && element.lastChild.textContent.replace(/^[\s+|\n+]|[\s+|\n+]$/, '') == ''
         lastChild = element.lastChild
-        element.lastChild.textContent = "\x00"
+        element.lastChild.textContent = '\x00'
       else
-        lastChild = @context.createTextNode("\x00")
+        lastChild = @context.createTextNode('\x00')
         element.appendChild(lastChild)
 
     if lastChild