OscarGodson/EpicEditor

epiceditor with jade - editor loaded callback firing, no editor is added to the page

ThorsonWeb opened this issue · 1 comments

update: it seems to be an issue with being in a container div
update2: major durp on my part,

editor.load(function () {
           editor.reflow();
        });

has resolved the problem.

So I'm wanting to integrate this awesome editor with my latest node project. I serve compiled jade templates with an include for epic editor. All scripts are fine, there are no 404 relating to styles or other problems.

My JS to show the editor is

<div id="editarea"><div id="epiceditor2bdb1d84-9e21-4a93-ac3c-65318f939b88"></div></div>

$("#editarea").dialog({width:400, height:400,open: function(){
        var opts = {
           //container renders as epiceditor2bdb1d84-9e21-4a93-ac3c-65318f939b88
           container: 'epiceditor#{options.Guid}',
           textarea: null,
           basePath: '/javascripts/EpicEditor-v0.2.2',
           clientSideStorage: true,
           localStorageName: 'epiceditor',
           useNativeFullscreen: true,
           parser: marked,
           file: {
              name: 'epiceditor',
              defaultContent: '',
              autoSave: 100
           },
           theme: {
              base: '/themes/base/epiceditor.css',
              preview: '/themes/preview/preview-dark.css',
              editor: '/themes/editor/epic-dark.css'
           },
           button: {
              preview: true,
              fullscreen: true,
              bar: "auto"
           },
           focusOnLoad: false,
           shortcut: {
              modifier: 18,
              fullscreen: 70,
              preview: 80
           },
           string: {
              togglePreview: 'Toggle Preview Mode',
              toggleEdit: 'Toggle Edit Mode',
              toggleFullscreen: 'Enter Fullscreen'
           },
           autogrow: true
        }
        var editor = new EpicEditor(opts);  
        editor.load(function () {
           console.log("Editor loaded.") //prints to console
        });

the markup on the page doesn't change, however if I run editor.load() from the console the editor appears.

There are no script errors or resource 404's.... any ideas?

cheers

ah, this was probably because the load event was after you had already loaded it? glad you figured it out! 👍