mercury-rails 0.2.3 → 0.3.1

data/vendor/assets/javascripts/mercury/modals/insertcharacter.js.coffee

@@ -1,4 +1,4 @@
 @Mercury.modalHandlers.insertCharacter = ->
-  @element.find('.character').click ->
-    Mercury.trigger('action', {action: 'insertHTML', value: "&#{jQuery(@).attr('data-entity')};"})
-    Mercury.modal.hide()
+  @element.find('.character').on 'click', (event) =>
+    Mercury.trigger('action', {action: 'insertHTML', value: "&#{jQuery(event.target).attr('data-entity')};"})
+    @hide()

data/vendor/assets/javascripts/mercury/modals/insertlink.js.coffee

@@ -1,13 +1,13 @@
 @Mercury.modalHandlers.insertLink = ->
   # make the inputs work with the radio buttons
-  @element.find('label input').click (event) ->
+  @element.find('label input').on 'click', ->
     jQuery(@).closest('label').next('.selectable').focus()
 
-  @element.find('.selectable').focus ->
+  @element.find('.selectable').on 'focus', ->
     jQuery(@).prev('label').find('input[type=radio]').prop("checked", true)
 
   # show/hide the link target options on target change
-  @element.find('#link_target').change =>
+  @element.find('#link_target').on 'change', =>
     @element.find(".link-target-options").hide()
     @element.find("##{@element.find('#link_target').val()}_options").show()
     @resize(true)
@@ -59,7 +59,7 @@
     @element.find('#link_text').val(selection.textContent()) if selection.textContent
 
   # build the link on form submission
-  @element.find('form').submit (event) =>
+  @element.find('form').on 'submit', (event) =>
     event.preventDefault()
 
     content = @element.find('#link_text').val()

data/vendor/assets/javascripts/mercury/modals/insertmedia.js.coffee

@@ -1,9 +1,9 @@
 @Mercury.modalHandlers.insertMedia = ->
   # make the inputs work with the radio buttons, and options
-  @element.find('label input').click (event) ->
+  @element.find('label input').on 'click', ->
     jQuery(@).closest('label').next('.selectable').focus()
 
-  @element.find('.selectable').focus (event) =>
+  @element.find('.selectable').on 'focus', (event) =>
     element = jQuery(event.target)
     element.prev('label').find('input[type=radio]').prop("checked", true)
 
@@ -19,6 +19,7 @@
     if selection.is && image = selection.is('img')
       @element.find('#media_image_url').val(image.attr('src'))
       @element.find('#media_image_alignment').val(image.attr('align'))
+      setTimeout 300, => @element.find('#media_image_url').focus()
 
     # if we're editing an iframe (assume it's a video for now)
     if selection.is && iframe = selection.is('iframe')
@@ -28,18 +29,18 @@
         @element.find('#media_youtube_url').val("http://youtu.be/#{src.match(/\/embed\/(\w+)/)[1]}")
         @element.find('#media_youtube_width').val(iframe.width())
         @element.find('#media_youtube_height').val(iframe.height())
-        @element.find('#media_youtube_url').focus()
+        setTimeout 300, => @element.find('#media_youtube_url').focus()
       else if src.indexOf('http://player.vimeo.com') > -1
         # it's a vimeo video
         @element.find('#media_vimeo_url').val("http://vimeo.com/#{src.match(/\/video\/(\w+)/)[1]}")
         @element.find('#media_vimeo_width').val(iframe.width())
         @element.find('#media_vimeo_height').val(iframe.height())
-        @element.find('#media_vimeo_url').focus()
+        setTimeout 300, => @element.find('#media_vimeo_url').focus()
+
 
   # build the image or youtube embed on form submission
-  @element.find('form').submit (event) =>
+  @element.find('form').on 'submit', (event) =>
     event.preventDefault()
-
     type = @element.find('input[name=media_type]:checked').val()
 
     switch type
@@ -51,7 +52,7 @@
       when 'youtube_url'
         url = @element.find('#media_youtube_url').val()
         unless /^http:\/\/youtu.be\//.test(url)
