Midas (Gecko Rich Text Editor) в XUL через элемент <editor>не может быть включен - PullRequest
1 голос
/ 12 июля 2011

Я пытаюсь использовать Midas через элемент XUL, следуя инструкциям этой статьи . Пока у меня есть код ниже:

<window id="main" title="Anunciador Blog Editor" width="300" height="300"
    xmlns="http://www.mozilla.org/keymaster/gatekeeper/there.is.only.xul"
    xmlns:xhtml="http://www.w3.org/1999/xhtml">
    <script type="application/x-javascript">
    <![CDATA[ 
    var editor = null;
    function onLoad() {
        editor = document.getElementById('editor');
        editor.contentDocument.designMode = 'on';
    }

    function onBoldButtonCommand() {
        editor.contentDocument.execCommand('bold', false, null);
    }

    window.addEventListener("load", onLoad, false);
    ]]>
    </script>
    <button label="Bold" oncommand="onBoldButtonCommand();" />
    <editor id="editor" type="content-primary" editortype="html" src="about:blank" flex="1" />
</window>

Однако, когда я нажимаю кнопку «Жирный» с текстом, выделенным в <editor>, текст не изменяется, и консоль JS выдает следующую ошибку:

Error: uncaught exception: [Exception... "Component returned failure code: 0x80004005
(NS_ERROR_FAILURE) [nsIDOMNSHTMLDocument.execCommand]"  nsresult: "0x80004005
(NS_ERROR_FAILURE)"  location: "JS frame :: chrome://anunciador/content/main.xul :: 
onBoldButtonCommand :: line 14"  data: no]

Это не имеет смысла для меня, потому что я включил режим редактирования с помощью:

editor.contentDocument.designMode = 'on';

Кроме того, если я только изменю строку

<editor id="editor" type="content-primary" editortype="html" src="about:blank" flex="1" />

до

<xhtml:iframe id="editor" src="about:blank"></xhtml:iframe>

Я могу редактировать и форматировать текст в iframe (но я действительно предпочитаю использовать редактор).

Я что-то забыл?

1 Ответ

3 голосов
/ 18 июля 2011

После долгих исследований кажется, что проблема в Gecko - ошибка - повторяющаяся, кстати.Очевидно, это окончательно решено. .

Пока мы ждем публичной сборки (или если вы не можете использовать будущую более новую версию XULRunner или Firefox), выможно использовать commandManager свойство редактора в качестве обходного пути.Этот объект предоставляет метод с именем doCommand(), который можно использовать для форматирования текста.Этот метод имеет три параметра: строку, представляющую команду (которая отличается от принятой execCommand(), объект param (который ДЕЙСТВИТЕЛЬНО громоздок при получении, но может быть проигнорирован в течение некоторого времени) и contentWindow редактора.

Если вы хотите, например, сделать выделение жирным, просто используйте этот метод следующим образом:

function onBoldButtonCommand() {
    editor.commandManager.doCommand("cmd_bold", {}, editor.contentWindow)
}

Однако, если вашей команде нужны параметры, она может стать немного более сложной.вам понадобится экземпляр интерфейса nsICommandParams (который будет объектом C ++, обернутым объектом JavaScript). Для получения этого объекта требуется некоторый очень эзотерический код, очевидно, включающий что-то вроде XPCOM или еще много чего:

var commandParams = Components.classes['@mozilla.org/embedcomp/command-params;1'].getService(Components.interfaces.nsICommandParams);

В этом объекте мы установим параметры команды как пары ключ-значение. Там У нас есть список параметров, принятых всеми командами. Не бойтесь фактаэта страница относится к коду C ++ - вы можете интуитивно отобразить его на JavaScript, а также, надеюсь, что кажется , что все команды получают наодин парам, "state_attribute".Если мы хотим установить цвет текста , например, мы устанавливаем параметр таким образом в объекте param:

commandParams.setCStringValue("state_attribute", "#FF0000");

Тогда вы просто "вызываете" вызов doCommand(), используяпараметр на этот раз:

editor.commandManager.doCommand("cmd_fontColor", commandParams, editor.contentWindow);

Приведенный ниже код является рабочим примером использования doCommand() как с параметрами, так и без них:

<window id="main" title="Anunciador Blog Editor" width="300" height="300"
   xmlns="http://www.mozilla.org/keymaster/gatekeeper/there.is.only.xul"
   xmlns:xhtml="http://www.w3.org/1999/xhtml">
   <script type="application/x-javascript">
   <![CDATA[
   var editor = null;
   function onLoad() {
       editor = document.getElementById('editor');
       editor.contentDocument.designMode = 'on';
   }

   function onBoldButtonCommand() {
       editor.commandManager.doCommand("cmd_bold", {}, editor.contentWindow)
   }

    function onRedTextCommand() {
        var commandParams = Components.classes['@mozilla.org/embedcomp/command-params;1'].getService(Components.interfaces.nsICommandParams);
        commandParams.setCStringValue("state_attribute", "#FF0000");
        editor.commandManager.doCommand("cmd_fontColor", commandParams, editor.contentWindow)
    }

   window.addEventListener("load", onLoad, false);
   ]]>
   </script>
   <toolbar>
       <button label="Bold" oncommand="onBoldButtonCommand();" />
       <button label="Red" oncommand="onRedTextCommand();" />
   </toolbar>
   <editor id="editor" type="content-primary" editortype="html" src="about:blank" flex="1" />
</window>

Кроме того, эта страница может быть полезным и этим еще более полезным (хотя частично написанным по-французски!).

...