written 0.2.0 → 0.4.0

checksums.yaml

@@ -1,7 +1,7 @@
 ---
 SHA1:
-  metadata.gz: 3feabb75dd783639d084dd9b58cb552d195a8a38
-  data.tar.gz: cf8fbadf5551a7d453904460bc4ba4cb5b7f0676
+  metadata.gz: 0b65dbcbd89c707b5459e63d6e3126bd5e60dc62
+  data.tar.gz: 18f572157a4c5ba0335de9cfc0b7af2e80ff770e
 SHA512:
-  metadata.gz: 43c5f5f0d01986530cdbbba47fcfecdafc6c07b367027b3413603aba5cb33fda21adfb34dff6f1263488eb9a6f4ca50d38ac1194a3eabfe5cef39556535c8370
-  data.tar.gz: 10722bca8267b18cf3a268aefe0ec7bd82afb4445918b8f65c801ddf5484e0c8e212c1f7b0222351032b63fd643df4ac57c9b821e6488ac0b732d8916de65ea2
+  metadata.gz: 966a36308d380f0d119795a462e5d2c1c6c87f1cb6902707df6143ca6ba5f2dab1d60f4f95d9b19c4f301a19ae6cc3ba8afce49f2fca3f48e83e39fa7c89e945
+  data.tar.gz: b8ba365832818f9c86c43eeb628fc6822421257114e68eeb633b713fd7568a5dfb3d91edd48c99921a2390ceb7fee5fff38da17743aa664f75f7167df696a18e

data/.babelrc

@@ -0,0 +1,3 @@
+{
+  "presets": ["es2015"]
+}

data/.gitignore

@@ -2,3 +2,5 @@
 tmp/
 secrets.*
 *.log
+node_modules
+build/

data/.ruby-version

@@ -0,0 +1 @@
+2.3.0

data/README.md

@@ -16,8 +16,7 @@ The editor also allows you to cherry-pick the markdown feature you wish to suppo
 To start using Written, you just have to create a new editor.
 
 ~~~javascript
-var editor = new Written(document.querySelector('#Editor'))
-editor.initialize()
+new Written(document.querySelector('#Editor'))
 ~~~
 
 You can retrieve the document either as a markdown text, or a HTML string. For storage purposes, you might want to store the HTML string from the current document
@@ -34,13 +33,13 @@ Written allows you to enable the parsers you wish. The parsers are split into tw
 The editor needs to be configured before it is initialized. Here's how you customize the parsers.
 
 ~~~javascript
-var editor = new Written(document.querySelector('#Editor'))
-editor.parsers.use('block', ['Header', 'Code', 'UList', 'OList'])
-editor.parsers.use('inline', 'all')
-editor.initialize()
+var parsers = new Written.Parsers({
+  blocks: ['header', 'code', 'ulist', 'olist']
+})
+var editor = new Written(document.querySelector('#Editor'), {parsers: parsers})
 ~~~
 
-You can specify ~~~ 'all'~~~ if you wish to use all the available parsers for a given type.
+Not specifying parsers will enable *all parsers*.
 
 ### Document
 
@@ -52,7 +51,7 @@ Those documents are then stored in a history that Written then use to implement
 
 ### On Change Events
 
-Written dispatch an event whenever text changes on the Editor. To receive update when the editor change, just add an event listener to ~~~written:changed~~~ event.
+Written dispatch an event whenever text changes on the Editor. To receive update when the editor change, just add an event listener to ```written:changed``` event.
 
 ~~~javascript
   document.addEventListener('written:changed', function(event) {
@@ -61,3 +60,14 @@ Written dispatch an event whenever text changes on the Editor. To receive update
     document.toString() // Markdown version
   })
 ~~~
