Scriptable Web Application Toolkit
Written by Joe Hewitt (joe@joehewitt.com)
Last Updated: December 19, 1999
Current SWAT Version: 0.70a
Anyone who has attempted to create Dynamic HTML knows how painful it is to get your code to work the same on all platforms/browsers. If you are brave enough to do it, your end product will take forever to write, the javascript code will be ugly and messy, and users will be forced to download tons of code that isn't even intended to run on their browser. This is ridiculous. I got tired of doing it this way. I also ran out of patience for the W3C to save the day and for the world to upgrade to a 5.0 browser.... and so, SWAT was born.
However, SWAT is more than just a cross-browser API. It is actually a library of reusable components that you can use to quickly create dynamic applications. Think of it as a sort of MFC or Swing made out of Javascript, HTML, and CSS. SWAT-built applications should run identically on Netscape 4.x, IE4, and IE5. Support for Netscape 5 will come as soon as they work out a few crippling bugs.
Fundamentally, SWAT provides you with an object-oriented framework complete with classes, inheritance, polymorphism, and an event model. (Ideally, the designers of Javascript would have built this in from the beginning, but since they didn't, I did.) On top of that is a class called XLayer, which is where the cross-browser stuff comes in. XLayer's strength is that it allows Netscape 4.x to function similarly to IE4/5 using a common syntax. You can dynamically position and size, change CSS styles, set/retrieve innerHTML, and create and append child layers. The real fun comes in when you subclass XLayer to create more complex objects like buttons, menus, calendars, etc...
Currently, SWAT is a very very young project. I wouldn't even call it alpha software at this point. The framework is just about done and so is the XLayer class. I'm currently in the midst of building the following components:
- sortable tables (almost done with this)
- menus (menubars and context menus)
- explorer-like tree
- progress bar
- toolbar
- calendar
- color picker
These are things I've already completed:
- SlidePanel
- ScrollBar
- Viewport (scrollable pane)
- Button
I've created a few little demos to show off SWAT's capabilities. Bear in mind that I do intend to create a complete set of documentation and examples for SWAT when it is complete. For now, check these out:
JSTable demo
SlidePanel demo
Viewport demo
Button demo