TextKit

TextKit is a framework for creating Textual Graphics. It provides layers, styling, rich color, text justification, layouts, tables, view-ports, transparency, etc. All behind a beautiful object-oriented view model that is easy and humane to use

Underneath it also provides a rich rendering engine that is fully independent of any platform and can synthesize rendered code for ANSI Terminals, Web, and plain text format. Written in pure ECMAScript without incorporating any platform provided API, (no node/DOM API is used) and therefore works on any JavaScript platform.

The View Model of the TextKit

TextKit in its core, provides a 2D representation of text which is defined in a set of classes called Views — that are implementations of the ViewProtocol standard. These Views makes it possible to define a 2D textual object:

TextKit makes it possible to compose layers and views by combining the layers together.

Rendering Capabilities of TextKit

Rich Composition

In TextKit you can combine scenes together and each View preserves the boundary for itself. So the children of the view are always retained within the boundaries of the view. This makes it possible to do all sorts of powerful things. — P.S. Look how the borders of the boxes are combined together in their intersections :)

Unicode Box Fine Tunning

TextKit's Canvas view can fine tune the intersections of unicode boxes. This table is made of putting 30 independent boxes together, but TextKit can change the characters at where these boxes are joined together and it also understands the weights of these connections. So the result is a very beautiful and fine tunned result that previously was impossible or extremely hard to implement. (I know of no other system that implements anything like this. Monodraw does have this ability but it only works for the light lines and weight detection is still unique to TextKit I guess)

Cropping & Slicing

TextKit offers a fast and virtually footprint-free system for cropping views. This makes for a great tool for making layouts, scroll views, etc...

Platform Independent Rendering

The design of TextKit is around a central idea of having different renderers for different environments, which are open to anyone to also extend and add to. TextKit has a Virtual Screen and Ray-Tracker system that makes it possible to compute optimized native renders for each platform that look exactly the same.

Installation and Usage

For now, I'm designing the system so it is both unstable and the API is subject to drastic change. You can look at the playground examples to get an idea of how to use the system. And the package can be installed using and used as:

% npm install --save @kary/textkit

import * as TextKit
    from "@kary/textkit"

You can also play inside the playground. TextKit has its own environment for playing around. The playground can be used by cloning the repo and then running:

Learn more about the playground and its capabilities →

Notes on the Active Development

There are a lots of bugs and things that are missing. I have them listed in the projects section. Please remember that this project is not even in it's alpha release phase. It is under heavy development and many of the parts are still missing.

© Copyright 2020—present by Pouya Kary. All rights reserved.