                     if gecko
                         br = "\r\n<br>\r\n<br class='cozyInsertedBr'>\r\n"
                     else
-                        br = "\r\n<div></div><div><br class='cozyInsertedBr'></div>\r\n"
+                        br = """
+                          \r\n<div></div><div><br class='cozyInsertedBr'></div>\r\n
+                            """
                     document.execCommand 'insertHTML', false, br
 
+                    node = document.querySelector('.cozyInsertedBr')
                     if gecko
-                        node = document.querySelector('.cozyInsertedBr').previousElementSibling
-                    else
-                        node = document.querySelector('.cozyInsertedBr')
+                        node = node.previousElementSibling
+
+                    # get path of a node inside the contentEditable
                     getPath = (node) ->
                         path = node.tagName
                         while node.parentNode? and node.contentEditable isnt 'true'
                             node = node.parentNode
                             path = "#{node.tagName} > #{path}"
                         return path
-                    s = window.getSelection()
-                    r = document.createRange()
-                    r.selectNode(node)
-                    s.removeAllRanges()
-                    s.addRange(r)
+
+                    # ensure focus is on newly inserted node
+                    selection = window.getSelection()
+                    range = document.createRange()
+                    range.selectNode(node)
+                    selection.removeAllRanges()
+                    selection.addRange(range)
+
+                    # outdent node
                     depth = getPath(node).split('>').length
                     while depth > 0
                         document.execCommand 'outdent', false, null
                         depth--
+                    # remove the surnumerous block
                     node = document.querySelector '.cozyInsertedBr'
                     node?.parentNode.removeChild node
+
+                    # try to remove format that may remains from the quote
                     document.execCommand 'removeFormat', false, null
                     return
 

        settings:             React.PropTypes.object.isRequired

    shouldComponentUpdate: (nextProps, nextState) ->
        return not(_.isEqual(nextState, @state)) or not (_.isEqual(nextProps, @props))

    render: ->


        classCc    = if @state.cc.length is 0 then '' else ' shown'
        classBcc   = if @state.bcc.length is 0 then '' else ' shown'

        if @state.sending
            labelSend = t 'compose action sending'
        else
            labelSend = t 'compose action send'
        focusEditor = Array.isArray(@state.to) and
            @state.to.length > 0 and
            @state.subject isnt ''

        div id: 'email-compose',
            if @props.layout isnt 'full'
                a
                    onClick: toggleFullscreen,
                    className: 'expand pull-right clickable',
                        i className: 'fa fa-arrows-h'
            else
                a
                    onClick: toggleFullscreen,
                    className: 'close-email pull-right clickable',
                        i className:'fa fa-compress'
            h3
                'data-message-id': @props.message?.get('id') or ''
                @state.subject or t 'compose'