+
+## Test the editor locally
+
+If you want to test the editor on your machine, the easiest way is with [Ruby](httsp://www.ruby-lang.org).
+
+```ruby
+$ bundle install
+$ bundle exec rake server
+```
+
+This will launch a server that runs the Editor with on ```localhost:3000```.

data/Rakefile

@@ -62,6 +62,7 @@ task :compile do
   Bundler.require(:default, ENV['RAILS_ENV'])
   
   environment = Sprockets::Environment.new
+  environment.js_compressor = :uglifier
 
   environment.append_path 'lib/written/app/assets/javascripts'
   environment.append_path 'lib/written/app/assets/stylesheets'

data/compile-coffee.js

@@ -0,0 +1,14 @@
+var coffee = require('coffee-script')
+var babelJest = require("babel-jest");
+
+module.exports = {
+  process: function(src, path) {
+    if (coffee.helpers.isCoffee(path)) {
+      return coffee.compile(src, {
+        'bare': true
+      });
+    } else {
+      return babelJest.process(src, path);
+    }
+  }
+};

data/lib/written/app/assets/javascripts/written/attachments/image.coffee

@@ -6,7 +6,7 @@ class Image extends Written.Attachments.Base
     @node.querySelector('img').addEventListener 'click', @select.bind(this, @node)
 
   template: ->
-    "<div id='WrittenOverlay' contenteditable=false>
+    Written.toHTML("<div id='WrittenOverlay' contenteditable=false>
         <div id='WrittenDialog'>
           <header>
             <div class='progress'></div>
@@ -19,7 +19,7 @@ class Image extends Written.Attachments.Base
           </figure>
         </div>
       </div>
-      ".toHTML()
+      ")
 
   select: (node) =>
     @selection = @getSelection()
@@ -65,12 +65,12 @@ class Image extends Written.Attachments.Base
     dialog.classList.add 'failed'
     dialog.querySelector('h3').textContent = "Failed"
     dialog.querySelector('figure').remove()
-    dialog.appendChild("
+    dialog.appendChild(Written.toHTML("
       <section>
         <p>An error occured while trying to process your image.</p>
         <button>Close</button>
       </section>
-    ".toHTML())
+    "))
     dialog.querySelector('button').addEventListener('click', @cancel)
 
   upload: (e) =>

data/lib/written/app/assets/javascripts/written/core/content.coffee

@@ -1,16 +1,10 @@
 class @Written
-  constructor: (el) ->
+  constructor: (el, options = {}) ->
     el.instance = this
     el.dataset.editor = "written"
     @element = ->
       return el
 
-    text = @toString()
-    @element().textContent = ''
-
-    @observer = new Written.Observer(@element(), @changed)
-    @initialize = @initialize.bind(this, text)
-
     @element().addEventListener 'dragover', @over
     @element().addEventListener('drop', @preventDefaults)
 
@@ -19,35 +13,33 @@ class @Written
     @element().addEventListener('keydown', @redo)
     @element().addEventListener('keydown', @cursor)
 
-
-  preventDefaults: (e) ->
-    e.preventDefault()
-
-  initialize: (text, parsers) ->
-    @observer.pause()
+    parsers = options.parsers
     if !parsers?
-      parsers = Written.Parsers
+      parsers = new Written.Parsers()
 
     @parsers = parsers
 
+    text = @toString()
+    @element().textContent = ''
+
     if @element().contentEditable != 'true'
       @element().contentEditable = 'true'
 
-    document = new Written.Document(text, @parsers)
-    cursor = new Written.Cursor(@element(), window.getSelection())
-    document.cursor = cursor
+    cursor = new Written.Cursor(@element(), window.getSelection(), @parsers)
+    document = new Written.Document(text, @parsers, cursor)
 
-    
     @render(document)
 
     document.cursor.focus(document.toString().length)
 
     @history = new Written.History(document)
-
+    @observer = new Written.Observer(@element(), @changed)
     @dispatch('written:initialized')
-    @observer.resume()
 
 
+  preventDefaults: (e) ->
+    e.preventDefault()
+
   dispatch: (name, data = {}) =>
     event = new CustomEvent(name, bubbles: true, detail: data)
     @element().dispatchEvent(event)
@@ -59,8 +51,8 @@ class @Written
 
   changed: (e) =>
     oldDocument = @history.current
-    newDocument = new Written.Document(@toString(), @parsers)
-    newDocument.cursor = new Written.Cursor(@element(), window.getSelection())
+    cursor = new Written.Cursor(@element(), window.getSelection(), @parsers)
+    newDocument = new Written.Document(@toString(), @parsers, cursor)
     if @element().children.length > 0 && oldDocument.toString().localeCompare(newDocument.toString()) == 0
       return
 
@@ -70,14 +62,14 @@ class @Written
     @dispatch('written:changed', document: newDocument)
 
   cursor: =>
-    @history.current.cursor = new Written.Cursor(@element(), window.getSelection())
+    @history.current.cursor = new Written.Cursor(@element(), window.getSelection(), @parsers)
 
   linefeed: (e) =>
     return unless e.which == 13
     e.preventDefault()
     e.stopPropagation()
 
-    cursor = new Written.Cursor(@element(), window.getSelection())
+    cursor = new Written.Cursor(@element(), window.getSelection(), @parsers)
     @observer.pause =>
 
       offset = cursor.offset
@@ -94,8 +86,7 @@ class @Written
         lines.push('')
         cursor.offset += 1
 
-      document = new Written.Document(lines.join('\n'), @parsers)
-      document.cursor = cursor
+      document = new Written.Document(lines.join('\n'), @parsers, cursor)
       if cursor.offset < document.toString().length
         cursor.offset += 1
 
@@ -132,10 +123,8 @@ class @Written
   toString: =>
     texts = []
     for node in @element().childNodes
-      content = Written.Parsers.toString(node).split('\n')
+      content = @parsers.toString(node).split('\n')
       texts.push content.join('\n')
 
     texts.join '\n'
 
-
-Written.Uploaders = {}

data/lib/written/app/assets/javascripts/written/core/cursor.coffee

@@ -1,8 +1,9 @@
 class Written.Cursor
-  constructor: (element, selection) ->
+  constructor: (element, selection, parsers) ->
     @element = ->
       element
     @selection = selection
+    @parsers = parsers
     children = Array.prototype.slice.call(@element().children, 0)
     @offset = selection.focusOffset
 
@@ -15,7 +16,7 @@ class Written.Cursor
         child = node.previousSibling
 
         while child
-          @offset += Written.Parsers.toString(child).length
+          @offset += @parsers.toString(child).length
           child = child.previousSibling
 
         if node instanceof HTMLLIElement
@@ -27,7 +28,7 @@ class Written.Cursor
     for child in @element().children
       if child == node
         break
-      @offset += Written.Parsers.toString(child).length
+      @offset += @parsers.toString(child).length
       @offset += 1
 
     @currentNode = ->
@@ -39,7 +40,7 @@ class Written.Cursor
 
     element = @element().firstElementChild
     while element && element != node
-      offset -= Written.Parsers.toString(element).length
+      offset -= @parsers.toString(element).length
       element = element.nextElementSibling
 
     offset
@@ -53,12 +54,12 @@ class Written.Cursor
     if node is undefined
       node = @element().firstElementChild
 
-    while node.nextElementSibling && Written.Parsers.toString(node).length < offset
-      offset -= Written.Parsers.toString(node).length + 1
+    while node.nextElementSibling && @parsers.toString(node).length < offset
+      offset -= @parsers.toString(node).length + 1
       node = node.nextElementSibling
 
 
-    range = Written.Parsers.getRange(node, Math.min(offset, Written.Parsers.toString(node).length), document.createTreeWalker(node, NodeFilter.SHOW_TEXT))
+    range = @parsers.getRange(node, Math.min(offset, @parsers.toString(node).length), document.createTreeWalker(node, NodeFilter.SHOW_TEXT))
 
     if @offsetDiffersBetween(@selection, range)
       @selection.removeAllRanges()

data/lib/written/app/assets/javascripts/written/core/document.coffee

@@ -1,16 +1,17 @@
-#= require ../parsers/parsers
+#= require ./parsers
 
 class Written.Document
-  constructor: (text, parsers) ->
+  constructor: (text, parsers, cursor) ->
+    @cursor = cursor
     @blocks = parsers.parse(parsers.blocks, text)
 
     @blocks.forEach (block) =>
-      if block.text?
+      if block.innerText?
         if block.multiline
-          block.content = block.text().split('\n').map (text) ->
+          block.content = block.innerText().split('\n').map (text) ->
             parsers.parse(parsers.inlines, text)
         else
-          block.content = parsers.parse(parsers.inlines, block.text())
+          block.content = parsers.parse(parsers.inlines, block.innerText())
 
   freeze: =>
     Object.freeze(@blocks)
@@ -20,7 +21,7 @@ class Written.Document
     text = ''
 
     @blocks.forEach (node) ->
-      text += node.html().outerHTML + "\n"
+      text += node.toHTML().outerHTML + "\n"
 
     text
 
@@ -40,7 +41,7 @@ class Written.Document
     @cursor.focus()
 
   findNodeFor: (block, remaining) ->
-    node = block.markdown()
+    node = block.toEditor()
 
     found = remaining.find (existing) ->
       block.equals(existing, node)
@@ -52,7 +53,7 @@ class Written.Document
       return @toString.cache
 
     texts = @blocks.map (block) ->
-      block.raw()
+      block.outerText()
 
     texts.join('\n')
 

data/lib/written/app/assets/javascripts/written/core/{extensions/string.coffee → html.coffee}

@@ -1,9 +1,10 @@
-String::toHTML = ->
+Written.toHTML = (text) ->
   el = document.createElement('div')
-  el.innerHTML = this
+  el.innerHTML = text
   if el.children.length > 1
     el.children
   else
     el.children[0]
 
 
+

data/lib/written/app/assets/javascripts/written/core/parsers.coffee

@@ -0,0 +1,179 @@
+class @Written.Parsers
+  constructor: (parsers = {}) ->
+    if parsers.blocks?
+      @blocks = Written.Parsers.Blocks.select(parsers.blocks)
+    else
+      @blocks = [Written.Parsers.Blocks.default].concat(Written.Parsers.Blocks)
+
+    if parsers.inlines?
+      @inlines = Written.Parsers.Inlines.select(parsers.inlines)
+    else
+      @inlines = Written.Parsers.Inlines
+
+    @nodes = {}
+
+    for struct in @blocks.concat(@inlines)
+      for node in struct.nodes
+        @nodes[node] = struct
+
+    @blocks.parse = @parseBlocks.bind(this, @blocks)
+    @inlines.parse = @parseInlines.bind(this, @inlines)
+
+  parse: (parsers, text) ->
+    parsers.parse(text)
+
+  parseBlocks: (parsers, text) ->
+    parsers = [parsers.default].concat(parsers).reverse()
+    blocks = []
+    lines = text.split('\n').reverse()
+    while (line = lines.pop()) != undefined
+      str = line
+      block = blocks[blocks.length - 1]
+
+      if block? && block.multiline && block.accepts(line)
+        block.append(line)
+        continue
+
+      blocks.push(@find(parsers, str))
+
+    blocks
+
+  parseInlines: (parsers, text) ->
+    buffer = ''
+    content = []
+    matches = []
+    index = 0
+
+    for struct in parsers
+      struct.rule.lastIndex = 0
+
+      while match = struct.rule.exec(text)
+        parser = new struct.parser(match)
+        matches[parser.index()] = parser
+
+    while text[index]?
+      if parser = matches[index]
+        content.push buffer.slice(0)
+        content.push parser
+        buffer = ''
+        index += parser.length()
+      else
+        buffer += text[index]
+        index += 1
+
+    if buffer.length > 0
+      content.push buffer
+
+    content
+
+
+  find: (parsers, str) ->
+    parser = undefined
+    for struct in parsers
+      if match = struct.rule.exec(str)
+        parser = new struct.parser(match)
+        break
+
+    return parser
+
+  get: (name) ->
+    @nodes[name]
+
+  getRange: (node, offset, walker) ->
+    @nodes[node.nodeName.toLowerCase()].getRange(node, offset, walker)
+
+  toString: (node) ->
+    struct = @nodes[node.nodeName.toLowerCase()]
+    if struct?
+      struct.toString(node)
+    else
+      node.textContent
+
+Written.Parsers.Blocks = []
+Written.Parsers.Inlines = []
+
+Written.Parsers.Blocks.select = (nodes) ->
+  selected = []
+  nodes.map (name) ->
+    struct = Written.Parsers.Blocks.find (struct) ->
+      struct.name == name
+    if struct?
+      selected.push struct
+
+  [Written.Parsers.Blocks.default].concat(selected)
+
+Written.Parsers.Inlines.select = (nodes) ->
+  selected = []
+  nodes.map (name) ->
+    struct = Written.Parsers.Inlines.find (struct) ->
+      struct.name == name
+    if struct?
+      selected.push struct
+
+  selected
+
+Written.Parsers.register = (struct) ->
+  type = undefined
+  if struct.type == 'block'
+    type = Written.Parsers.Blocks
+  else if struct.type == 'inline'
+    type = Written.Parsers.Inlines
+  else
+    raise 'error: Written.Parsers can either be "block" or "inline"'
+    return
+
+  Written.Parsers.normalize(struct)
+  if struct.default
+    type.default = struct
+  else
+    type.push struct
+
+
+Written.Parsers.normalize = (struct) ->
+  if !struct.getRange
+    struct.getRange = (node, offset, walker) ->
+      range = document.createRange()
+
+      if !node.firstChild?
+        range.setStart(node, 0)
+      else
+        while walker.nextNode()
+          if walker.currentNode.length < offset
+            offset -= walker.currentNode.length
+            continue
+
+          range.setStart(walker.currentNode, offset)
+          break
+
+      range.collapse(true)
+      range
+
+  if Object.prototype.toString == struct.toString
+    struct.toString = (node) ->
+      node.textContent
+
+class Written.Parsers.Block
+  outerText: ->
+    throw "method implementation: #{this.name}.outerText() is missing."
+
+  equals: ->
+    throw "method implementation: #{this.name}.equals(current, rendered) is missing."
+
+  toEditor: ->
+    throw "method implementation: #{this.name}.toEditor() is missing."
+
+  toHTML: ->
+    throw "method implementation: #{this.name}.toHTML() is missing."
+
+class Written.Parsers.Inline
+  index: ->
+    throw "method implementation: #{this.name}.index() is missing."
+
+  length: ->
+    throw "method implementation: #{this.name}.length() is missing."
+
+  toEditor: ->
+    throw "method implementation: #{this.name}.toEditor() is missing."
+
+  toHTML: ->
+    throw "method implementation: #{this.name}.toHTML() is missing."