Update on editor & TypeScript conversion

[Peter Kelly]

Hi everyone,

Just thought I’d let you know what I’ve been up to lately wrt. Corinthia. I’ve haven’t been actively posting on the list as I’m very much aware that the state of the codebase (in particular the javascript-based editor) is not exactly well documented or easy for those new to the code to understand, so I’ve been spending my time trying to improve on that.

The first step in this has been to convert the codebase from JavaScript to TypeScript. If you’re not already familiar with TypeScript, it’s basically an extended version of JS with support for static typing - it lets you specify the types of all function arguments and return types, define interfaces and classes, and many other features. I much prefer static typing over dynamic typing, due to the additional checks that are applied to the code at compile time. TypeScript compiles to JavaScript, so the end result can still be run in a browser or web view just as before; it only makes a difference for developers, as we can use better tooling for working with the editor code, and eventually provide a solid API definition so that the library can easily be embedded in other web applications.

I’ve just completed the rather long and tedious process of converting all the code over to TS. Being a superset of JS, you can pretty much take existing JS code and run it through the compiler and it will work. The real benefits come though as you add type annotations to functions and variables, as this causes the compiler to perform type checking, and the types serve as a sort of (basic) documentation of functions and methods, as you know what needs to be passed to them and what they will return.

The code is all in the https://github.com/corinthia/corinthia-editor repository (previously called editorlib); I’ve described some aspects of the conversion process in the commit logs, but will be writing it up in much more detail in a series of blog posts soon. Currently there is no API or internal documentation.

To compile, first install typescript:

npm install -g typescript

Then clone the repository and build the code:

git clone g...@github.com:corinthia/corinthia-editor.git

cd corinthia-editor

tsc

This will create a directory called “build”, containing two directories - “src” (the core library itself), and “tests” (supporting files for the test suite). All files in the build directory are javascript; those in the top-level src and tests directory are typescript (.ts).

To run the test suite, open the file tests/testharness.html in your browser. I’ve only fully tested this in Safari, but it also works with Chrome. If you’re using the latter though, you’ll need to serve up the files via a web server, as Chrome prohibits JS code from the local filesystem from reading local files. So in the root of the repository, do the following:

python -m SimpleHTTPServer

and then go to http://localhost:8000/tests/testharness.html

The next steps I have planned are:

1. Expose a small, well-defined public API that requires no knowledge of the internals, and is suitable for integration with other languages (e.g. Objective C, C++). This already exists but the functions are spread throughout all the files; I plan to put them all in one class where they can easily be seen.

2. Develop a web-based frontend (in the corinthia-webapp repositroy) that allows you to edit documents from within a browser

3. Package up the web app using Electron (http://electron.atom.io), so it can be used as a desktop app

4. Write a Node.js wrapper for the DocFormats, so that the library can be called from JavaScript. This will allow both server-side side usage, as well as client-side in the case of Electron (which is based on Node.js). I think Franz developed something for the former case a while back so will look into that before I do anything.

As I go along I’m going to try and start writing a lot more about the project - we don’t even have a website right now, which needs to be fixed. I am open to offers of help with this, and indeed all of the above :)

--
Dr. Peter M. Kelly
kell...@gmail.com

http://www.kellypmk.net/

PGP key: http://www.kellypmk.net/pgp-key

(fingerprint 5435 6718 59F0 DD1F BFA0 5E46 2523 BAA1 44AE 2966)

[Ian C]

Hi Peter,

I followed the instructions and all works well.

I used the command 
      git clone https://github.com/corinthia/corinthia-editor.git

Instead of the one mentioned, git protocol didn't seem to work for me.

As you may have seen I have been fiddling in the ODF Lenses branch with a node based server toy test editor/repository more aimed at exercising production coverage, and as a means of processing and testing ODF docuements. But it also accepts Word documents. There is a great test document from Calibre I have which shows the conversion pretty well.

I will see if I can use the editor.

Thanks for the heads up on typescript, and I'll poke around editor and see if I can incorporate it.

--
You received this message because you are subscribed to the Google Groups "CorinthiaTeam" group.
To unsubscribe from this group and stop receiving emails from it, send an email to corinthiatea...@googlegroups.com.
For more options, visit https://groups.google.com/d/optout.

--

Cheers,

Ian C

[Ian C]

On Thu, Feb 18, 2016 at 12:41 AM, Peter Kelly <kell...@gmail.com> wrote:

Hi everyone,

Just thought I’d let you know what I’ve been up to lately wrt. Corinthia. I’ve haven’t been actively posting on the list as I’m very much aware that the state of the codebase (in particular the javascript-based editor) is not exactly well documented or easy for those new to the code to understand, so I’ve been spending my time trying to improve on that.

The first step in this has been to convert the codebase from JavaScript to TypeScript. If you’re not already familiar with TypeScript, it’s basically an extended version of JS with support for static typing - it lets you specify the types of all function arguments and return types, define interfaces and classes, and many other features. I much prefer static typing over dynamic typing, due to the additional checks that are applied to the code at compile time. TypeScript compiles to JavaScript, so the end result can still be run in a browser or web view just as before; it only makes a difference for developers, as we can use better tooling for working with the editor code, and eventually provide a solid API definition so that the library can easily be embedded in other web applications.

