kiteditor 1.0.1

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

@@ -0,0 +1,109 @@
+# ## Require all the dependencies
+#= require mercury/dependencies/jquery-ui-1.8.18.custom.min
+#= require mercury/dependencies/jquery.additions
+#= require mercury/dependencies/jquery.htmlClean
+#= require mercury/dependencies/liquidmetal
+#= require mercury/dependencies/showdown
+#
+# ## Require all mercury files
+#= require_self
+#= require ./native_extensions
+#= require ./page_editor
+#= require ./history_buffer
+#= require ./table_editor
+#= require ./dialog
+#= require ./palette
+#= require ./select
+#= require ./panel
+#= require ./modal
+#= require ./lightview
+#= require ./statusbar
+#= require ./toolbar
+#= require ./toolbar.button
+#= require ./toolbar.button_group
+#= require ./toolbar.expander
+#= require ./tooltip
+#= require ./snippet
+#= require ./snippet_toolbar
+#= require ./region
+#= require ./uploader
+#= require_tree ./regions
+#= require_tree ./dialogs
+#= require_tree ./modals
+#= require ./finalize
+#
+@Mercury ||= {}
+jQuery.extend @Mercury,
+  version: '0.3.0'
+
+  # Mercury object namespaces
+  Regions: Mercury.Regions || {}
+  modalHandlers: Mercury.modalHandlers || {}
+  lightviewHandlers: Mercury.lightviewHandlers || {}
+  dialogHandlers: Mercury.dialogHandlers || {}
+  preloadedViews: Mercury.preloadedViews || {}
+
+  # Custom ajax headers
+  ajaxHeaders: ->
+    headers = {}
+    headers[Mercury.config.csrfHeader] = Mercury.csrfToken
+    return headers
+
+
+  # Custom event methods
+  on: (eventName, callback) ->
+    jQuery(window).on("mercury:#{eventName}", callback)
+
+
+  trigger: (eventName, options) ->
+    Mercury.log(eventName, options)
+    jQuery(window).trigger("mercury:#{eventName}", options)
+
+
+  # Alerting and logging methods
+  notify: (args...) ->
+    window.alert(Mercury.I18n.apply(@, args))
+
+
+  warn: (message, severity = 0) ->
+    if console
+      try console.warn(message)
+      catch e1
+        if severity >= 1
+          try console.debug(message) catch e2
+    else if severity >= 1
+      Mercury.notify(message)
+
+
+  deprecated: (message)->
+    message = "#{message} -- #{console.trace()}" if console && console.trace
+    #throw "deprecated: #{message}"
+    Mercury.warn("deprecated: #{message}", 1)
+
+
+  log: ->
+    if Mercury.debug && console
+      return if arguments[0] == 'hide:toolbar' || arguments[0] == 'show:toolbar'
+      try console.debug(arguments)
+      catch e
+
+
+  # I18n / Translation methods
+  locale: ->
+    return Mercury.determinedLocale if Mercury.determinedLocale
+    if Mercury.config.localization.enabled
+      locale = []
+      if navigator.language && (locale = navigator.language.toString().split('-')).length
+        topLocale = Mercury.I18n[locale[0]] || {}
+        subLocale = if locale.length > 1 then topLocale["_#{locale[1].toUpperCase()}_"]
+      if !Mercury.I18n[locale[0]]
+        locale = Mercury.config.localization.preferredLocale.split('-')
+        topLocale = Mercury.I18n[locale[0]] || {}
+        subLocale = if locale.length > 1 then topLocale["_#{locale[1].toUpperCase()}_"]
+    return Mercury.determinedLocale = {top: topLocale || {}, sub: subLocale || {}}
+
+
+  I18n: (sourceString, args...) ->
+    locale = Mercury.locale()
+    translation = (locale.sub[sourceString] || locale.top[sourceString] || sourceString || '').toString()
+    return if args.length then translation.printf.apply(translation, args) else translation

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

