         _keys: (event) ->
             widget = event.data
             if event.keyCode == 27
-                do widget.disable
+                widget.restoreOriginalContent()
+                widget.turnOff()
 
         _rangesEqual: (r1, r2) ->
             r1.startContainer is r2.startContainer and r1.startOffset is r2.startOffset and r1.endContainer is r2.endContainer and r1.endOffset is r2.endOffset

        # Check if some text is selected, and if this selection has changed. If it changed,
        # trigger the "halloselected" event
        _checkSelection: (event) ->
            widget = event.data
            sel = widget.getSelection()


                    ranges: [widget.selection]
                    originalEvent: event

        turnOn: () ->
            jQuery(@element).addClass 'inEditMode'
            #make sure the toolbar has not got the full width of the editable element when floating is set to true
            if !@options.floating
                el = jQuery(@element)
                widthToAdd = parseFloat el.css('padding-left')
                widthToAdd += parseFloat el.css('padding-right')
                widthToAdd += parseFloat el.css('border-left-width')
                widthToAdd += parseFloat el.css('border-right-width')
                widthToAdd += (parseFloat el.css('outline-width')) * 2
                widthToAdd += (parseFloat el.css('outline-offset')) * 2
                jQuery(@toolbar).css "width", el.width()+widthToAdd
            else
                @toolbar.css "width", "auto"
            @_trigger "activated", event

        turnOff: () ->
            @toolbar.hide()
            jQuery(@element).removeClass 'inEditMode'
            if (@options.showAlways)
                @element.blur()
            @_trigger "deactivated", @

        _activated: (event) ->
            event.data.turnOn()

        _deactivated: (event) ->
            event.data.turnOff()


)(jQuery)
