jQuery Growl 1.0.1 Released

The first ‘stable’ release of jQuery Growl has been posted to the jQuery Plugins Repository. This release does not bring any ‘major’ new features to the table, but it does bring with it a nice long ‘testing phase’ where the plugin has been tried, tested and proven to work on a number of ocassions.  There is one new feature, which is the ‘close’ link that can now be included in the noticeTemplate — this link, when available, has a ‘click’ event assigned to it which calls ‘notice.remove()’ when clicked.

Also, James over at Honest Illusion has written up some decent documentation for the plugin, just ignore the ‘rant’ about my lack of documentation and skip to the good part … thanks again James.

On that note, if you’ve been using jQuery Growl on your site, please leave a comment on my blog and let me know.  I’d love to see some of the implementations that have come about since the creation of the plugin.  Thank you.

Google Chrome, Rendering Glitch

 

I noticed the other day at the office, after installing Google Chrome, that the browser had a slightly obnoxious rendering glitch.  It’s apparent when viewing the jQuery Growl demo page.

Basically, it boils down to this … Chrome renders PNG’s exactly as one would expect it too, the same way that Safari and Firefox handle them … transparencies are … you got it, transparent!

Do you remember the ugly IE PNG bug where it doesn’t know how to handle the transparency layer and treats the alpha pixels ‘oddly’, almost randomly picking a color of choice and replacing your alpha pixel with a 100% opaque color? Well, looks like Chrome has a similar bug, at least … visually.

When jQuery Growl appends a new notification element to the DOM, and then fades it in … Chrome goofs the rendering up and makes the transparent pixels … non-transparent.  It appears to only do this on pixels that are not 100% transparent (opacity = 0). See the screenshot below for an example:

 

 

As you can see, the corners are 100% transparent … but everything else is not … since the background image has a weird glow/drop shadow effect on it … and you can see the notifications above it that have there CSS opacity set to 100, the PNG renders perfectly.

This bug appears to be present when the DOM Element’s opacity is set to anything other then 100, such as a jQuery fadeIn or fadeOut animation that is executing.

Nice, eh?

Hopefully, they fix this bug in the next beta …

jQuery Growl 1.0.0-b3 Released

I just released the latest beta of jQuery Growl, adding in the new noticeDisplay/noticeRemove features.  I updated the jQuery Plugin Project page and uploaded the latest ‘beta 3′ to release it to the general public.

This release is rather minor, and only really provides a small bug fix and introduces the ability to override noticeDisplay() so that you can have your own custom animations and effects to display your notice.

Enjoy and let me know if you experience any problems with it, or have any updates that are within the ‘growl scope’ (I’ve been asked by a few people to make updates/changes to the Growl Plugin which I decided not to implement due to the lack of ‘Growlness’ in the requests.  Please refer to the official Growl homepage and experiment with the actual application before asking for feature updates, thanks.).

jQuery 1.0.4 and jQuery Growl

Per request, I attempted to back-port jQuery Growl to support jQuery 1.0.4 — which is the default version of jQuery shipped with Drupal 5.x (5.4 was the target drupal version).  Unfortunately, after digging around quite a bit, I realized that jQuery 1.0.4 had so many bugs in it that it was impossible for ‘me’ to back-port my Growl implementation without rewriting it from the ground up and essentially relearning jQuery all over again (ignoring everything I know of the 1.2.x releases, and learning ‘old school’ jQuery methods).

This turned out to be so problematic, that I eventually gave up after a few hours.  Some of the things I noticed in jQuery 1.0.4 was the lack of variable checking, ensuring that the variable had a value before attempting to access items within it.  Others were the lack of support for certain CSS properties, etc.

I did, at one point, get a copy of jQuery Growl working with 1.0.4 locally but once I deployed it to my server as version 1.0.0-b2 and tested it on my remote server with the ‘fortune.php’ implementation, it failed to work properly and I was unable to determine the cause of the problem.

So, with that said … I’m so glad that jQuery has matured to the point that it is at now and I hope that it continues to get better and better.  I don’t think I would be so interested in jQuery if I had started using it prior to the 1.2.x releases — buggy frameworks tend to make me walk away, run away in fear in some cases.