GWT 2.6 支持降价

Question

我正在做一个 GWT 项目，我想添加对 markdown 的支持。到目前为止，我已经尝试过 Showdown 编辑器，尽管它开箱即用但缺少工具栏。因此，我正在尝试使用 Pagedown 但我无法实例化编辑器。

到目前为止我所做的...有一个抽象基础 class（扩展 TextArea），它从其构造函数中注入 Pagedown 脚本：

protected MarkdownEditorBase() {
    ScriptInjector.fromUrl("pagedown/Markdown.Converter.js")
        .setRemoveTag(false)
        .setWindow(ScriptInjector.TOP_WINDOW)
        .inject();

    ScriptInjector.fromUrl("pagedown/Markdown.Sanitizer.js")
        .setRemoveTag(false)
        .setWindow(ScriptInjector.TOP_WINDOW)
        .inject();

    ScriptInjector.fromUrl("pagedown/Markdown.Editor.js")
        .setRemoveTag(false)
        .setWindow(ScriptInjector.TOP_WINDOW)
        .inject();

    dock = new FlowPanel();
    FlowPanel wmdPanel = new FlowPanel();
    wmdPanel.setStyleName("wmd-panel");

    FlowPanel wmdButtonBar = new FlowPanel();
    wmdButtonBar.setStyleName("wmd-button-bar");

    setStyleName("wmd-input");
    this.getElement().setId("wmd-input");

    wmdPanel.add(wmdButtonBar);
    wmdPanel.add(this);

    dock.setStyleName("markdown-container");

    dock.add(wmdPanel);
    }

然后有一个本地方法来实例化编辑器并使用它（按照演示说明）：

public native JavaScriptObject initEditor() /*-{
    var converter = new $wnd.Markdown.getSanitizingConverter();
    var editor = new $wnd.Markdown.Editor(converter);
    if (editor) {
        editor.run();
    }
    return editor;
}-*/;

每当我运行来自我的扩展器的这个方法时 class，

public PagedownEditor() {
    super();
    this.pagedownEditor = initEditor();
}

我得到以下信息：

Firebug 控制台 window

TypeError: output is undefined
Markdown.Editor = function (markdownConverter, idPostfix, options) {
Markdown.Editor.js (line 92)

ReferenceError: Markdown is not defined
Markdown.Editor = function (markdownConverter, idPostfix, options) {
Markdown.Editor.js (line 92)

Eclipse 中的开发模式

com.google.gwt.core.client.JavaScriptException: (TypeError)
@com.google.gwt.core.client.impl.Impl::apply(Ljava/lang/Object;Ljava
/lang/Object;Ljava/lang/Object;)([JavaScript object(2344), JavaScript 
object(2343), JavaScript object(2360)]): $wnd.Markdown is undefined

顺便说一句，我在 GWT 中使用 classic 开发模式，因为超级开发模式存在一些冲突，项目无法运行。

热烈欢迎任何帮助！

Answer 1

感谢真正有用的评论。我决定坚持使用 TextResources 方法，因为 Pagedown 源文件非常 "heavy" 并且需要一段时间才能加载。尽管如此，我得到的最新异常（elem 为空）主要是由于 DIV 的设置不正确。无论如何，这里是解决问题的资源class：

interface PagedownResources extends ClientBundle {

    @Source("../../resources/pagedown/Markdown.Converter.js")
    TextResource markdownConverter();

    @Source("../../resources/pagedown/Markdown.Sanitizer.js")
    TextResource markdownSanizer();

    @Source("../../resources/pagedown/Markdown.Editor.js")
    TextResource markdownEditor();

    @Source("../../resources/pagedown/pagedown.css")
    TextResource markdownCSS();
}

此外，CSS 文件不是源代码的一部分，您可以从 demo folder 中获取它并进行相应的修改。

为了完成答案，这是重写的构造函数：

private PagedownResources mPagedownResourcesInstance = GWT.create(PagedownResources.class);

public PagedownEditor() {

    StyleInjector.inject(mPagedownResourcesInstance.markdownCSS().getText());
    ScriptInjector.fromString(mPagedownResourcesInstance.markdownConverter().getText())
        .setRemoveTag(false)
        .setWindow(ScriptInjector.TOP_WINDOW).inject();
    ScriptInjector.fromString(mPagedownResourcesInstance.markdownSanizer().getText())
        .setRemoveTag(false)
        .setWindow(ScriptInjector.TOP_WINDOW).inject();
    ScriptInjector.fromString(mPagedownResourcesInstance.markdownEditor().getText())
        .setRemoveTag(false)
        .setWindow(ScriptInjector.TOP_WINDOW).inject();     

    mainContainer = new SimplePanel();
    Element wmdPanel = DOM.createDiv();
    wmdPanel.addClassName("wmd-panel");

    Element wmdButtonBar = DOM.createDiv();
    wmdButtonBar.setId("wmd-button-bar");

    Element wmdtextArea = DOM.createTextArea();
    wmdtextArea.addClassName("wmd-input");
    wmdtextArea.setId("wmd-input");

    wmdPanel.appendChild(wmdButtonBar);
    wmdPanel.appendChild(wmdtextArea);

    mainContainer.setStyleName("markdown-container");
    mainContainer.getElement().appendChild(wmdPanel);
    initWidget(mainContainer);
}

唯一让 Pagedown 工作的方法是覆盖 onLoad() 方法（我正在扩展 Composite）并在该方法中调用 initEditor()。

玩得开心，谢谢。

GWT 2.6 支持降价

GWT 2.6 Supporting markdown

java

gwt

gwt-rpc