---------- Forwarded message --------- From: Marius Dumitru Florea <[email protected]> Date: Tue, May 21, 2019 at 1:06 PM Subject: Re: [xwiki-devs] [Proposal] WikiMacro inline editing: 2 new dedicated macros To: Simon Urli <[email protected]>
On Mon, May 20, 2019 at 11:57 AM Simon Urli <[email protected]> wrote: > Hello Marius, > > On 14/05/2019 13:12, Simon Urli wrote: > > > > > > On 14/05/2019 13:07, Marius Dumitru Florea wrote: > >> On Tue, May 14, 2019 at 2:04 PM Simon Urli <[email protected] > >> <mailto:[email protected]>> wrote: > >> > >> > >> > >> On 14/05/2019 13:02, Marius Dumitru Florea wrote: > >> > On Tue, May 14, 2019 at 1:55 PM Simon Urli <[email protected] > >> <mailto:[email protected]> > >> > <mailto:[email protected] <mailto:[email protected]>>> > >> wrote: > >> > > >> > > >> > > >> > On 14/05/2019 12:43, Marius Dumitru Florea wrote: > >> > > On Fri, May 10, 2019 at 11:21 AM Simon Urli > >> <[email protected] <mailto:[email protected]> > >> > <mailto:[email protected] <mailto:[email protected]>> > >> > > <mailto:[email protected] <mailto:[email protected] > > > >> <mailto:[email protected] <mailto:[email protected]>>>> > wrote: > >> > > > >> > > Hi Marius, all, > >> > > > >> > > On 09/05/2019 09:29, Simon Urli wrote: > >> > > > Hi Marius, all, > >> > > > > >> > > > On 08/05/2019 14:09, Marius Dumitru Florea wrote: > >> > > >> Hi Simon, > >> > > >> > >> > > >> As I commented on > >> > > https://github.com/xwiki/xwiki-platform/pull/1109 I > >> > > >> think > >> > > >> that most of the time you will want to use a > >> scripting > >> > macro + > >> > > HTML macro > >> > > >> like this: > >> > > >> > >> > > >> {{velocity}} > >> > > >> {{html clean="false"}} > >> > > >> <div ...><!-- Some wrapping around the content > >> that may > >> > depend > >> > > on the > >> > > >> macro > >> > > >> parameters --> > >> > > >> ... > >> > > >> <!-- Output the macro content here so that it > >> can be > >> > edited > >> > > in-line in > >> > > >> the WYSIWYG editor. --> > >> > > >> ... > >> > > >> </div> > >> > > >> {{/html}} > >> > > >> {{/velocity}} > >> > > >> > >> > > >> An example of such a macro could be: > >> > > >> > >> > > >> {{figure src="someImage.png"}}some > >> description{{/figure}} > >> > > >> > >> > > >> The macro code would look like this: > >> > > >> > >> > > >> {{velocity}} > >> > > >> {{html clean="false"}} > >> > > >> <div class="figure"> > >> > > >> <div class="figure-image-wrapper"> > >> > > >> <img src="..." class="figure-image" /> > >> > > >> </div> > >> > > >> <div class="figure-caption"> > >> > > >> <!-- Output the figure caption here so that > >> it can > >> > be edited > >> > > >> in-line in > >> > > >> the WYSIWYG editor. --> > >> > > >> </div> > >> > > >> </div> > >> > > >> {{/html}} > >> > > >> {{/velocity}} > >> > > >> > >> > > >> I know you can output DIVs with wiki syntax but > >> that's > >> > not the > >> > > point. The > >> > > >> point is that we want to use HTML for the UI and > >> leave > >> > the wiki > >> > > syntax > >> > > >> for > >> > > >> the user content. So I don't think > >> ``wikimacrocontent`` > >> > is that > >> > > useful > >> > > >> (if > >> > > >> it's only purpose is to help you output the > >> > > ``non-generated-content`` > >> > > >> DIV). > >> > > > > >> > > > so as Thomas mentioned in order to allow inline > >> editing I also > >> > > perform > >> > > > transformation on the generated list of blocks in > >> > > > DefaultWikiMacroRenderer to remove the macro marker > >> that > >> > can cause > >> > > > troubles for inline editing. So the > >> wikimacrocontent is > >> > used both to > >> > > > insert content, and to detect where to remove the > >> macro > >> > markers > >> > > during > >> > > > the transformation. > >> > > > > >> > > > Now right now even with this solution it's not > >> possible to > >> > inline > >> > > edit > >> > > > html macro because of the way it's designed: the > >> HTML > >> > macro only > >> > > create > >> > > > a raw blocks that contains all the html, so I > >> cannot easily > >> > > transform it > >> > > > for inline editing. IMO it requires a change in the > >> HTML > >> > macro. > >> > > > >> > > so, re the subject of HTML macro and the handle of > >> inline > >> > editing I was > >> > > actually wrong to assume that it was linked to the raw > >> block. > >> > It's > >> > > actually linked to the metadata that are currently not > >> > handled in the > >> > > custom HTML renderer of HTML macro. I created a > >> dedicated > >> > issue for it > >> > > (https://jira.xwiki.org/browse/XRENDERING-563), it's > >> actually > >> > easy to > >> > > fix since the mechanism already exist in > >> AnnotatedHTMLRenderer. > >> > > So I've been able to successfully create a very simple > >> inline > >> > editing > >> > > wiki macro like this: > >> > > > >> > > {{html wiki="true"}} > >> > > <div style="border: 1px solid red"> > >> > > ((({{wikimacrocontent/}}))) > >> > > </div> > >> > > {{/html}} > >> > > > >> > > I had to put the ((( ))) to avoid having the > >> wikimacrocontent > >> > rendered > >> > > inline, maybe there's a way to do it cleaner, but I > >> just > >> > wanted to > >> > > check > >> > > that it's working there. > >> > > IMO it should really be the next priority in terms of > >> > usability of > >> > > inline editing, to find a way to allow inline > >> editing of > >> > inline macro. > >> > > > >> > > > >> > > Would it be hard to have a scripting API equivalent for > the > >> > > wikimacrocontent macro? I don't like mixing HTML with wiki > >> syntax > >> > (you > >> > > can get into trouble easily). As a wiki macro developer I > >> would > >> > prefer > >> > > to be able to write something like this: > >> > > > >> > > {{velocity}} > >> > > {{html clean="false"}} > >> > > <div class="my-macro"> > >> > > $xcontext.macro.renderNonGeneratedContent() > >> > > </div> > >> > > {{/html}} > >> > > {{/velocity}} > >> > > Thanks, > >> > > Marius > >> > > >> > Basically this API would need to: > >> > 1. Create the div around the macro content > >> > 2. Add a marker around that div to specify that > >> everything's inside > >> > should be kept (since we need to remove the other macro > >> markers in the > >> > WikiMacroRenderer) > >> > 3. Render the div + the content in the right target > syntax > >> > > >> > What bothers me here is that I don't think we would have > >> access to the > >> > rendering context, to know the syntax that should be used to > >> render the > >> > metadata. > >> > > >> > > >> > The alternative is: > >> > > >> > {{velocity}} > >> > {{html clean="false"}} > >> > <div class="my-macro"> > >> > ... > >> > {{html}} > >> > > >> > {{wikimacrocontent/}} > >> > > >> > {{html clean="false"}} > >> > ... > >> > </div> > >> > {{/html}} > >> > {{/velocity}} > >> > It feels like a hack, but I can leave with it. > >> > >> Actually you could do: > >> > >> {{html wiki="true"}} > >> <div class="my-macro"> > >> {{wikimacrocontent/}} > >> </div> > >> {{/html}} > >> > >> but yeah it's mixing both syntax. > >> > >> I want to avoid this if possible. > > > > Now I have to check but with > > https://jira.xwiki.org/browse/XRENDERING-563 you might be able to > > directly do: > > > > {{velocity}} > > {{html}} > > <div class="mymacro"> > > <div > > data-xwiki-non-generated-content="java.util.List<org.xwiki.Block>"> > > $xcontext.macro.content > > </div> > > </div> > > {{/html}} > > {{/velocity}} > > > > However I don't know how it would handle content containing other macros. > > So I just tested how we would do that, and I managed to do it using the > following code: > {{velocity}} > {{html}} > <div style="border: 1px solid red"> > <div class="xwiki-metadata-container" > data-xwiki-non-generated-content="java.util.List<org.xwiki.Block>" > data-xwiki-wikimacrocontent="true" data-xwiki-syntax="xhtml/1.0"> > $xcontext.macro.content > </div> > </div> > {{/html}} > {{/velocity}} > > Note that the syntax metadata is mandatory here since the HTML Macro > will consider that it's content is HTML. > > Now there is one remaining issue: we cannot apparently insert macro in > it. Here's the parameter request which is sent: > > <!DOCTYPE+html+PUBLIC+"-//W3C//DTD+XHTML+1.0+Strict//EN"+" > http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd";><html+xmlns=" > http://www.w3.org/1999/xhtml > "+xml:lang="en"+lang="en"><body><!--startmacro:toto|-||-|<p>Some+content+inside+the+macro+encore+un+test?</p><p>un+autre+<strong>test</strong></p>--><div+data-xwiki-non-generated-content="java.util.List<org.xwiki.Block>"+data-xwiki-syntax="xhtml/1.0"+data-xwiki-wikimacrocontent="true"+class="xwiki-metadata-container"><p>Some+content+inside+the+macro+encore+un+test?</p><div+class="wikimodel-emptyline"></div><p><!--startmacro:box|-|__cke_selected_macro="true"|-|dfgsdg--><!--stopmacro--></p><p>un+autre+<strong>test</strong></p></div><!--stopmacro--><div+class="wikimodel-emptyline"></div></body></html> > > you can see the markers for the box macro, with a new paragraph around > it and an empty line before it. > Here's the body answer of the request: > > <body id="body" class="skin-flamingo viewbody main wiki-xwiki > space-TotoMacro"><!--startmacro:toto|-||-|<p>Some content inside the > macro encore un test?</p><p>un autre <strong>test</strong></p>--><div > style="border: 1px solid red"> > <div class="xwiki-metadata-container" > data-xwiki-non-generated-content="java.util.List<org.xwiki.Block>" > data-xwiki-syntax="xhtml/1.0" data-xwiki-wikimacrocontent="true"> > <p>Some content inside the macro encore un test?</p><p>un autre > <strong>test</strong></p> > </div> > </div><!--stopmacro--><div class="wikimodel-emptyline"></div></body> > > The fact that the macro marker is missing is expected since I removed it > after transformation in WikiMacroRenderer. However, it should have been > transformed: we should get the HTML for the box. I still need to > investigate to understand why it disappeared. > > > I'm not sure if I need to document this way to allow inline editing of > macro content, or maybe just in HTML macro page? WDYT? > I think it's worth documenting it on the wiki macro documentation page or on the tutorial about writing a wiki macro, as an advanced feature. I don't think the HTML macro page is the right place. Thanks for working on this, Marius > > Simon > > >> > >> Still it's working. > >> > > >> > Thanks, > >> > Marius > >> > > >> > > > >> > > > >> > > Simon > >> > > > > >> > > > Simon > >> > > >> > >> > > >> Thanks, > >> > > >> Marius > >> > > >> > >> > > >> > >> > > >> On Tue, May 7, 2019 at 9:21 AM Simon Urli > >> > <[email protected] <mailto:[email protected]> > >> <mailto:[email protected] <mailto:[email protected]>> > >> > > <mailto:[email protected] > >> <mailto:[email protected]> <mailto:[email protected] > >> <mailto:[email protected]>>>> > >> > wrote: > >> > > >> > >> > > >>> Hi everyone, > >> > > >>> > >> > > >>> I'm currently working on allowing inline editing > >> on new > >> > wikimacros. > >> > > >>> My first challenge right now is to cope with the > >> problem of > >> > > inserting > >> > > >>> the macro content and allowing to inline edit it. > >> > > >>> > >> > > >>> In order to do so, I propose to create two new > >> dedicated > >> > macro: > >> > > >>> - wikimacrocontent: would allow to insert and > >> inline > >> > edit a > >> > > wiki > >> > > >>> macro content > >> > > >>> - wikimacroparameter: the same for a > >> parameter. > >> > > >>> > >> > > >>> The idea would be to be able to write something > >> such as: > >> > > >>> > >> > > >>> {{velocity}} > >> > > >>> {{wikimacrocontent/}} > >> > > >>> This is a content of > >> $xcontext.macro.content.length() > >> > characters. > >> > > >>> {{/velocity}} > >> > > >>> > >> > > >>> So the purpose of those macros would be twofold: > >> > > >>> 1. to ease the insertion of macro > >> content/parameters (no > >> > > need to > >> > > >>> always use > >> {{velocity}}$xcontext.macro.content{{/velocity}} > >> > > >>> 2. to create the dedicated metadata around > the > >> > content and > >> > > to be > >> > > >>> processed during wikimacro rendering to allow > >> inline editing > >> > > >>> > >> > > >>> Of course those macro would be only to be used > >> inside a > >> > wikimacro. > >> > > >>> I started to develop the wikimacroccontent, so I > >> have a > >> > first > >> > > working > >> > > >>> POC, but I'd like to know WDYT about this. > >> > > >>> > >> > > >>> I would also be really happy if you could give me > >> some > >> > wikimacro > >> > > >>> examples where the inline editing would make > >> sense, so I > >> > could > >> > > use it in > >> > > >>> my tests. > >> > > >>> > >> > > >>> Thanks, > >> > > >>> Simon > >> > > >>> -- > >> > > >>> Simon Urli > >> > > >>> Software Engineer at XWiki SAS > >> > > >>> [email protected] > >> <mailto:[email protected]> <mailto:[email protected] > >> <mailto:[email protected]>> > >> > <mailto:[email protected] <mailto:[email protected]> > >> <mailto:[email protected] <mailto:[email protected]>>> > >> > > >>> More about us at http://www.xwiki.com > >> > > >>> > >> > > > > >> > > > >> > > -- > >> > > Simon Urli > >> > > Software Engineer at XWiki SAS > >> > > [email protected] <mailto:[email protected]> > >> <mailto:[email protected] <mailto:[email protected]>> > >> > <mailto:[email protected] <mailto:[email protected]> > >> <mailto:[email protected] <mailto:[email protected]>>> > >> > > More about us at http://www.xwiki.com > >> > > > >> > > >> > -- > >> > Simon Urli > >> > Software Engineer at XWiki SAS > >> > [email protected] <mailto:[email protected]> > >> <mailto:[email protected] <mailto:[email protected]>> > >> > More about us at http://www.xwiki.com > >> > > >> > >> -- Simon Urli > >> Software Engineer at XWiki SAS > >> [email protected] <mailto:[email protected]> > >> More about us at http://www.xwiki.com > >> > > > > -- > Simon Urli > Software Engineer at XWiki SAS > [email protected] > More about us at http://www.xwiki.com >