@@ -0,0 +1,204 @@
+@Mercury.modal = (url, options = {}) ->
+  Mercury.modal.show(url, options)
+  return Mercury.modal
+
+jQuery.extend Mercury.modal,
+  minWidth: 500
+
+  show: (@url, @options = {}) ->
+    Mercury.trigger('focus:window')
+    @initialize()
+    if @visible then @update() else @appear()
+    if @options.content
+      setTimeout 500, => @loadContent(@options.content)
+
+
+  initialize: ->
+    return if @initialized
+    @build()
+    @bindEvents()
+    @initialized = true
+
+
+  build: ->
+    @element = jQuery('<div>', {class: 'mercury-modal loading'})
+    @element.html('<h1 class="mercury-modal-title"><span></span><a>&times;</a></h1>')
+    @element.append('<div class="mercury-modal-content-container"><div class="mercury-modal-content"></div></div>')
+
+    @overlay = jQuery('<div>', {class: 'mercury-modal-overlay'})
+
+    @titleElement = @element.find('.mercury-modal-title')
+    @contentContainerElement = @element.find('.mercury-modal-content-container')
+    
+    @contentElement = @element.find('.mercury-modal-content')
+
+    @element.appendTo(jQuery(@options.appendTo).get(0) ? 'body')
+    @overlay.appendTo(jQuery(@options.appendTo).get(0) ? 'body')
+
+
+  bindEvents: ->
+    Mercury.on 'refresh', => @resize(true)
+    Mercury.on 'resize', => @position()
+
+    @overlay.on 'click', =>
+      @hide() if @options.allowHideUsingOverlay
+
+    @titleElement.find('a').on 'click', =>
+      @hide()
+
+    @element.on 'ajax:beforeSend', (event, xhr, options) =>
+      options.success = (content) =>
+        @loadContent(content)
+
+    jQuery(document).on 'keydown', (event) =>
+       @hide() if event.keyCode == 27 && @visible
+
+
+  appear: ->
+    @showing = true
+    @position()
+
+    @overlay.show()
+    @overlay.animate {opacity: 1}, 200, 'easeInOutSine', =>
+      @element.css({top: -@element.height()})
+      @setTitle()
+      @element.show()
+      @element.animate {top: 0}, 200, 'easeInOutSine', =>
+        @visible = true
+        @showing = false
+        @load()
+
+
+  set_height: (height) ->
+    @fix_height = height
+    this.resize(true)
+
+  resize: (keepVisible) ->
+    visibility = if keepVisible then 'visible' else 'hidden'
+
+    titleHeight = @titleElement.outerHeight()
+
+    width = @contentElement.outerWidth()
+
+    @contentPane.css({height: 'auto'}) if @contentPane
+    @contentElement.css({height: 'auto', visibility: visibility, display: 'block'})
+
+    height = @contentElement.outerHeight() + titleHeight
+
+    width = @minWidth if width < @minWidth
+    height = Mercury.displayRect.fullHeight - 20 if height > Mercury.displayRect.fullHeight - 20 || @options.fullHeight
+    if @fix_height
+      height = @fix_height
+
+    @element.stop().animate {left: (Mercury.displayRect.width - width) / 2, width: width, height: height}, 200, 'easeInOutSine', =>
+      @contentElement.css({visibility: 'visible', display: 'block'})
+      if @contentPane.length
+        @contentElement.css({height: height - titleHeight, overflow: 'visible'})
+        controlHeight = if @contentControl.length then @contentControl.outerHeight() else 0
+        @contentPane.css({height: height - titleHeight - controlHeight - 40})
+        @contentPane.find('.mercury-display-pane').css({width: width - 40})
+      else
+        @contentElement.css({height: height - titleHeight, overflow: 'auto'})
+
+
+  position: ->
+    viewportWidth = Mercury.displayRect.width
+
+    @contentPane.css({height: 'auto'}) if @contentPane
+    @contentElement.css({height: 'auto'})
+    @element.css({width: 'auto', height: 'auto', display: 'block', visibility: 'hidden'})
+
+    width = @element.width()
+    height = @element.height()
+
+    width = @minWidth if width < @minWidth
+    height = Mercury.displayRect.fullHeight - 20 if height > Mercury.displayRect.fullHeight - 20 || @options.fullHeight
+
+    titleHeight = @titleElement.outerHeight()
+    if @contentPane && @contentPane.length
+      @contentElement.css({height: height - titleHeight, overflow: 'visible'})
+      controlHeight = if @contentControl.length then @contentControl.outerHeight() else 0
+      @contentPane.css({height: height - titleHeight - controlHeight - 40})
+      @contentPane.find('.mercury-display-pane').css({width: width - 40})
+    else
+      @contentElement.css({height: height - titleHeight, overflow: 'auto'})
+
+    @element.css {
+      left: (viewportWidth - width) / 2
+      width: width
+      height: height
+      display: if @visible then 'block' else 'none'
+      visibility: 'visible'
+    }
+
+
+  update:  ->
+    @reset()
+    @resize()
+    @load()
+
+
+  load: ->
+    @setTitle()
+    return unless @url
+    @element.addClass('loading')
+    if Mercury.preloadedViews[@url]
+      setTimeout(10, => @loadContent(Mercury.preloadedViews[@url]))
+    else
+      jQuery.ajax @url, {
+        headers: Mercury.ajaxHeaders()
+        type: @options.loadType || 'GET'
+        data: @options.loadData
+        success: (data) => @loadContent(data)
+        error: =>
+          @hide()
+          Mercury.notify("Mercury was unable to load %s for the modal.", @url)
+      }
+
+
+  loadContent: (data, options = null) ->
+    @initialize()
+    @options = options || @options
+    @setTitle()
+    @loaded = true
+    @element.removeClass('loading')
+    @contentElement.html(data)
+    @contentElement.css({display: 'none', visibility: 'hidden'})
+
+    # for complex modal content, we provide panes and controls
+    @contentPane = @element.find('.mercury-display-pane-container')
+    @contentControl = @element.find('.mercury-display-controls')
+
+    @options.afterLoad.call(@) if @options.afterLoad
+    if @options.handler
+      if Mercury.modalHandlers[@options.handler]
+        Mercury.modalHandlers[@options.handler].call(@)
+      else if Mercury.lightviewHandlers[@options.handler]
+        Mercury.lightviewHandlers[@options.handler].call(@)
+
+    @element.localize(Mercury.locale()) if Mercury.config.localization.enabled
+    @resize()
+
+
+  setTitle: ->
+    @titleElement.find('span').html(Mercury.I18n(@options.title))
+    closeButton = @titleElement.find('a')
+    if @options.closeButton == false then closeButton.hide() else closeButton.show()
+
+
+  reset: ->
+    @titleElement.find('span').html('')
+    @contentElement.html('')
+
+
+  hide: ->
+    return if @showing
+    @options = {}
+    @initialized = false
+
+    Mercury.trigger('focus:frame')
+    @element.hide()
+    @overlay.hide()
+    @reset()
+
+    @visible = false

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

