     if _.contains([37,38,39,40], e.which)
       @handleArrow(e)
 
-
+    @cleanContents()
+
+  handleLineBreakWith: (element_type, from_element)->
+    new_paragraph = $("<#{element_type} class='graf graf--#{element_type} graf--empty is-selected'><br/></#{element_type}>")
+    new_paragraph.insertAfter(from_element)
+    #set caret on new <p>
+    @setRangeAt(new_paragraph[0])
+    #shows tooltip
+    @displayTooltipAt($(new_paragraph))
+
+
+  #shows the (+) tooltip at current element
+  displayTooltipAt: (element)->
+    #console.log $(element)
+    @tooltip_view.hide()
+    return unless _.isEmpty( $(element).text() )
+    @position = $(element).offset()
+    @tooltip_view.render()
+    @tooltip_view.move(left: @position.left - 60 , top: @position.top - 5 )
+
+  #mak the current row as selected
+  markAsSelected: (element)->
+    $(@el).find(".is-selected").removeClass("is-selected")
+    $(element).addClass("is-selected")
+
+  cleanContents: ()->
+    #TODO: should config tags
+    console.log("CLEAN CONTENTS NAW")
+    node = @getNode()
+    $(node).find("span").contents().unwrap()
 
 class Editor.Menu extends Backbone.View
   el: "#editor-menu"
 
   events:
-    "click .editor-icon" : "handleClick"
+    "mousedown i" : "handleClick"
+    #"click .editor-icon" : "handleClick"
     "mouseenter" : "handleOver"
     "mouseleave" : "handleOut"
 
   initialize: (opts={})=>
     @config = opts.buttons || @default_config()
 
+    @commandsReg = {
+      block: /^(?:p|h[1-6]|blockquote|pre)$/
+      inline: /^(?:bold|italic|underline|insertorderedlist|insertunorderedlist|indent|outdent)$/,
+      source: /^(?:insertimage|createlink|unlink)$/
+      insert: /^(?:inserthorizontalrule|insert)$/
+      wrap: /^(?:code)$/
+    }
+
+    @lineBreakReg = /^(?:blockquote|pre|div)$/i;
+
+    @effectNodeReg = /(?:[pubia]|h[1-6]|blockquote|[uo]l|li)/i;
+
   default_config: ()->
-    buttons: ["blockquote", "h2", "h3", "code", "bold", "italic", "underline", "createlink"]
+    buttons: [
+        'blockquote', 'h2', 'h3', 'p', 'code', 'insertorderedlist', 'insertunorderedlist', 'inserthorizontalrule',
+        'indent', 'outdent', 'bold', 'italic', 'underline', 'createlink'
+      ]
 
   template: ()=>
     html = ""

    @tooltip_view = new Editor.Tooltip()
    @tooltip_view.render()

  handleBlur: (ev)=>
    console.log(ev)
    #hide menu only if is not in use
    setTimeout ()=>
      @editor_menu.hide() unless selected_menu
    , 200

    @tooltip_view.hide()

  handleFocus: (ev)=>
    console.log("Handle focus #{ev}")

  getSelectedText: () ->
    text = ""
    if typeof window.getSelection != "undefined"

# make it accessible
window.selection = 0
selected_menu = false
window.current_editor = null

class Editor.MainEditor extends Backbone.View
  el: "#editor"