I’ve just completed the rather long and tedious process of converting all the code over to TS. Being a superset of JS, you can pretty much take existing JS code and run it through the compiler and it will work. The real benefits come though as you add type annotations to functions and variables, as this causes the compiler to perform type checking, and the types serve as a sort of (basic) documentation of functions and methods, as you know what needs to be passed to them and what they will return.

The code is all in the https://github.com/corinthia/corinthia-editor repository (previously called editorlib); I’ve described some aspects of the conversion process in the commit logs, but will be writing it up in much more detail in a series of blog posts soon. Currently there is no API or internal documentation.

To compile, first install typescript:

npm install -g typescript

Then clone the repository and build the code:

git clone g...@github.com:corinthia/corinthia-editor.git

cd corinthia-editor

tsc

This will create a directory called “build”, containing two directories - “src” (the core library itself), and “tests” (supporting files for the test suite). All files in the build directory are javascript; those in the top-level src and tests directory are typescript (.ts).

To run the test suite, open the file tests/testharness.html in your browser. I’ve only fully tested this in Safari, but it also works with Chrome. If you’re using the latter though, you’ll need to serve up the files via a web server, as Chrome prohibits JS code from the local filesystem from reading local files. So in the root of the repository, do the following:

python -m SimpleHTTPServer

and then go to http://localhost:8000/tests/testharness.html

FYI just installed typedoc - see https://github.com/sebastian-lenz/typedoc from  http://typedoc.io/

And after a couple of iterations the command the generated the documentation was ...

typedoc -t ES5 -m system --out doc src

The resulting index.html can be served out via the same python server as above.

We need a bunch of comments, but it provides a different way to see the code structure and links directly into github.

More if and when I find anything interesting...

 

The next steps I have planned are:

1. Expose a small, well-defined public API that requires no knowledge of the internals, and is suitable for integration with other languages (e.g. Objective C, C++). This already exists but the functions are spread throughout all the files; I plan to put them all in one class where they can easily be seen.

2. Develop a web-based frontend (in the corinthia-webapp repositroy) that allows you to edit documents from within a browser

3. Package up the web app using Electron (http://electron.atom.io), so it can be used as a desktop app

4. Write a Node.js wrapper for the DocFormats, so that the library can be called from JavaScript. This will allow both server-side side usage, as well as client-side in the case of Electron (which is based on Node.js). I think Franz developed something for the former case a while back so will look into that before I do anything.

As I go along I’m going to try and start writing a lot more about the project - we don’t even have a website right now, which needs to be fixed. I am open to offers of help with this, and indeed all of the above :)

--
Dr. Peter M. Kelly
kell...@gmail.com

http://www.kellypmk.net/

PGP key: http://www.kellypmk.net/pgp-key

(fingerprint 5435 6718 59F0 DD1F BFA0 5E46 2523 BAA1 44AE 2966)

--
You received this message because you are subscribed to the Google Groups "CorinthiaTeam" group.
To unsubscribe from this group and stop receiving emails from it, send an email to corinthiatea...@googlegroups.com.
For more options, visit https://groups.google.com/d/optout.

--

Cheers,

Ian C

[Franz de Copenhague]

Hi there,

 

I am having errors running tsc in my system:

 

C:\GitHub\corinthia-editor>tsc -v

message TS6029: Version 1.5.3

 

C:\GitHub\corinthia-editor>tsc

error TS5023: Unknown compiler option 'moduleResolution'.

error TS5023: Unknown compiler option 'jsx'.

 

I will try to install TypeDoc like Ian did.

 

I am very interested in JavaScript, Node.js, typescript and C++ binding with javascript V8 engine. Also, chromium app on top is a great idea.

 

Let’s see how I can help,

Franz

[Franz de Copenhague]

Yes, it is worthy.

 

Franz

 

C:\GitHub\corinthia-editor>npm install typedoc --global

C:\Users\Franz\AppData\Roaming\npm\typedoc -> C:\Users\Franz\AppData\Roaming\n

pm\node_modules\typedoc\bin\typedoc

C:\Users\Franz\AppData\Roaming\npm

`-- typ...@0.3.12

  +-- fs-e...@0.22.1

  | +-- grace...@4.1.3

  | +-- json...@2.2.3

  | `-- rim...@2.5.2

  |   `-- gl...@7.0.0

  |     +-- infl...@1.0.4

  |     | `-- wra...@1.0.1

  |     +-- inhe...@2.0.1

  |     +-- on...@1.3.3

  |     `-- path-is-...@1.0.0

  +-- handl...@3.0.3

  | +-- opti...@0.6.1

  | | +-- mini...@0.0.10

  | | `-- word...@0.0.3

  | +-- sourc...@0.1.43

  | | `-- amde...@1.0.0

  | `-- ugli...@2.3.6

  |   +-- as...@0.2.10

  |   `-- opti...@0.3.7

  +-- highli...@8.9.1

  +-- mar...@0.3.5

  +-- mini...@2.0.10

  | `-- brace-e...@1.1.3

  |   +-- balance...@0.3.0

  |   `-- conca...@0.0.1

  +-- prog...@1.1.8

  +-- she...@0.5.3

  +-- typedoc-def...@0.3.4

  `-- types...@1.6.2

 

 

C:\GitHub\corinthia-editor>typedoc -t ES5 -m system --out doc src

 

Using TypeScript 1.6.2 from C:\Users\Franz\AppData\Roaming\npm\node_modules\typ

edoc\node_modules\typescript\lib

Rendering [========================================] 100%

 

Documentation generated at C:\GitHub\corinthia-editor\doc