-          alert('Error: The provided youtube share url was invalid.')
+          Mercury.notify('Error: The provided youtube share url was invalid.')
           return
         code = url.replace('http://youtu.be/', '')
         value = jQuery('<iframe>', {
@@ -66,14 +67,14 @@
       when 'vimeo_url'
         url = @element.find('#media_vimeo_url').val()
         unless /^http:\/\/vimeo.com\//.test(url)
-          alert('Error: The provided vimeo url was invalid.')
+          Mercury.notify('Error: The provided vimeo url was invalid.')
           return
         code = url.replace('http://vimeo.com/', '')
         value = jQuery('<iframe>', {
           width: @element.find('#media_vimeo_width').val() || 400,
           height: @element.find('#media_vimeo_height').val() || 225,
           src: "http://player.vimeo.com/video/#{code}?title=1&byline=1&portrait=0&color=ffffff",
-          frameborder: 0,
+          frameborder: 0
         })
         Mercury.trigger('action', {action: 'insertHTML', value: value})
 

data/vendor/assets/javascripts/mercury/modals/insertsnippet.js.coffee

@@ -1,5 +1,5 @@
 @Mercury.modalHandlers.insertSnippet = ->
-  @element.find('form').submit (event) =>
+  @element.find('form').on 'submit', (event) =>
     event.preventDefault()
     serializedForm = @element.find('form').serializeObject()
     if Mercury.snippet

data/vendor/assets/javascripts/mercury/modals/inserttable.js.coffee

@@ -2,7 +2,7 @@
   table = @element.find('#table_display table')
 
   # make td's selectable
-  table.click (event) =>
+  table.on 'click', (event) =>
     cell = jQuery(event.target)
     table = cell.closest('table')
     table.find('.selected').removeAttr('class')
@@ -15,7 +15,7 @@
   Mercury.tableEditor(table, firstCell, ' ')
 
   # make the buttons work
-  @element.find('input.action').click (event) =>
+  @element.find('input.action').on 'click', (event) =>
     action = jQuery(event.target).attr('name')
     switch action
       when 'insertRowBefore' then Mercury.tableEditor.addRow('before')
@@ -30,26 +30,25 @@
       when 'decreaseRowspan' then Mercury.tableEditor.decreaseRowspan()
 
   # set the alignment
-  @element.find('#table_alignment').change =>
+  @element.find('#table_alignment').on 'change', =>
     table.attr({align: @element.find('#table_alignment').val()})
 
   # set the border
-  @element.find('#table_border').keyup =>
+  @element.find('#table_border').on 'keyup', =>
     table.attr({border: parseInt(@element.find('#table_border').val())})
 
   # set the cellspacing
-  @element.find('#table_spacing').keyup =>
+  @element.find('#table_spacing').on 'keyup', =>
     table.attr({cellspacing: parseInt(@element.find('#table_spacing').val())})
 
   # build the table on form submission
-  @element.find('form').submit (event) =>
+  @element.find('form').on 'submit', (event) =>
     event.preventDefault()
     table.find('.selected').removeAttr('class')
-    table.find('td, th').html(' ')
+    table.find('td, th').html('<br/>')
 
     html = jQuery('<div>').html(table).html()
     value = html.replace(/^\s+|\n/gm, '').replace(/(<\/.*?>|<table.*?>|<tbody>|<tr>)/g, '$1\n')
 
-    Mercury.trigger('action', {action: 'insertHTML', value: value})
+    Mercury.trigger('action', {action: 'insertTable', value: value})
     @hide()
-

data/vendor/assets/javascripts/mercury/native_extensions.js.coffee

@@ -3,18 +3,36 @@ String::titleize = ->
 
 
 String::toHex = ->
-  # todo: we should handle alpha as well
   return @ if @[0] == '#'
-  @replace /rgba?\((\d+)[\s|\,]?\s(\d+)[\s|\,]?\s(\d+)\)/gi, (a, r, g, b) ->
+  @replace /rgb(a)?\(([0-9|%]+)[\s|,]?\s?([0-9|%]+)[\s|,]?\s?([0-9|%]+)[\s|,]?\s?([0-9|.|%]+\s?)?\)/gi, (x, alpha, r, g, b, a) ->
     "##{parseInt(r).toHex()}#{parseInt(g).toHex()}#{parseInt(b).toHex()}"
 
 
-String::sanitizeHTML = ->
-  element = jQuery('<div>').html(@.toString())
-  element.find('style').remove()
-  content = element.text()
-  content = content.replace(/\n+/g, '<br/>').replace(/.*<!--.*-->/g, '').replace(/^(<br\/>)+|(<br\/>\s*)+$/g, '')
-  return content
+String::regExpEscape = ->
+  specials = ['/','.','*','+','?','|','(',')','[',']','{','}','\\']
+  escaped = new RegExp('(\\' + specials.join('|\\') + ')', 'g')
+  return @replace(escaped, '\\$1')
+
+
+String::printf = ->
+  chunks = @split('%')
+  result = chunks[0]
+  re = /^([sdf])([\s\S%]*)$/
+  offset = 0
+  for chunk, index in chunks
+    p = re.exec(chunk)
+    if index == 0 || !p || arguments[index] == null
+      if index > 1
+        offset += 2
+        result += "%#{chunk}"
+      continue
+    arg = arguments[(index - 1) - offset]
+    switch p[1]
+      when 's' then result += arg
+      when 'd', 'i' then result += parseInt(arg.toString(), 10)
+      when 'f' then result += parseFloat(arg)
+    result += p[2]
+  return result
 
 
 Number::toHex = ->

data/vendor/assets/javascripts/mercury/page_editor.js.coffee

@@ -6,10 +6,9 @@ class @Mercury.PageEditor
   # 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.PageEditor is unsupported in this client. Supported browsers are chrome 10+, firefix 4+, and safari 5+." unless Mercury.supported
-    throw "Mercury.PageEditor can only be instantiated once." if window.mercuryInstance
+    throw Mercury.I18n('Mercury.PageEditor can only be instantiated once.') if window.mercuryInstance
 
-    @options.visible = true unless @options.visible == false
+    @options.visible = true unless (@options.visible == false || @options.visible == 'no')
     @visible = @options.visible
 
     window.mercuryInstance = @
@@ -24,26 +23,24 @@ class @Mercury.PageEditor
     @iframe = jQuery('<iframe>', {id: 'mercury_iframe', class: 'mercury-iframe', seamless: 'true', frameborder: '0', src: 'about:blank'})
     @iframe.appendTo(jQuery(@options.appendTo).get(0) ? 'body')
 
-    @iframe.load => @initializeFrame()
-    @iframe.get(0).contentWindow.document.location.href = @iframeSrc()
-
     @toolbar = new Mercury.Toolbar(@options)
     @statusbar = new Mercury.Statusbar(@options)
+    @resize()
+
+    @iframe.on 'load', => @initializeFrame()
+    @iframe.get(0).contentWindow.document.location.href = @iframeSrc(null, true)
 
 
   initializeFrame: ->
     try
       return if @iframe.data('loaded')
       @iframe.data('loaded', true)
-      alert("Opera isn't a fully supported browser, your results may not be optimal.") if jQuery.browser.opera
+      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)
-      stylesToInject = Mercury.config.injectedStyles.replace(/{{regionClass}}/g, Mercury.config.regionClass)
+      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 -- note that this means that we
-      # can't use eval in mercury (eg. script tags in ajax responses) because it will eval in the wrong context (you can
-      # use top.Mercury though, if you keep it in mind)
-      # todo: look into `context` options for ajax as an alternative
+      # jquery: make jQuery evaluate scripts within the context of the iframe window
       iframeWindow = @iframe.get(0).contentWindow
       jQuery.globalEval = (data) -> (iframeWindow.execScript || (data) -> iframeWindow["eval"].call(iframeWindow, data))(data) if (data && /\S/.test(data))
 
@@ -61,11 +58,12 @@ class @Mercury.PageEditor
 
       @iframe.css({visibility: 'visible'})
     catch error
-      alert("Mercury.PageEditor failed to load: #{error}\n\nPlease try refreshing.")
+      Mercury.notify('Mercury.PageEditor failed to load: %s\n\nPlease try refreshing.', error)
 
 
   initializeRegions: ->
-    @buildRegion(jQuery(region)) for region in jQuery(".#{Mercury.config.regionClass}", @document)
+    @regions = []
+    @buildRegion(jQuery(region)) for region in jQuery(".#{Mercury.config.regions.className}", @document)
     return unless @options.visible
     for region in @regions
       if region.focus
@@ -74,16 +72,21 @@ class @Mercury.PageEditor
 
 
   buildRegion: (region) ->
-    try
-      type = region.data('type').titleize()
-      @regions.push(new Mercury.Regions[type](region, @iframe.get(0).contentWindow))
-    catch error
-      alert(error) if Mercury.debug
-      alert("Region type is malformed, no data-type provided, or \"#{type}\" is unknown.")
+    if region.data('region')
+      region = region.data('region')
+    else
+      type = (region.data('type') || '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)
+        return false
+      region = new Mercury.Regions[type](region, @iframe.get(0).contentWindow)
+      region.togglePreview() if @previewing
+    @regions.push(region)
 
 
   finalizeInterface: ->
-    @santizerElement = jQuery('<div>', {id: 'mercury_sanitizer', contenteditable: 'true', style: 'position:fixed;width:100px;height:100px;top:-100px;left:-100px;opacity:0'})
+    @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 = new Mercury.SnippetToolbar(@document)
@@ -93,26 +96,44 @@ class @Mercury.PageEditor
 
 
   bindEvents: ->
-    Mercury.bind 'initialize:frame', => setTimeout(@initializeFrame, 1000)
-    Mercury.bind 'focus:frame', => @iframe.focus()
-    Mercury.bind 'focus:window', => setTimeout((=> @focusableElement.focus()), 10)
+    Mercury.on 'initialize:frame', => setTimeout(100, @initializeFrame)
+    Mercury.on 'focus:frame', => @iframe.focus()
+    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'
+      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)
 
-    Mercury.bind 'toggle:interface', => @toggleInterface()
+    jQuery(window).on 'resize', =>
+      @resize()
 
-    Mercury.bind 'action', (event, options) =>
-       @save() if options.action == 'save'
+    jQuery(@document).bind 'keydown', (event) =>
+      return unless event.ctrlKey || event.metaKey
+      if (event.keyCode == 83) # meta+S
+        Mercury.trigger('action', {action: 'save'})
+        event.preventDefault()
 
-    @document.mousedown (event) ->
-      Mercury.trigger('hide:dialogs')
-      if Mercury.region
-        Mercury.trigger('unfocus:regions') unless jQuery(event.target).closest(".#{Mercury.config.regionClass}").get(0) == Mercury.region.element.get(0)
+    jQuery(window).bind 'keydown', (event) =>
+      return unless event.ctrlKey || event.metaKey
+      if (event.keyCode == 83) # meta+S
+        Mercury.trigger('action', {action: 'save'})
+        event.preventDefault()
 
-    jQuery(window).resize => @resize()
     window.onbeforeunload = @beforeUnload
 
 
   toggleInterface: ->
     if @visible
+      Mercury.trigger('mode', {mode: 'preview'}) if @previewing
       @visible = false
       @toolbar.hide()
       @statusbar.hide()
@@ -140,8 +161,13 @@ class @Mercury.PageEditor
     Mercury.trigger('resize')
 
 
-  iframeSrc: (url = null) ->
-    (url ? window.location.href).replace(/([http|https]:\/\/.[^\/]*)\/editor\/?(.*)/i, "$1/$2")
+  iframeSrc: (url = null, params = false) ->
+    url = (url ? window.location.href).replace(Mercury.config.editorUrlRegEx ?= /([http|https]:\/\/.[^\/]*)\/editor\/?(.*)/i,  "$1/$2")
+    url = url.replace(/[\?|\&]mercury_frame=true/gi, '')
+    if params
+      return "#{url}#{if url.indexOf('?') > -1 then '&' else '?'}mercury_frame=true"
+    else
+      return url
 
 
   hijackLinksAndForms: ->
@@ -151,13 +177,13 @@ class @Mercury.PageEditor
         if jQuery(element).hasClass(classname)
           ignored = true
           continue
-      if !ignored && (element.target == '' || element.target == '_self') && !jQuery(element).closest(".#{Mercury.config.regionClass}").length
-        jQuery(element).attr('target', '_top')
+      if !ignored && (element.target == '' || element.target == '_self') && !jQuery(element).closest(".#{Mercury.config.regions.className}").length
+        jQuery(element).attr('target', '_parent')
 
 
   beforeUnload: ->
     if Mercury.changes && !Mercury.silent
-      return "You have unsaved changes.  Are you sure you want to leave without saving them first?"
+      return Mercury.I18n('You have unsaved changes.  Are you sure you want to leave without saving them first?')
     return null
 
 
@@ -167,30 +193,26 @@ class @Mercury.PageEditor
     return null
 
 
-  save: ->
+  save: (callback) ->
     url = @saveUrl ? Mercury.saveURL ? @iframeSrc()
     data = @serialize()
     Mercury.log('saving', data)
     data = jQuery.toJSON(data) unless @options.saveStyle == 'form'
     method = 'PUT' if @options.saveMethod == 'PUT'
     jQuery.ajax url, {
+      headers: Mercury.ajaxHeaders()
       type: method || 'POST'
       dataType: @options.saveDataType || 'json'
-      headers: @saveHeaders()
       data: {content: data, _method: method}
       success: =>
         Mercury.changes = false
+        Mercury.trigger('saved')
+        callback() if typeof(callback) == 'function'
       error: =>
-        alert("Mercury was unable to save to the url: #{url}")
+        Mercury.notify('Mercury was unable to save to the url: %s', url)
     }
 
 
-  saveHeaders: ->
-    headers = {}
-    headers[Mercury.config.csrfHeader] = Mercury.csrfToken
-    return headers
-
-
   serialize: ->
     serialized = {}
     serialized[region.name] = region.serialize() for region in @regions

data/vendor/assets/javascripts/mercury/palette.js.coffee

@@ -10,7 +10,7 @@ class @Mercury.Palette extends Mercury.Dialog
 
 
   bindEvents: ->
-    Mercury.bind 'hide:dialogs', (event, dialog) => @hide() unless dialog == @
+    Mercury.on 'hide:dialogs', (event, dialog) => @hide() unless dialog == @
     super
 
 

data/vendor/assets/javascripts/mercury/panel.js.coffee

@@ -6,20 +6,34 @@ class @Mercury.Panel extends Mercury.Dialog
 
   build: ->
     @element = jQuery('<div>', {class: 'mercury-panel loading', style: 'display:none;'})
-    @titleElement = jQuery("<h1>#{@options.title}</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
+      jQuery('<a/>', {class: 'mercury-panel-close'}).appendTo(@titleElement).css({opacity: 0})
+
     @element.appendTo(jQuery(@options.appendTo).get(0) ? 'body')
 
 
   bindEvents: ->
-    Mercury.bind 'resize', => @position(@visible)
-    Mercury.bind 'hide:panels', (event, panel) =>
-      unless panel == @
-        @button.removeClass('pressed')
-        @hide()
+    Mercury.on 'resize', => @position(@visible)
+
+    Mercury.on 'hide:panels', (event, panel) =>
+      return if panel == @
+      @button.removeClass('pressed')
+      @hide()
+
+    @titleElement.find('.mercury-panel-close').on 'click', (event) ->
+      event.preventDefault()
+      Mercury.trigger('hide:panels')
 
-    @element.mousedown (event) -> event.stopPropagation()
+    @element.on 'mousedown', (event) ->
+      event.stopPropagation()
+
+    @element.on 'ajax:beforeSend', (event, xhr, options) =>
+      options.success = (content) =>
+        @loadContent(content)
+        @resize()
 
     super
 
@@ -30,6 +44,7 @@ class @Mercury.Panel extends Mercury.Dialog
 
 
   resize: ->
+    @titleElement.find('.mercury-panel-close').css({opacity: 0})
     @paneElement.css({display: 'none'})
     preWidth = @element.width()
 
@@ -39,6 +54,8 @@ class @Mercury.Panel extends Mercury.Dialog
     @paneElement.css({visibility: 'visible', display: 'none'})
     position = @element.offset()
     @element.animate {left: position.left - (postWidth - preWidth), width: postWidth}, 200, 'easeInOutSine', =>
+      @titleElement.find('.mercury-panel-close').animate({opacity: 1}, 100)
+
       @paneElement.css({display: 'block', width: postWidth})
       @makeDraggable()
 
@@ -77,6 +94,7 @@ class @Mercury.Panel extends Mercury.Dialog
     @element.removeClass('loading')
     @paneElement.css({visibility: 'hidden'})
     @paneElement.html(data)
+    @paneElement.localize(Mercury.locale()) if Mercury.config.localization.enabled
 
 
   makeDraggable: ->