On Wednesday, March 7, 2012 2:07:38 PM UTC+1, Damien Picard wrote:
>
> Hi,
>
> You can find a demo here : http://surface-sample.elasticbeanstalk.com/


Thanks.

It's indeed a very young project: you cannot apply style across paragraphs 
or other styles' boundaries (typical example: "fo<b>o b<i>a</b>r b</i>az" → 
fo*o b**ar b*az)
That's one of the hardest things to handle in an editor, and the very first 
thing I try out ;-)
 

> Indeed, I'm reinventing the wheel. I did not known the Wave editor, I will 
> take a look at it, but I'm not sure that handling something else than HTML 
> is the right thing to do in my use case. There is some existing wysiwyg 
> editors that uses the same idea of creating inserters instead of using 
> execCommand (Aloha, as an example).
> But there is always something missing to me :
>
>    - I need a GWT based wysiwyg (Wave editor, XWiki editor are candidates)
>    - I need to create specific inserters
>    - I need to control strictly the HTML output (because the HTML is 
>    exported with XSLT processors in my use case)
>
> Wave is based on documents that can easily be serialized as XML (that's 
what we use for persistence).
Because it has to to handle "operational 
transformation<http://www.waveprotocol.org/whitepapers/operational-transform>", 
inline styling (bold, italic, links, etc.) and paragraphs are represented 
by "markers". Styling is represented by "annotations", so the markers are 
"annotation boundaries", serialized in XML as processing instructions. 
Paragraph boundaries are representing by <line/> elements (similar to <br> 
in HTML except a <line/> marks the beginning of a paragraph, and can have a 
"type" and "level": title, ordered list, unordered list). These are just 
the built-in representations though, you're free to implement whatever you 
want (it'd just require a bit more work).
The "persistent document" is first processed to build a "local document" 
(<line/>xxx is transformed to <l:p>xxx</l:p>, annotations are transformed 
to <l:s> spans, etc.), then each element of this document is rendered into 
HTML. Each modification made on the document (either persistent or local) 
is passed to the renderer to update the view.
Have a look at http://www.waveprotocol.org/code/tutorials/writing-a-doodad
 and http://www.waveprotocol.org/wave-protocol-summit/wave-summit-talks 
(particularly 
“Wave model deep dive” by Alex North, and “Wave panel and rendering” and 
“Real-time editor & Doodads” by Dave Hearnden), and search for my mails on 
the Wave mailing lists, where people answered with many valuable 
information and links. Re. the code, start with the EditorHarness GWT app.

In our case, we chose to keep the paragraphs-via-<line/> and 
styling-via-annotations (because it was easier), and added table rendering, 
links (handled as elements so we can easily make sure we don't nest them), 
"semantic annotations" (same as links), and illustrations (similar to an 
image, but links to an entity that carries both the image and legend, among 
many other things).
In some "rich text areas", we're able to limit available features: some 
areas a "single paragraph" with only styling a "semantic markup", others 
allow several paragraphs but no titles, etc.
Finally, by listening to document changes, we keep a document outline, 
index of "semantic markup" (as CellTree widgets), and lists of tables and 
illustrations (as CellList widgets) in real-time.

The only thing needing real work is the copy/paste handling, which in Wave 
is tightly bound to Wave's "wavelet" document schema. In our case, we 
simply shadowed the class to strip every formatting and paste as plain text.

Overall, the code is complex but very well thought out, so once you grasped 
the concepts, it reads fairly easily.

>
>    - I need to process the HTML "in-place", by DOM manipulation
>
>
Not sure what you mean by that, but Wave uses DOM manipulations exclusively 
(see above).

-- 
You received this message because you are subscribed to the Google Groups 
"Google Web Toolkit" group.
To view this discussion on the web visit 
https://groups.google.com/d/msg/google-web-toolkit/-/NIFKhsOGvlUJ.
To post to this group, send email to [email protected].
To unsubscribe from this group, send email to 
[email protected].
For more options, visit this group at 
http://groups.google.com/group/google-web-toolkit?hl=en.

Reply via email to