Your SlideShare is downloading. ×
OX Documents Explained
Upcoming SlideShare
Loading in...5

Thanks for flagging this SlideShare!

Oops! An error has occurred.


Introducing the official SlideShare app

Stunning, full-screen experience for iPhone and Android

Text the download link to your phone

Standard text messaging rates apply

OX Documents Explained


Published on

Explanations about OX Documents...

Explanations about OX Documents...

  • Be the first to comment

  • Be the first to like this

No Downloads
Total Views
On Slideshare
From Embeds
Number of Embeds
Embeds 0
No embeds

Report content
Flagged as inappropriate Flag as inappropriate
Flag as inappropriate

Select your reason for flagging this presentation as inappropriate.

No notes for slide


  • 1. Malte Timmermann – Head of Development Open-Xchange HamburgApril 2013OX Documents ExplainedFrom a technical point of view
  • 2. OX DocumentsCustomer Requirements2 OX Documents ExplainedDocumentsRound-tripSupport for MS Office and Apache OpenOffice / LibreOffice documentsPreserve content and layout of complex documentsWork together on shared documents, see other‘s people editsUsers want document editing inside OX App SuiteCollaborationIntegration
  • 3. Key Concept: Operations3 OX Documents ExplainedOperations• Describe document changes and entire document Examples: insertParagraph, insertText, setAttributes• Abstraction of file formats• Building block for “Operational Transformation“ (OT)• Allow collaborative editing (several authors change adocument at the same time, conflict resolution)• Used in Client-Server communication, could also be usedfor macro recording, scripting, ...
  • 4. Key Concept: Hybrid Edit Mode4 OX Documents ExplainedHybrid Edit Mode• Use the browser‘s edit mode for rendering as well as forcursor and selection handling, but not for editing• Intercept keyboard/mouse events and create operations fordesired actions• Apply operations with own logic using direct DOMmanipulations – do not let the browser do any DOMmanipulations!• Transfer operations to the server for persistence and forfurther distribution to other clients
  • 5. Architecture Overview5 OX Documents ExplainedOX TextAppOX TextEditorLorem ipsum dolor sitamet, consectetueradipiscing elit. Aeneancommodo ligula eget dolor. Aeneanmassa. Cum sociis natoquepenatibus et magnis dis parturientmontes, nascetur ridiculus mus.Donec quam felis, ultricies nec,OperationsDOMManipulationsBrowserOX TextOSGiDocumentConverterOpenOfficeODF <=>OperationsODFDOMOOXML <=>OperationsDOCX4JOX Files> ODF< OperationsODF / OOXML / Operations / other> Non-ODF/OOXML< ODFOperations(JSON)Client Server> OOXML< Operations
  • 6. Operations ProcessingStep 1 – Decomposing the document (on server)6 OX Documents ExplainedLorem ipsum dolorsit...Duis autem vel eumiriure dolor inhendrerit…Unknown object – will be ignoredOOXML to OperationsinsertParagraph start:[0]insertDrawing start:[1,0] imageUrl:“pic.jpg“,width=100, height=100, …insertText start:[2,0], text=„Duis autem…“setAttributes start:[2,5] end:[2,10]attrs:{fontweight=bold}insertText start:[0,0], text:“Lorem ipsum…“insertParagraph start:[1]Operations describe how to manipulate the document – including how to build it up from scratchinsertParagraph start:[2]
  • 7. Operations ProcessingStep 2 – Apply operations to editor (on client)7 OX Documents Explained<html><p> <p> <p>„Lorem…“ „Duis…“<img>insertTextinsertParagraphOperations toHTML DOMThe browser will do the layout and the renderingLorem ipsum dolor sit...Duis autem vel eum iriuredolor in hendrerit…insertDrawinginsertParagraphinsertTextinsertParagraph
  • 8. Operations ProcessingStep 3 – Edit document in browser (on client)8 OX Documents Explained• Intercept all events – do not let the browser do any DOM manipulations• Create operations for desired document manipulations For mouse/keyboard input as well as for actions triggered in the user interface• Apply these operations to HTML DOM (see step 2 on last slide) The browser will display the updated document• Send operations to the server - for persistence and for further distributionLorem ipsum dolor sit...Duis autem vel eum iriuredolor in hendrerit…Ut wisi enim ad minim…User Inputto Operations delete start:[2,5] end:[2,10]delete start:[1,0]splitParagraph start:[2,42]insertText start:[3,0], text:“Ut wisi...“
  • 9. Operations ProcessingStep 4 – Apply operations to document (on server)9 OX Documents Explained<XML><p> <p> <p>„Lorem…“ „Ut…“„Duis…“delete1Operationsto XML DOM*.docx, *.odt• This step is optional (for supporting legacy applications) It would also be possible to just make the operations list persistent<p>• Duplicate original document, build DOM tree• Use only the newly created operations to update the DOM tree• Do not touch any DOM nodes that you don‘t understand or don‘t care about,so the round-trip is nearly perfect!delete2splitParagraph3insertText42341Unknown object – still there!
  • 10. © 2013 Open-XchangeOX Documents Explained