Trent’s Blog

Just thought I’d give everyone a shot to request any more features for Impromptu? Currently on my list is to make the options more global so you don’t have to declare your custom show method everytime.. unless thats what makes you happy :). So with this next release you might say something like…

$.ImpromptuOptions = { show: ‘mycustomeffect’, prefix: ‘myprompt’ };

Now you can just $.prompt() with just a message. Again this wont be required and may not be the exact syntax, but this is what I’m shooting for along with being completely backwards compatible. I wont be releasing this one for a while yet to try and get some feedback. So what do you think??

Finally a new version of jQuery Impromptu has been released. This release in my opinion has a few new cool features. First off you can now control the speed of the fade and the prompt box. Also you can now set which jQuery effect to use to bring in the prompt(show, fadeIn, slideDown, or your own custom effect).

Now to the good stuff. Now you can have a submit function. Just as you have form.submit(), you now can have the same function which operates about the same. You can validate your fields and determine whether to proceed sending the data and closing the prompt or not(returning true or false accordingly). Then you will still have your separate callback to be called after the prompt completely closes.

I hope this is of some use to someone, I know I’ve already used it several times!  There are examples of these new features on the Impromptu site.

In my very own opinion jQuery and Prototype are the two best options when developing with javascript. When asked which one should one use generally my first question is “What are you using it for?”. Each library definitely has its strenghts.

From what I’ve observed Prototype is going to work better for advanced algorithms or even eye-popping effects(these “eye-popping” effects have pretty complex algorithms within them :). Prototype’s string and array helper functions really improve what you can do with these objects, and hence make life much easier when computing. Unfortunately for any effects at all you will need another library to accompany Prototype.
Then we have the site where we need maybe just a couple smooth effects and maybe some Dom traversal. Well jQuery has that built right in with fading, sliding, etc. With xpath and css selectors traversing the dom(or an xml feed) has never been easier. I find this the fun part when I can grab a collection of elements which meet my xpath query. This librarly may not make complex algorithms quite as simple, which in my opinion is why there are no good Graph plugins out there as Prototype has. Hopefully there will be some good one’s on the way soon.
Then we have that area in the middle where jQuery and Prototype collide. Both of course like the $() function, however it’s not required by jQuery and they can both run together. Both have the nice each() iterator for loop through objects and such. And Prototype has the ubeatable Form object and $F(), which lets you handle forms in your sleep. But not to be out-done jQuery selectors can do whatever Prototype’s $F() can do in just a couple lines.

Ok, so we see a slight unfair advantage to Prototype so far, but we haven’t weighed in our contestants. Prototype weighs in at 120kb uncompressed. jQuery weighs in at 61kb uncompressed, and an astonishing 20kb compressed.(not counting plugins for either one) So there we have it, for quick, sturdy traversal and easy effects, I take jQuery, but for heavy computing and possibly heavy form processing and eye-popping effects, might want to take the heavy-weight Prototype and it’s buddies for effects. So there you have it, my take on jQuery Vs. Prototype.. And I ask again “What are you using it for?”.

Well I gave it a go at the jQuery plugin deal, and well.. I dont think version 0.1 turned out too darn bad.  jQuery Impromptu as I’m calling it is a nice little plugin to simulate a nice css/js alert or prompt You may also add forms custom forms and elements to your prompts as well.   A few of the options allows you to narrow the allert down to an html element on the page(given it is relative or absolutely positioned) and create as many buttons on your prompt as you wish! A callback function lets you process your forms.   Please give it a shot on my examples page and please let me know if you have suggestions or constructive criticism or any other comments.

Well I’ve been playing with jQuery for a little while now and I really like its “query” like abilities to traverse the DOM. It has probably become my favorite javascript library. But I also discovered another project in the making.. CFJS, by Chris Jordan, a project working to implement many common CF functions using javascript. Not to be misled, many of the functions implemented can be helpful no matter what language you’re use to(like Array functions, List functions and decision functions). The idea behind it is to implement many of the most useful ColdFusion functions to ease the pain of js development.

I found that this really helps out when doing things like form validation. For instance.. I have an email field that I want to validate as an email(could be ssn, or telephone, etc,..). I would use the IsValid(’email’) function check with CF that it is an email address. Well now you would do the same with in javascript with CFJS. Maybe I want to validate a group of checkboxes to make sure there’s atleast two items selected,.. I could check with ListLen() to make sure there are two selected. Again, not to be mislead, you don’t have to be using CF or familiar with CF to use this library(nor do you have to use it with jQuery as there is a version that runs independently).

There’s a lot of potential with the jQuery library as well as the CFJS extension. Developers no longer need to feel like they’re tied down with spry when using JS and CF, there are other great options out there thanks to projects like this!

I ran into a need for a print preview on my website the other day and was unable to find a quick solution, so with a little thought I whipped up a small function which does just that with CSS and Javascript. Here’s what I come up with:

<link id=”screenCSS” media=”all” rel=”stylesheet” type=”text/css” />
<link id=”printCSS” media=”print” rel=”stylesheet” type=”text/css” />
<script language=”javascript”>
function togglePrintPreview()
{
     var currCSS = document.getElementById(’printCSS’);
     if(currCSS.media == ‘all’)
         currCSS.media = ‘print’;
     else currCSS.media = ‘all’;
}
</script>

Pretty simple theory.. just toggle the media attribute of the link tags from “print” to “all”. Maybe a little dumb,.. but very practical. View Example