Friday, July 12, 2013

Project Description

This summer, I will port Athens, a vector graphics library for Pharo, to Amber Smalltalk, as part of my Google Summer of Code (GSoC) project. The project mentors are Nicolas Petton and Igor Stasenko.
What is Athens and Amber Smalltalk?

Athens is a vector graphics library for Pharo that uses libcairo. Athens supports drawing various shapes such as rectangles and paths. Paths can consist of lines and curves (e.g. Bezier curves). Shapes can be drawn with a stroke color and a fill color (paints). The fill color can be a solid color, a color gradient (radial and linear), a bitmap, or another surface (i.e. another drawing). The shapes and paints that I mentioned before, are only the predefined ones that are supported out of the box. You can add your own shapes and paints that use already defined ones. If you are interested in Athens for Pharo, you can find it on Smalltalk Hub.

Amber is an implementation of Smalltalk that runs entirely in the web browser. It compiles Smalltalk code to JavaScript. Amber supports writing JavaScript code, as well. This can boost the performance (e.g. Amber has to wrap all message sends in Smalltalk to support things like "doesNotUnderstand". When writing JavaScript code directly, this is not the case). At some points, I made use of JavaScript inlining.

I will port Athens to Amber Smalltalk using the HTML5 Canvas. The Canvas provides methods for defining shapes (e.g. rectangles and paths) and filling them. Some browsers implement the Canvas with libcario. Most concepts from Athens can be mapped directly to the Canvas. There are, however, some limitations in the Canvas.

  1. The Canvas specification does not support all features that are supported by libcairo and Athens. For example, Canvas supports only 12 "globalCompositeOperations", whereas Athens supports more. There is no easy way to implement the missing ones, so we will skip these for now and implement them, once there is browser support.

  2. Some browsers do not implement the entire Canvas specification or implement it wrong. For example, some browsers support all 12 "globalCompositeOperations" in theory, but they do not draw them correctly. Another example is line dashing in paths: this feature is currently not supported by Firefox. Therefore, it will not work in Firefox (my current implementation simply draws a non-dashed line in Firefox).


My vision is to provide a common vector graphics library for Pharo and Amber Smalltalk. Afterwards, we can use Athens to draw user interfaces in Pharo and Amber Smalltalk with the same Smalltalk code. This allows us to write Smalltalk applications that run both in Pharo and in the web browser.

I prepared a schedule in my project proposal. You can take a look at it in order to get an overview of the next implementation tasks. The timeline is, however, outdated. You can track the project progress in this blog and on the demo website. Athens comes with a tutorial that explains the API. The demo website contains the whole tutorial. It is important, that you always execute step 2 before executing any other step because this step creates the Canvas surface.

Please feel free to write me an email or post in this blog if you want to share your ideas (concepts, implementation, API, or whatever), report a bug, or just want to leave a comment.
Important Links

Source Code on Github
Demo Website
Project Proposal

No comments:

Post a Comment