@@ -0,0 +1,11 @@
+@Mercury.modalHandlers.htmlEditor = ->
+  # fill the text area with the content
+  content = Mercury.region.content(null, true, false)
+  @element.find('textarea').val(content)
+
+  # replace the contents on form submit
+  @element.find('form').on 'submit', (event) =>
+    event.preventDefault()
+    value = @element.find('textarea').val().replace(/\n/g, '')
+    Mercury.trigger('action', {action: 'replaceHTML', value: value})
+    @hide()

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

@@ -0,0 +1,4 @@
+@Mercury.modalHandlers.insertCharacter = ->
+  @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

@@ -0,0 +1,95 @@
+@Mercury.modalHandlers.insertLink = ->
+  # make the inputs work with the radio buttons
+  @element.find('label input').on 'click', ->
+    jQuery(@).closest('label').next('.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').on 'change', =>
+    @element.find(".link-target-options").hide()
+    @element.find("##{@element.find('#link_target').val()}_options").show()
+    @resize(true)
+
+  # fill the existing bookmark select
+  bookmarkSelect = @element.find('#link_existing_bookmark')
+  for link in jQuery('a[name]', window.mercuryInstance.document)
+    bookmarkSelect.append(jQuery('<option>', {value: jQuery(link).attr('name')}).text(jQuery(link).text()))
+
+  # get the selection and initialize its information into the form
+  if Mercury.region && Mercury.region.selection
+    selection = Mercury.region.selection()
+
+    # if we're editing a link prefill the information
+    container = selection.commonAncestor(true).closest('a') if selection && selection.commonAncestor
+
+    if container && container.length
+      existingLink = container
+
+      # don't allow changing the content on edit
+      @element.find('#link_text_container').hide()
+
+      # fill in the external url or bookmark select based on what it looks like
+      if container.attr('href') && container.attr('href').indexOf('#') == 0
+        bookmarkSelect.val(container.attr('href').replace(/[^#]*#/, ''))
+        bookmarkSelect.prev('label').find('input[type=radio]').prop("checked", true)
+      else
+        @element.find('#link_external_url').val(container.attr('href'))
+
+      # if it has a name, assume it's a bookmark target
+      if container.attr('name')
+        newBookmarkInput = @element.find('#link_new_bookmark')
+        newBookmarkInput.val(container.attr('name'))
+        newBookmarkInput.prev('label').find('input[type=radio]').prop("checked", true)
+
+      # if it has a target, select it, and try to pull options out
+      if container.attr('target')
+        @element.find('#link_target').val(container.attr('target'))
+
+      # if it's a popup window
+      if container.attr('href') && container.attr('href').indexOf('javascript:void') == 0
+        href = container.attr('href')
+        @element.find('#link_external_url').val(href.match(/window.open\('([^']+)',/)[1])
+        @element.find('#link_target').val('popup')
+        @element.find('#link_popup_width').val(href.match(/width=(\d+),/)[1])
+        @element.find('#link_popup_height').val(href.match(/height=(\d+),/)[1])
+        @element.find('#popup_options').show()
+
+    # get the text content
+    @element.find('#link_text').val(selection.textContent()) if selection.textContent
+    selection_source = selection.fragment.firstChild.outerHTML  if selection.fragment && selection.fragment.firstChild
+    @element.find('#link_text').val(selection_source) if selection_source
+
+  # build the link on form submission
+  @element.find('form').on 'submit', (event) =>
+    event.preventDefault()
+
+    content = @element.find('#link_text').val()
+    target = @element.find('#link_target').val()
+    type = @element.find('input[name=link_type]:checked').val()
+
+    switch type
+      when 'existing_bookmark' then attrs = {href: "##{@element.find('#link_existing_bookmark').val()}"}
+      when 'new_bookmark' then attrs = {name: "#{@element.find('#link_new_bookmark').val()}"}
+      else attrs = {href: @element.find("#link_#{type}").val()}
+
+    switch target
+      when 'popup'
+        args = {
+          width: parseInt(@element.find('#link_popup_width').val()) || 500,
+          height: parseInt(@element.find('#link_popup_height').val()) || 500,
+          menubar: 'no',
+          toolbar: 'no'
+        }
+        attrs['href'] = "javascript:void(window.open('#{attrs['href']}', 'popup_window', '#{jQuery.param(args).replace(/&/g, ',')}'))"
+      else attrs['target'] = target if target
+
+    value = {tagName: 'a', attrs: attrs, content: content}
+
+    if existingLink
+      Mercury.trigger('action', {action: 'replaceLink', value: value, node: existingLink.get(0)})
+    else
+      Mercury.trigger('action', {action: 'insertLink', value: value})
+
+    @hide()

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

@@ -0,0 +1,107 @@
+@Mercury.modalHandlers.insertMedia = ->
+  # make the inputs work with the radio buttons, and options
+  @element.find('label input').on 'click', ->
+    jQuery(@).closest('label').next('.selectable').focus()
+
+  @element.find('.selectable').on 'focus', (event) =>
+    element = jQuery(event.target)
+    element.prev('label').find('input[type=radio]').prop("checked", true)
+
+    @element.find(".media-options").hide()
+    @element.find("##{element.attr('id').replace('media_', '')}").show()
+    @resize(true)
+
+  # get the selection and initialize its information into the form
+  if Mercury.region && Mercury.region.selection
+    selection = Mercury.region.selection()
+
+    # if we're editing an image prefill the information
+    if selection.is && image = selection.is('img')
+      @element.find('#media_image_class').val(image.attr('class'))
+      @element.find('#media_image_url').val(image.attr('src'))
+      @element.find('#media_image_alignment').val(image.attr('align'))
+      width = image.width()
+      @element.find('#media_image_width').val(width) if width && width>0
+      height = image.height()
+      @element.find('#media_image_height').val(height) if height && height>0
+      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')
+      src = iframe.attr('src')
+      if src.indexOf('http://www.youtube.com') > -1
+        # it's a youtube video
+        @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())
+        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())
+        setTimeout 300, => @element.find('#media_vimeo_url').focus()
+
+
+  # build the image or youtube embed on form submission
+  @element.find('form').on 'submit', (event) =>
+    event.preventDefault()
+    type = @element.find('input[name=media_type]:checked').val()
+
+    switch type
+      when 'image_url'
+        attrs = {src: @element.find('#media_image_url').val()}
+        attrs['align'] = alignment if alignment = @element.find('#media_image_alignment').val()
+        attrs['class'] = klass if klass = @element.find('#media_image_class').val()
+        width = @element.find('#media_image_width').val()
+        height = @element.find('#media_image_height').val()
+        attrs['width'] = width if width
+        attrs['height'] = height if height
+        size = 'original'
+        if width>0 || height>0
+          Mercury.log("Adjusting image file")
+          biggest = Math.max(height,width)
+          if biggest<=100
+            size = 'thumb'
+          else if biggest<=300
+            size = 'small'
+          else if biggest<=500
+            size = 'medium'
+          else if biggest<=800
+            size = 'large'
+
+        path_bits = attrs['src'].split('/')
+        path_bits[10] = size
+        attrs['src'] = path_bits.join('/')
+        Mercury.trigger('action', {action: 'insertImage', value: attrs})
+
+      when 'youtube_url'
+        url = @element.find('#media_youtube_url').val()
+        unless /^http:\/\/youtu.be\//.test(url)
+          Mercury.notify('Error: The provided youtube share url was invalid.')
+          return
+        code = url.replace('http://youtu.be/', '')
+        value = jQuery('<iframe>', {
+          width: @element.find('#media_youtube_width').val() || 560,
+          height: @element.find('#media_youtube_height').val() || 349,
+          src: "http://www.youtube.com/embed/#{code}?wmode=transparent",
+          frameborder: 0,
+          allowfullscreen: 'true'
+        })
+        Mercury.trigger('action', {action: 'insertHTML', value: value})
+
+      when 'vimeo_url'
+        url = @element.find('#media_vimeo_url').val()
+        unless /^http:\/\/vimeo.com\//.test(url)
+          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
+        })
+        Mercury.trigger('action', {action: 'insertHTML', value: value})
+
+    @hide()

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

