The Shape of Things to Come
Arizona State University approached SitePen to bring their physics tutoring desktop application to the web. The Andes Tutor allows students to complete physics tutorials in a natural and intuitive way. Students are presented with a drawing surface and shapes to approximate physical objects, and text tools to create natural language statements and equations. The application continuously provides feedback on the correctness of the student's solution.
Until recently, drawing applications on the web were rare, and usually implemented in Adobe Flash. Recent advances in browser technologies made developing a drawing application using native browser features possible. Toolkits to make this easier were missing, and SitePen came to the rescue.
Discovery
ASU had clear web application requirements. SitePen quickly refined the application design during close collaboration with ASU during the discovery phase. Once the application design was ready, proving that native browser technology would work was next. SitePen chose to build on top of DojoX GFX, the Dojo Toolkit's excellent, low-level, cross-browser vector drawing API that wraps the native features in Firefox, Safari and Internet Explorer to give developers a consistent API for drawing vector-based shapes.
Extending the GFX API, SitePen created the DojoX Drawing module, enabling users to draw and resize lines and shapes directly in the browser. Desktop applications like Adobe Illustrator and Microsoft Visio have provided this intuitive drawing interface for years—and now with DojoX Drawing, similar web-based applications can be built, including The Andes Tutor.
Development
SitePen made extensive use of the Dojo Toolkit to efficiently and cost-effectively deliver a high quality application. The Dijit layout system, Tundra theme, and other widgets were used to construct the application quickly, allowing SitePen to focus on the business logic of the application.
SitePen worked closely with ASU as they developed the Andes server, responsible for providing corrective feedback of the shapes and equations by the students. Communication with the Andes server uses a pluggable version of Dojo's SMD functionality, making it possible to swap in other transports in the future.
Contributing to the Open Web
Both SitePen and ASU decided the unique technologies developed for this application are freely available for use by others. The full source code of the drawing library has been contributed back to the Dojo Foundation.
DojoX Drawing contains extremely readable source code and easy modularity including different drawing tools, effects, and plugins for things like pan and zoom. The architecture of Drawing allows for easy improvements and enhancements, possibly achieving the functionality of a desktop drawing program such as Flash or Visio in the future.
Among the innovations in DojoX Drawing were the infinite canvas which could theoretically zoom and pan forever, and never show the "edge" of the drawing. One of the hurdles of the infinite canvas was the fact that VML objects do not comprehend negative positions. This changed the scope of the task to only pan in a positive direction, to prevent objects from moving off the left side or the top of the canvas.
Another innovation is the Text Tool, allowing for very versatile styling of the text to match that of the SVG/VML text, and for text measurements and line breaks. The plugin architecture was a big success. Plugins can be created for the canvas or as actions. New drawing tools can be created and dropped in easily.
Delivery
In spite all of the challenges, the project was completed on time and on budget, and further development continues on the next version of the Andes Tutor.
