Dear Wiki user, You have subscribed to a wiki page or wiki category on "Lenya Wiki" for change notification.
The following page has been changed by JörnNettingsmeier: http://wiki.apache.org/lenya/GenericEditorAPI ------------------------------------------------------------------------------ == Quick start: how to make your editor work with Lenya == - 1. Create a module directory (FIXME: Link to Andreas' presentation). + 1. Create a module named after your editor (FIXME: Link to Andreas' presentation). - 1. Steal the java usecase handler code from the editors module. - (FIXME: is this the best one we have?) - - (FIXME: we should define a generic one that does 90% of all cases, and people can subclass that if necessary) + 1. Create a Java usecase handler, either by + 1. stealing the code from the editors module, putting it in $YOURMODULE/java and applying necessary changes. ''(current practice, BAD!)'' + 1. using it as it is (then you don't need to copy it). ''(good practice, not widely used - if you feel the existing stuff is not versatile enough, abstract your needs and put them upstream!)'' + (FIXME: is the code from the editors module the best one we have?) - 1. Create a usecase view: either steal it from the One-Form-Editor (JXTemplate-based, for an out-of-context form: [http://svn.apache.org/viewvc/lenya/trunk/src/modules/editors/usecases/forms/oneform.jx?view=markup oneform.jx]), or follow the TinyMCE approach for an in-place WYSIWYG editor (pipeline-based, check out the sitemap and the xslt!). + 1. Create a usecase view: either steal it from the One-Form-Editor (JXTemplate-based, for an out-of-context form: [http://svn.apache.org/viewvc/lenya/trunk/src/modules/editors/usecases/forms/oneform.jx?view=markup oneform.jx]), or follow the TinyMCE approach for an in-place WYSIWYG editor (pipeline-based, check out the sitemap ({{{<match pattern="tinymce.edit">}}})and the XSLT!). (FIXME: this needs better documentation!) + 1. Register your editor usecase by writing an xpatch file in {{{$YOURMODULE/config/cocoon-xconf/usecase-edit.xconf}}}: + {{{ + <xconf xpath="/cocoon/usecases" unless="/cocoon/usecases/[EMAIL PROTECTED] = '$YOURMODULE.edit']"> + <component-instance name="$YOURMODULE.edit" logger="lenya.publication" + class="org.apache.lenya.cms.$YOURMODULE.YourEditor"> + <transaction policy="pessimistic"/> + <!-- either the JXTemplate approach: --> + <view template="modules/$YOURMODULE/usecases/$YOURMODULE.jx" menu="false"/> + <!-- or the pipeline approach: --> + <view uri="cocoon://modules/$YOURMODULE/$YOURMODULE.edit" menu="false"/> + <!-- but not both :-D --> + </component-instance> + </xconf> + }}} + 1. Make sure that your view adds the following javascript snippets: {{{ <script type="text/javascript" src="/modules/editors/javascript/org.apache.lenya.editors.js"/> @@ -28, +43 @@ 1. "Insert Lenya Asset", either as new buttons, or hooked up as file browsers to some existing dialog. They should trigger functions in {{{youreditor_lenya_glue.js}}} where you can put the code that takes preset values from your editor and opens a usecase window pre-filled with those values (example: http://svn.apache.org/viewvc/lenya/trunk/src/modules/editors/resources/javascript/oneform_lenya_glue.js?view=markup oneform_lenya_glue.js) + {{{ + // These arrays are indexed by window name: + var objectData = new Array(); // For each triggered usecase: store its dataset. + var usecaseMap = new Array(); // For each opened window, store the usecase name. + + // This is a callback you need to implement: + // The usecase will call it when the user submits the form. + org.apache.lenya.editors.setObjectData = function(objectData, windowName) { + var currentUsecase = usecaseMap[windowName]; + var snippet = org.apache.lenya.editors.generateContentSnippet(currentUsecase, objectData); + org.apache.lenya.editors.insertContent( + document.forms['oneform'].elements['content'], + snippet + ); + usecaseMap[windowName] = undefined; // we're done! + objectData[windowName] = undefined; // we're done! + } + + // This is another callback you need to implement: + // The usecase will call it on loading to get its default data. + org.apache.lenya.editors.getObjectData = function(windowName) { + return objectData[windowName]; + } + + // This function is called by the editor buttons you created: + function triggerUsecase(usecase) { + var windowName = org.apache.lenya.editors.generateUniqueWindowName(); // a convenience function + // Now you need to do clever, editor-specific things to present useful defaults if your user has + // selected something. For getting at selected text, check out the following utility function. + // But maybe you can do even more: getting a DOM snippet and parsing attributes, for instance. + var selectedText = org.apache.lenya.editors.getSelectedText(document.forms[0].elements['content']); + switch (usecase) { + + case "insertLink": + objectData[windowName] = new org.apache.lenya.editors.ObjectData({ + url : "", /* Note we're setting the empty string as default, rather than omitting the field. + Undefined fields will cause the usecase to disable the form field (which is useful + if your editor wants to handle part of the settings itself). */ + text : selectedText, + title : "" + }); + break; + + case "insertImage": + // ... + case "insertAsset": + // ... + } + // a utility function you should use: + org.apache.lenya.editors.openUsecaseWindow(usecase, windowName); + usecaseMap[windowName] = usecase; + alert("Stored values for new window " + windowName + ":\n" + + "objectData[windowName] = '" + objectData[windowName] + "'\n" + + "usecaseMap[windowName] = '" + usecaseMap[windowName] + "'" + ); + } + }}} + + The ObjectData structure is defined by its prototype properties. Check {{{org.apache.lenya.editors.js}}}, it's documented. + == Contract between generic editor usecases (editors.insertImage, editors.insertLink) and editor-specific modules == --------------------------------------------------------------------- To unsubscribe, e-mail: [EMAIL PROTECTED] For additional commands, e-mail: [EMAIL PROTECTED]