@@ -0,0 +1,12 @@
+@Mercury.modalHandlers.insertSnippet = ->
+  @element.find('form').on 'submit', (event) =>
+    event.preventDefault()
+    serializedForm = @element.find('form').serializeObject()
+    if Mercury.snippet
+      snippet = Mercury.snippet
+      snippet.setOptions(serializedForm)
+      Mercury.snippet = null
+    else
+      snippet = Mercury.Snippet.create(@options.snippetName, serializedForm)
+    Mercury.trigger('action', {action: 'insertSnippet', value: snippet})
+    @hide()

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

@@ -0,0 +1,54 @@
+@Mercury.modalHandlers.insertTable = ->
+  table = @element.find('#table_display table')
+
+  # make td's selectable
+  table.on 'click', (event) =>
+    cell = jQuery(event.target)
+    table = cell.closest('table')
+    table.find('.selected').removeAttr('class')
+    cell.addClass('selected')
+    Mercury.tableEditor(table, cell, ' ')
+
+  # select the first td
+  firstCell = table.find('td, th').first()
+  firstCell.addClass('selected')
+  Mercury.tableEditor(table, firstCell, ' ')
+
+  # make the buttons work
+  @element.find('input.action').on 'click', (event) =>
+    action = jQuery(event.target).attr('name')
+    switch action
+      when 'insertRowBefore' then Mercury.tableEditor.addRow('before')
+      when 'insertRowAfter' then Mercury.tableEditor.addRow('after')
+      when 'deleteRow' then Mercury.tableEditor.removeRow()
+      when 'insertColumnBefore' then Mercury.tableEditor.addColumn('before')
+      when 'insertColumnAfter' then Mercury.tableEditor.addColumn('after')
+      when 'deleteColumn' then Mercury.tableEditor.removeColumn()
+      when 'increaseColspan' then Mercury.tableEditor.increaseColspan()
+      when 'decreaseColspan' then Mercury.tableEditor.decreaseColspan()
+      when 'increaseRowspan' then Mercury.tableEditor.increaseRowspan()
+      when 'decreaseRowspan' then Mercury.tableEditor.decreaseRowspan()
+
+  # set the alignment
+  @element.find('#table_alignment').on 'change', =>
+    table.attr({align: @element.find('#table_alignment').val()})
+
+  # set the border
+  @element.find('#table_border').on 'keyup', =>
+    table.attr({border: parseInt(@element.find('#table_border').val())})
+
+  # set the cellspacing
+  @element.find('#table_spacing').on 'keyup', =>
+    table.attr({cellspacing: parseInt(@element.find('#table_spacing').val())})
+
+  # build the table on form submission
+  @element.find('form').on 'submit', (event) =>
+    event.preventDefault()
+    table.find('.selected').removeAttr('class')
+    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: 'insertTable', value: value})
+    @hide()

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

@@ -0,0 +1,55 @@
+String::titleize = ->
+  @[0].toUpperCase() + @slice(1)
+
+
+String::toHex = ->
+  return @ if @[0] == '#'
+  @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::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 = ->
+  result = @toString(16).toUpperCase()
+  return if result[1] then result else "0#{result}"
+
+
+Number::toBytes = ->
+  bytes = parseInt(@)
+  i = 0
+  while 1023 < bytes
+    bytes /= 1024
+    i += 1
+  return if i then "#{bytes.toFixed(2)}#{['', ' kb', ' Mb', ' Gb', ' Tb', ' Pb', ' Eb'][i]}" else "#{bytes} bytes"
+
+
+# make setTimeout not suck for coffeescript
+window.originalSetTimeout = window.setTimeout
+window.setTimeout = (arg1, arg2) ->
+  if typeof(arg1) == 'number' then window.originalSetTimeout(arg2, arg1) else window.originalSetTimeout(arg1, arg2)