             return 0
         else
             e = @project_page.container
+            # console.log("editor_top_position: e.position().top = #{e.position().top} + e.height() = #{e.height()}")
             return e.position().top + e.height()
 
     refresh: () =>

        #     * source editor -- a CodeMirror editor
        #     * preview/contenteditable -- rendered view
        @ext = filename_extension_notilde(@filename)   #'html' or 'md'

        if @ext == 'html'
            @opts.mode = 'htmlmixed'

        @preview.maxheight(offset:button_bar_height)

        @_dragbar.height(@source_editor.element.height())
        @_dragbar.offset(top: @source_editor.element.offset() + button_bar_height)
        @_dragbar.css('top', "#{@edit_buttons.height() + button_bar_height + 9}px") # +9 is not good

        # position the preview
        @preview.offset
            top: @source_editor.element.offset() + button_bar_height

        @preview.css
            left  : editor_width + left + 7
            width : width - (editor_width + left + 7)
            top   : "#{@edit_buttons.height() + button_bar_height + 15}px"

    focus: () =>
        @source_editor?.focus()
