Skip navigation.

Blog

Skip the blog side panel.

On 23rd of April 2015, Mihai Șucan passed away due to metastatic cancer caused by RDEB.

My name is Mihai and I work on the Firefox developer tools. When it comes to web development, I like both server-side and client-side work. I am mainly interested in web browsers, web standards and related technologies.

New article: SVG or Canvas?

Just a quick note to people around here: Opera Software has recently published a new article I wrote: SVG or Canvas? Choosing between the two. You can also read the article on my server. As usual, thanks go to Chris Mills for reviewing and providing feedback for improvements to the article.

In unrelated news, things are going fine around here. A new web site I've been working on will be released to the public pretty soon. More cool stuff will come. ;)

PaintWeb and Moodle Git repository

Hello everyone!

I am getting closer to having a Moodle demo ready with PaintWeb integrated. Wednesday I had a very fruitful discussion with my mentor, Martin, on how I should proceed with the implementation of file saving inside the Moodle data directory. We have come to a conclusion which I am about to implement. More details soon.

For now, I have registered a Moodle Git repository mirror over at repo.or.cz. I have also registered a Moodle "fork" where I publish my Moodle branches. You can do:

git clone git://repo.or.cz/moodle/mihaisucan.git ~/src/moodle-mihai
cd ~/src/moodle-mihai
git checkout -b mdl19-paintweb origin/mdl19-paintweb

With that, you can easily and quickly get an always up-to-date Moodle 1.9 stable branch with TinyMCE 3 and PaintWeb integrated. You can already play with PaintWeb in Moodle.

If you only want the TinyMCE 3 editor you can do:

git checkout -b mdl19-tinymce3 origin/mdl19-tinymce3

The TinyMCE 3 branch holds Moodle 1.9 stable with the latest TinyMCE 3 integrated. The work I did on this branch is best explained in a Moodle forum discussion.

When you want to update your branch simply invoke git pull. Please also check the official documentation about how to use Git.

In related news, Opera Software has published the final part of the article serie I wrote about keyboard accessibility in Web applications. This article details the cross-browser compatibility layer implementation for keyboard events used by PaintWeb.

Enjoy!

Updated TinyMCE 3 in Moodle 1.9

Hello again!

The Google Summer of Code midterm evaluations passed without any problems for me, yay!

I have began work on integrating PaintWeb into Moodle. I will integrate my project into the stable Moodle 1.9 branch and into the upcoming Moodle 2.0 release.

Moodle 1.9 has a very old TinyMCE release (version 2.0) which is not used by default - the even older HTMLArea is still used. Both do not work in Opera and Google Chrome. For this reason Martin Langhoff, my mentor, and other Moodle community members have worked on patches to switch to the modern TinyMCE 3 editor. A clean port of TinyMCE 3 to Moodle 1.9 is available on the Moodle forums.

The clean port is quite well done, but again, it was "outdated", being from october 2008.

For PaintWeb I took the work Martin did and updated it to the latest Moodle 1.9 stable branch, the latest TinyMCE 3 version, and made additional fixes. One fix was to make the editor show up in Opera, Safari and Chrome, and another fix was for the script which converts TinyMCE language files to Moodle language files.

PaintWeb integration into Moodle 1.9 will come as a patch on top of the TinyMCE 3 patch. Currently I got PaintWeb loading fine in TinyMCE, inside Moodle. More work is needed to get file save working. For PaintWeb I did some assorted fixes for the Makefile, for the overall keyboard accessibility, for multi-language support, and I did improvements to the TinyMCE plugin.

You can download the updated TinyMCE 3 patch for Moodle 1.9. The package includes usage instructions.

In other related news, Opera Software has published the second part of the article I wrote about keyboard accessiblity in Web applications. This article describes the inner workings of the MouseKeys extension for PaintWeb. Make sure you checkout the updated and improved source code of the MouseKeys extension in the PaintWeb code tree.

Have fun until the next time!

PaintWeb documentation and TinyMCE plugin

Hello again!

In the past week there was important progress on PaintWeb. I have published several wiki pages about PaintWeb on Google Code - this documentation comes as an overview or a guide to the entire codebase and the API reference. You can read about how to integrate PaintWeb into your Web application, how to extend PaintWeb, how to package PaintWeb yourself with the Makefile, and how to use the new TinyMCE plugin.

I have completed a new TinyMCE plugin which allows you to easily and quickly integrate PaintWeb. This plugin allows users to click an "Edit" button which is overlayed on top of the editable images. The plugin also includes a context menu item (right-click and choose "Edit image"), and a toolbar button.

I have published a new demo page which shows the latest TinyMCE and PaintWeb working together. Enjoy!

Moodle integration is currently being planned. I wrote my thoughts and questions in a Moodle Docs wiki page about the paint tool integration.

Last, but not least, for the purpose of tracking progress, I have attached a packaged PaintWeb snapshot to the Moodle tracker issue associated with my project.

Olli Savolainen has created some very good mockups as proposals to improve the PaintWeb user interface. His feedback is very much appreciated, and I really hope to get to implement his suggestions as soon as possible. Thanks Olli!

On a related note, for those interested on how PaintWeb implements keyboard shortcuts, Opera Software has just published the first part of a series of articles I wrote on this topic. More articles will be published soon at the Opera Developer community site.

Have fun testing PaintWeb and reading articles about it. Don't forget that I am always looking forward for feedback!

Google Summer of Code for the Moodle project

Hello everyone!

I have great news this time! I have applied to work for the Moodle project over the summer within the Google Summer of Code program. My project proposal has been accepted. This means that over the summer I will be working on integrating the PaintWeb project into Moodle. Part of this work will also include a complete code reorganization and several important improvements.

Locally I have already started working towards code reorganization and a complete rework of the keyboard shortcuts support inside PaintWeb is ready. This work will become public very soon.

I am really glad to be working with one of the best open-source educational software. The Moodle community has been very nice and they welcomed me warmly. Congratulations to every student who has been accepted this year!

On a related note, Opera Software has published a tutorial I wrote about how you can start developing your own paint tool. The code presented is strongly based on my work for PaintWeb. Another new tutorial is now being prepared for publishing.

Best luck to everybody and stay tuned for more!

New canvas tutorial

Hello everyone and a happy new year!

Opera Software has just published my third tutorial: HTML 5 canvas - the basics. Hopefully, I will have more tutorials coming about canvas and other Web technologies.

With this occasion I have updated my site and I added a new Tutorials page.

As usual, any feedback is welcome! So, please go ahead and provide me with critiques, suggestions and anything you deem important.

My first tutorial: How to add voice to your site

Hello guys!

Today Opera Software has released a new site: The Opera Developer community site. The purpose is great, and I like major web browsers having their own developer community sites.

As the title of this post announces ... the site already had published my first tutorial :). If you've read my previous blog posts, it's not a big surprise my first tutorial is about voice interactivity. Currently, very few know about VoiceXML, and there are very few tutorials. Most of them reach only the level of "Hello world". Therefore, my tutorial goes much further, by actually telling you how to put voice to use in your site. I didn't write yet-another tutorial about AJAX, XHTML, CSS, DOM, or JavaScript. I wanted something different.

Go ahead and read the tutorial from dev.opera or from my own server (mirror).

Thanks very much to TarquinWJ and Jax. The tutorial has reached the level of maturity you are seeing thanks to both of them. :)

Any suggestions or comments are welcome.