Beginning Javascript with DOM Scripting and AJAX
In my lifetime I can honestly say that I have only bought two books on JavaScript programming. The first one was called "Special Edition: Using JavaScript" [Que-1996]. This was basically a reference book that described, and provided an example of, every function and method in JavaScript at that time. I don't think I have opened this book in about 8 years.
During this time, I have relied heavily on Google to provide information on any new tips and tricks that have come out. If I came across something that intrigued me, I would spend countless hours learning all I could from the internet.
Brian comments on FormFieldinator:
...I tried the [FormFieldinator] tester and found some problems. I'm using Firefox 2.0.0.14:
...I get an error message when I tab after pasting invalid text, but it moves to the next field anyway. Shouldn't it stay in that field until it's correct?
I have to admit, I was wondering when someone was going to call me out on this. If your not familiar with FormFieldinator, it was my attempt to create the ultimate JavaScript form and formfield utility library. I developed, what I thought, was a fairly robust set of tools to allow you to capture, validate and format form input. Heck, I even came up with a cool name.
It's Like script.aculo.us and moo.fx, but Half the Calories
Right before I left on my vacation I came across a very nice JavaScript Animation class called Animator.js. In the past, I've switched between using script.aculo.us and moo.fx for various projects, but at times it seemed I would run into problems. Their frameworks sometimes interfere with the latest version of prototype.js, or they were overkill for whatever task I was trying to perform. I think that's why I kind of like Animator.js. It's a self contained class that allows you to perform various animation task. It's lightweight and extremely easy to implement.
I recommend checking out the authors site [BernieCode] to find out more and also, I've created a little demo (edit: deactive) that duplicates one of WebKit's new CSS animations. Check it out and let me know what you think.
Note: It wasn't really explained on Bernie's website, but you need to return window[Animator][Control Function] after you call new Animator() to get the animation to work.
function AnimatorTest() {
ani = new Animator({duration: 1500})
.addSubject(new NumericalStyleSubject($('CB'), 'opacity', 0, 1));
return window['ani']['play'](); // return the ani window variable and intiate "play"
}
window.addEventListener?window.addEventListener("load", AnimatorTest,false):window.attachEvent("onload", AnimatorTest);
WYSIWYG Cross Browser Editor
I came across this pretty nifty in-page HTML editor tonight called openWYSIWYG. The claim it was the ultimate cross-browser editor, but it didn't support Apple's Safari browser. Go figure. I liked it though. It's small and light and so far it seems like you can modify it fairly easily. Compared to FCKEditor or TinyMCE, which seems like brain surgery whenever I poke around in their code.
Well as of tonight, the Safari limitation has been changed. I have successfully modified the source to allow my brethren to enjoy it as well.
I fixed the bugs, now what?
Well, I'm back, relaxed and dove straight into working on the Safari fix for openWYSIWYG. I figured out the issue when attempting to insert a new TABLE into a blank editor window. That little bug has been squashed. You can grab the the Safari version by visiting this CJBoCo Brew House.
So, what next? Well, that's a darn good question. I still think this editor needs some improvements to make it more cross-browser friendly, make improvements on the some of the core functions (especially some of the node functions), improve how it handles the HTML code and a few other things that I think it needs help on.
