April 09, 2008

AIR wiki progress

I have made some progress with my AIR wiki. I now have a nice little AIR application that has the following functionality:

  • edit & save pages
  • navigating to pages through internal links
  • load page from a page index
  • supports a bunch of basic MediaWiki compatible wiki patterns:
    • bold text ('''bold''')
    • italics text (''italics'')
    • bullets (* bullet)
    • horizontal line (---)
    • heading levels 1 to 3 (==level1==, et cetera)
    • simple internal links ([[internal link]]
    • simple external links ([[http://...]])
I have tried to keep the wiki as simple as possible while at the same time trying to use some of the rich features of AIR. For example, I have built-in an automatic preview for the editor. The wiki source text is parsed and rendered in the HTML view while you are editing it. I thought that would be cool. I have also added a little numeric stepper that allows you to time travel through the revisions that have been made to the page you are editing.



The application uses a few of the excellent FamFamFam Silk Icons: ... I hope I am not breaking any licensing rules in that respect. Flex developers: check these icons out, because they are really useful.

You can download the first version of AIRWiki: here. It includes a source view. Admitted, the code needs cleaning, but there it is. Let me know what you think of it.

Architecture
I am applying a simple architecture style that is much inspired by Joe Berkovitz' MVCS. I like MVCS because it is plain and makes a lot of sense. I have a simple FrontController that provides access to the main use cases (Load page, Save page, ...). There also is a simple Model component that records the application state in properties such as currentPage. Only these two components are directly accessed from MXML components. Al the lower level stuff such as the actual storing of PageUpdates into the database is hidden from MXML. The database is even hidden from the FrontController, because I have implemented a StorageService that takes care of all the database interactions.

Datamodel
As I said, I want to keep things simple (because that is the essence of a wiki). Therefore, I wanted to have the simplest data model that I could think of. It consists of two entities: Page and PageUpdate. A Page consists of multiple PageUpdates, and a PageUpdate belongs to exactly one Page. The underlying SQLite database only has a single table "PAGE_UPDATE" for persisting the PageUpdate entities.

Page diffs
At the moment, a PageUpdate stores a complete page, and not a delta from the previous revision. I am working on that now. I have ported a Java TextDiff algorithm to ActionScript 3.0 to be able to generate unix style edit scripts which I could use as the deltas between PageUpdates. So far, that has resulted in a little Flex library named ASTextDiff and a test application. It compares textA and textB , resulting in a Diff report. This report can generate an edit script whichm, when applied to textA, results in textB 95% of the time (it is still somewhat buggy).

By the way, porting Java to AS3 by hand is not too difficult, but it is a pain. I believe it could very easily be automated. Doing it by hand is very tedious. First you will have to "rotate" all variable and class method definitions. For instance: int i in java becomes var i:int in AS3, and String someMethod(String s) in java becomes
function someMethod(s:String):String
in AS3
. Besides the syntax rotating, you also need to translate Java Collection classes and other concepts to AS3 classes and concepts. A Java Map for instance could be translated to a simple AS3 Object. I chose to create a simple AS3 class named Map that mimics the behavior of a Java Map.

Next
I intend to put the sources of my little project out in the open for everybody to use, probably on Google Code.

2 comments:

Christopher Wigginton said...

Looking forward to seeing your ASTextDiff AS3 class. I've been looking to implement a diff Engine in the FarCry CMS webtop.

GOPI On the Web said...

You made a beautiful application!! I mean the architecture, the coding, the layout... Great to use it and to learn how to deak with MVC/Flex/AIR ... thank you!