     top =  offset.top - offset.height - 16
     @editor_menu.$el.offset({left: offset.left - padd, top: top })
 
+
+  handleBlur: (ev)=>
+    #console.log(ev)
+    #hide menu only if is not in use
+    setTimeout ()=>
+      @editor_menu.hide() unless selected_menu
+    , 200
+
+    @tooltip_view.hide()
+    false
+
+  handleFocus: (ev)=>
+    console.log("Handle focus #{ev}")
+
+  #get text of selected and displays menu
+  handleTextSelection: (ev)->
+    @editor_menu.hide()
+    text = @getSelectedText()
+    unless _.isEmpty text
+      @current_range = @getRange()
+      @current_node  = @getNode()
+      #console.log(@current_range)
+      @.displayMenu()
+
+  handleCaret: ()->
+    @resetOffset($(@el));
+
+  handleArrow: (ev)=>
+    console.log("ENTER ARROWS")
+    #console.log @getNode()
+    current_node = $(@getNode())
+    @displayTooltipAt( current_node )
+    @markAsSelected( current_node )
+
+  #overrides default behavior
   handleKeyDown: (e)->
     e.preventDefault() if _.contains([13], e.which)
-
-  #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)->
-    #console.log "selecting."
-    #console.log $(element)
-    $(@el).find(".is-selected").removeClass("is-selected")
-    $(element).addClass("is-selected")
-
-  #set focus and caret position on element
-  setRangeAt: (element)->
-    range = document.createRange()
-    sel = window.getSelection()
-
-    range.setStart(element, 0);
-    range.collapse(true)
-    sel.removeAllRanges()
-    sel.addRange(range)
-    @el.focus()
 
   handleCarriageReturn: (e)->
     @editor_menu.hide() #hides menu just in case

    else if typeof document.selection != "undefined" && document.selection.type == "Text"
      text = document.selection.createRange().text
    text

  selection: ()=>
    selection


  initialize: (opts = {})=>
    @editor_options = opts
    window.current_editor = @
    #globals for selected text and node
    @current_range = null
    @current_node = null

    if (localStorage.getItem('contenteditable'))
      $(@el).html  localStorage.getItem('contenteditable')

    @store()

  store: ()->
    localStorage.setItem("contenteditable", $(@el).html )
    setTimeout ()=>
      console.log("storing")
      @store()
    , 5000

  template: ()=>
    "<section class='section-content'>
