Announcement

Do not use the forums to submit bug reports, feature requests or patches, submit a New Ticket instead.

#1 2008-04-03 15:48:51

EduSantos
New member
Registered: 2008-04-02
Posts: 2

Trying to create a Wiki conversion plugin

I'm trying to create a new Xinha module with Wiky, so you can switch between HTML, Wiki and AsciiMathML markups. The idead was, when you press the button, it switches to Wiki, the same way Xinha swicthes to HTML. I've read this post (http://xinha.gogo.co.nz/punbb/viewtopic.php?id=1054), but I still could'nt make the module work for good. So, this is what "ive done so far:

1 - Created a new folder in plugins folder, called Wiky
2 - Created a file named wiky.js with the following code:

function Wiky(editor) {
  this.editor = editor;
    var cfg = editor.config;
    var self = this;

    cfg.registerButton({
                id       : "wiky",
                tooltip  : this._lc("Convert the selected text to Wiky"),
                image    : editor.imgURL("ed_link.gif", "Wiky"),
                textMode : false,
                action   : function(editor) {
                             self.buttonPress(editor);
                           }
            });

    cfg.addToolbarElement("wiky", "htmlmode",1);

}

Wiky._pluginInfo = {
    name          : "Wiky",
    version       : "0.95",
    developer     : "Stefan Goessner/2005-06",
    developer_url : "http://goessner.net/",
    c_owner       : "Stefan Goessner/2005-06",
    sponsor       : "Stefan Goessner/2005-06",
    sponsor_url   : "http://goessner.net/",
    license       : "http://creativecommons.org/licenses/LGPL/2.1/"
};

Wiky.prototype._lc = function(string) {
    return Xinha._lc(string, 'Wiky');
};

Wiky.prototype.buttonPress = function(editor) {
    // Costruzione dell'oggetto parametri da passare alla dialog.
    outparam = {
        content : editor.getHTML()
    }; // Fine costruzione parametri per il passaggio alla dialog.
    editor._popupDialog( "plugin://Wiky/wiky", function( html ) {
        if ( !html ) {
            //user must have pressed Cancel
            return false;
        }
        editor.getHTML( html );
    }, outparam);
};

3 - I've also created a popups folder with a file called wiky.html, wich has the following code:

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
<html>
<head>
    <title>Switch to/from Wiki</title>
  <link rel="stylesheet" type="text/css" href="../../../popups/popup.css" />
  <link rel="stylesheet" type="text/css" href="wiky.css" />
  <link rel="stylesheet" type="text/css" href="wiky.lang.css" />
  <link rel="stylesheet" type="text/css" href="wiky.math.css" />
  <script type="text/javascript" src="../../../popups/popup.js"></script>
  <script type="text/javascript" src="wiky.js"></script>
  <script type="text/javascript" src="wiky.lang.js"></script>
  <script type="text/javascript" src="wiky.math.js"></script>
<script language="javascript">
  window.resizeTo(600, 450);
function Init() {
  __dlg_translate("Wiky");
  __dlg_init();

  var param = window.dialogArguments;
  document.getElementById("TAG").value = Wiky.toWiki(param["content"]);
  document.getElementById("TAG").focus();
}

function onCancel() {
  __dlg_close( null );
  return false;
}

function onOK() {
  var ret = Wiky.toHtml(document.getElementById("TAG").value);
  __dlg_close( ret );
}
</script>
</head>

<body class="dialog" onLoad="Init();">
<div class="title">Tag Editor</div>
<textarea name="TAG" id="TAG" cols=22 rows=5 style="width: 100%; height: 315px; margin-top: 8px; margin-bottom: 4px; font-family: monospace; font-size: 11px;"></textarea>
<div id="buttons">
    <button type="submit" name="ok" onclick="return onOK();">OK</button>
    <button type="button" name="cancel" onclick="return onCancel();">Cancel</button>
</div>
</body>
</html>

It's all based in EditTag plugin, and it works very well sending the content from the popup back to the editor, but I've tried to user the method   editor.insertHTML( html ) to retrieve the content from the popup, but it just insert the afther the other one I had, creating duplicated content. Is there a method that clear the editor content, so I can insert the new HTML.

My other doubt: i don't want to do this in a popup; I would like to do it the same way when you click to show the HTML source, but I've found some issues:

- I don't know how to change the editor's content and enable the toggle / untoggle feature.
- I also don't know how to include my Java Script code from the Wiky/popups/wiky.js, wich actually makes the conversion in the same Wiky/wiky.js file, wich is the plugin definition
- Even if I could include the code, there would be the toggle / untoggle problem. I could use the Wiky.prototype.buttonPress mehtod to call Wiky.toWiki, but how could i chnge it back to HTML calling Wiky.toHtml?

It's a long post, but I guess this plugin would be a nice thing for Xinha.

Thanks for the help.

Offline

#2 2008-04-12 15:53:25

ray
Xinha Administrator
From: Germany
Registered: 2005-03-23
Posts: 521
Website

Re: Trying to create a Wiki conversion plugin

Use editor.getEditorContent()/editor.setEditorContent(html) to get/set all HTML

To mimic the look'n'feel of the source view it probably would be a good idea to use an inline dialog like Linker. Note that in the near future we will have a new plugin API (see http://xinha.webfactional.com/ticket/1176) that is mostly the same as the inline dialog, so this is also the best way to be future proof

I think the best way would be to  use an iframe in an inline dialog and load all your needed scripts in there

If you have any more questions, don't hesitate to ask

Offline

Board footer

Powered by FluxBB