Twincl: A New Attempt at “Rich Forum”

Obsoleted on Nov-4

We decided to make the idea open and renamed it, so the post has been obsoleted. Here is the new article: A Proposal for Rich Interactive Content Hypertext (RICH)

Updated on Aug-12

  1. The site now uses a more accessible WYSIWYG/Markdown dual-mode editor.
  2. A registration link with a promotion code is provided to register free trial accounts without Facebook login.

Motivation

The Internet forums and blogs today mainly consist of static text and images. Although rich, interactive contents can be made with HTML5/CSS/JavaScript technologies, most Internet users do not possess related programming skills. Sites like Google Map, Facebook or Twitter let you embed their contents in an iframe, but it’s their contents, not yours.

I made a new attempt to bridge the gap: those who code may write “plugins”, and everyone can create rich contents with plugins.

Example #1: Simple quiz

On twincl.com, a piece of rich content (which we called a twinclet, pronounced as “twink-lit”) is written within a twinclet block. For example, a simple-quiz twinclet block looks like this:

> answer="Alpha Centauri"
What is the closest star system to our Solar System?

> choice=2
Which planet is bigger than the others?
- Mars
- Earth
- Venus

The simple-quiz plugin is served by a tiny webpage (1.6KB compressed). Here is a live interactive quiz:

As you can see, with the simple-quiz plugin, anyone can add quizzes to a post in a breeze!

Example #2: Tic-tac-toe

With HTML5 canvas, graphics are made easy. Here is a tic-tac-toe twinclet example:

oox
.x.
o..

You can play Tic-tac-toe in normal or fullscreen mode here:

The plugin consists of two small files. The source code is put on github.com/arthurtw/tic-tac-toe for your reference.

Example #3: Go quiz

The last example I show here is a plugin for Go quiz. I built it on top of Jan Prokop’s WGo.js library. The data format used by go-quiz plugin is SGF (Smart Game Format), the most popular format to store Go game records.

Here is a live Go quiz:

Give it a try if you know the Go game rules!

How does the plugin work?

The Twincl plugin is executed within a sandboxed iframe. It communicates with the parent window using window.postMessage method. The compact window.TL=window.TL||{version:"1.0",init:...} script in the plugin code is a tiny messaging library.

Upon window.onload event, the plugin sends an init command to the parent, and receives the twinclet block to render. There is also a screen command to set the iframe height or fullscreen mode. More commands may be added in the future.

How to write a new plugin?

The steps to write a new Twincl plugin are as follows:

  1. Use the test plugin with a temporary URL to facilitate the plugin development.
  2. When it’s done, put the plugin files somewhere on the Internet. For static files with low traffic, GitHub or Dropbox can be a good place to start with. (If the traffic becomes high and causes some problem, we are glad to host the plugin files.)
  3. Go to /plugin/register to post a plugin registration document. We will add the plugin to the system as soon as we can.

Refer to the plugin development guide for details. The simple-quiz and tic-tac-toe plugins are good reference implementations.

window.localStorage can be used for state persistence/transfer between twinclets of the same plugin. The plugin may also make ajax or web API calls. Lastly, please keep the plugin lightweight and mobile-friendly. It shouldn’t be a full-blown website.

How to write a post on Twincl site?

  1. To post or comment on Twincl site, just login with a verified Facebook account. Alternatively, you may register a new Twincl account, and subscribe to the membership with a minimal fee. (Our point is to make the account less disposable, which we believe is a key to pleasant community experiences.)

  2. For those who do not want to login with a Facebook account nor to pay for an unknown site (yet :-), here is a registration link for free trial accounts, valid through 8/31:

    https://twincl.com/account/register?pcode=HFJ7NK

    (If you post any article by 8/31, the membership will be extended to the end of 2016; then we’ll see how things go and decide what to do next.)

Conclusion

There can be numerous new plugins for different areas (music, finance, science, games, to name a few). The best thing about the plugin is once it’s written, everyone can use it to create great contents beyond plain text and images.

I hope this “rich forum” attempt has intrigued you. Let me know if you have any comment, or new plugin idea!

1 comment Comment

Hacker News discussions: https://news.ycombinator.com/item?id=12232308

It seems Markdown editor is a big red flag. I‘m going to implement a real WYSIWYG editor, so the site is more accessible. (The editor has an editable HTML mode, but you can only modify content in that mode, not adding new special formats such as bold/italic/hyperlink/list.)