Notepad.exe in HTML5 and JavaScript

On the morning of 10 October, I tired of working on my capstone and had finished contributing a patch to an open-source project, I decided I needed a small, fun, project to quickly create as a change of pace. A few minutes later, either inspirational or pure randomness stuck: recreate Windows Notepad.

The idea was as ridiculous as it was ludicrous. The sheer thought of recreating Notepad, of all applications, was mind-numbing. After all, Notepad is a tiny, often useless, plain text, note taking application college-level textbooks insist on using to teach programming. It is often the center of many jokes, including the very humorous but real NotepadConf (which I would have absolutely attended just for the silly fun it would have been). Notepad is severely lacking in features (no spell check, for one), has odd defaults (word wrap is off), utterly trashes most formatted documents, and what is with the disabled Status Bar option since at least Windows 7? If it cannot be enabled except through the registry, why have it there in the first place?

However, I was bored and had no better idea, so went for it. Within an hour I had completed it and over the next few days I made minor adjustments until I was happy with it.

Therefore, I present to you now, Notepad.exe recreated in HTML5!

notepad-exe

Yes, it really does work. Menus, defaults, file save, it is all there. I even added printing for the fun of it! I also went a little crazy and add rough Windows 10 and Windows 7/8-ish themes to toggle between. πŸ˜› Obviously it is not an exact replica but very close. πŸ™‚

As always, you will find the source code and full feature list on GitHub and a live demo at le717.github.io/notepad.exe. If for some reason that URL is too hard to remember, I also have a copy at notepad.codetriangle.me. πŸ˜‰

Happy Notepadding!
-Caleb

Advertisements

Triangular Reactions

Fill in your details below or click an icon to log in:

WordPress.com Logo

You are commenting using your WordPress.com account. Log Out / Change )

Twitter picture

You are commenting using your Twitter account. Log Out / Change )

Facebook photo

You are commenting using your Facebook account. Log Out / Change )

Google+ photo

You are commenting using your Google+ account. Log Out / Change )

Connecting to %s