为 ATK4 实现 WYSIWYG 编辑器

Question

关于这个问题Is there a CMS (WYSIWYG) Component for Agile Toolkit?，我正在尝试将 elRTE 编辑器添加为我安装 ATK4 的默认 RTE。

简单地说，我应该将 elRTE 文件放在 atk4 目录结构中的什么位置？

TIA PG

附加信息：

有人设法让所见即所得的编辑器工作吗？

我尝试过使用 tinyMCE 和 elRTE。我已将这两个库放在 atk4/templates/js 文件夹中，然后通过我的 Admin api 类加载（我希望这些库可用于我的所有 Admin 模型）：

 $this->js()
        ->_load('atk4_univ')
        ->_load('ui.atk4_notify')
        ->_load('tiny_mce/tiny_mce')
        ;

如果我正在尝试 elRTE，那么我会加载它而不是 tinyMCE -

            ->_load('elrte/js/elrte.min')

然后在我的 page_manager 类中，我尝试实例化所见即所得的编辑器：

$tabs=$this->add('Tabs');
$crud = $tabs->addTab('listing')->add('CRUD');
$crud->setModel('Listing',array('title','body'),array('title'));

if ($crud->form) {
    $f = $crud->form;
    $f->getElement('body')->js(true)->tinyMCE.init();
}

根据我尝试调用的库，我尝试了各种不同的排列，但没有任何效果 - 我要么只是得到一个空表单进行编辑，要么只是那里显示加载消息的站点。以下是我尝试过的一些不同的变体：

$f->getElement('body')->js(true,'tinyMCE.init(mode:"textareas")');

$f->getElement('body')->js(true,'elrte()');

$f->getElement('body')->js(true)->elrte();

尽我所能，我想要的只是管理员 CRUD 上的一个简单的所见即所得编辑器

Answer 1

我不能直接回答，只能给出一个建议：

通常你应该将 js 放在 templates/js/elrte/ 下并使用 PathFinder。我已经像这样集成了 StackOverflow 的 Markdown UI：

$m=$f->getElement('text');
$m->js(true)->parent()->prepend('<div id="'.$m->name.'-bar"></div>');
$m->js(true)->parent()->append('<div id="'.$m->name.'-preview" class="wmd-panel wmd-preview"></div>');
$m->js(true,' var converter1 = Markdown.getSanitizingConverter(); var editor1 = new Markdown.Editor(converter1,"'.
        $m->name.'");editor1.run();');

$this->api->jquery->addStaticInclude('pagedown/Markdown.Converter');
$this->api->jquery->addStaticInclude('pagedown/Markdown.Sanitizer');
$this->api->jquery->addStaticInclude('pagedown/Markdown.Editor');
$this->api->template->append('js_include',
    '<link type="text/css" href="'.$this->api->locateURL('js','pagedown/demo/browser/demo.css').'" rel="stylesheet" />'."\n");

我必须手动更改 JS 文件以支持带前缀的 ID 字段，但您可以对任何编辑器使用非常相似的方法。完成集成后，将代码粘贴到此处。