Tools.js is less of a single script, and more of a collection of small, unrelated utility functions in JavaScript. I'll get into each function, what it's for, and how it's used later. Suffice it to say that few if any of these tools have any relation to one-another.

Originally I just used these tools as a collection of different functions. However, the problem there is function name collision. If I were using another framework, or if I was developing a particularly complex application, I didn't want to worry about inadvertently having two different functions with the same name. Since JavaScript doesn't handle overloading, this becomes a big problem.

To combat this, I ended up wrapping all the functions in their own class, called tools. The way I build the class lets you call them like static methods, without having to instantiate an object first. Eg, you can just call tools.getMouse(e) rather than having to create your object first like you would with a typical javascript class.

JavaScript enabled browser. Most of the tools should be cross-browser compatible.

tools.js v1.1

tools.getMouse(e) is used to get the x and y location of the mouse when an event fires. This would typically be an onclick or onmousemove event, though it could be any kind of event. You must pass the event into the function.

tools.getSize(item) was built to get the height, width, x-offset and y-offset of an item. For the top and left, it also requires the tools.getLocation(el) method. The item being passed in needs to be a valid DOM element.

tools.getViewport() is designed to get the size of the current viewport. The viewport is the part of the web page that the user is currently viewing. In other words, it's the dimensions of the visible browser window, not including any sections of the web page that are scrolled off the screen. This may or may not be especially reliable... I recommend testing prior to rolling this out as an important part of a website.

tools.getPageSize() is meant to get the full size of the web page being displayed. This is to include anything that's currently scrolled off the screen. This does not work very reliably, so be forewarned. If you have a more reliable method of getting this information, please post a comment.

tools.getLocation(el) is designed to give you the x and y offsets of an html element. You must pass it a valid DOM element for it to work. The way the function works is it takes your current element and gets its x and y offset from its parent. It then gets the parent, does the same thing, and appends it to the child. Repeat until you run out of parents. It's a bit complicated and probably doesn't scale very well, but it works, I just wouldn't recommend doing it for a lot of elements all at once.

tools.getBaseName(name) takes a path (such as a url) and gets the last part of it. Name is expected to be a string. This is not an especially robust function... it expects the directory separators to be a forward slash (/). It basically returns everything after the last /, so that would include any GET variables appended to a URL, for example. However, it's fast and simple, which is always a plus.

tools.isInt(i) was written so you could pass in a number and see if it's an integer. This is, once again, a fairly quick and dirty method, but it works.

tools.urlEncode(str) is designed to take a string and replace any characters that are unsafe in URLs and encode them so that they're safe. The primary use for this is in taking user input and sanitizing it so it can be safely transported via AJAX. A simple example of a character that will ruin an AJAX request is the ampersand (&).

tools.urlDecode(str) is exactly the same thing, but in reverse. It can take a urlEncoded string and switch it back to normal characters again.

tools.trim(str) is designed to take a string input and trim off any leading or trailing white space. I was surprised that JavaScript didn't appear to have any function to do this already built into the language. I'm not sure where I discovered this gem, but it's effective.

tools.countLines(strtocount, cols) is designed to count the number of lines that exist in a textarea html element. I specifically wrote this script so that I could dynamically resize a textarea depending on the amount of text that is currently in it. Due to the vagaries of fonts, this is less of a science and more of an art, but what I came up with works amazingly well.

tools.resizeTextArea(el) is just a wrapper function for the previous tools.countLines(strtocount, cols) method above. If you look at the example for the above, that's precisely what this does. This allows you to call the method with an onkeyup on the textarea without any additional javascript at all.

tools.resizeTextInput(el, minsize) is meant to do for regular input elements what tools.resizeTextarea(el) does for textarea elements. The input requires an input element. The minsize is optional, but is the minimum size you'd like the input to shrink to. If nothing else is provided, a value of 5 is assumed.

tools.getSelectValue(el) expects an html select element to be passed to it. It then returns the value of the selected item.

tools.colorRows(el, overwrite) is designed to add even/odd classes to a table for reasons of making the body rows alternating color. I tweaked this heavily for various reasons, but in the end, you basically need to pass it an element that is a table or an element within a table. The function will automatically go up until it finds the closest table ancestor. At that point, it will drive down to any TBODY elements and grab all the table rows below it. If the row does not have a class, or if the overwrite option is set to true, the method then adds either an even or odd class to that row.

The even and odd classes must be defined in your stylesheet, otherwise it won't have any noticeable effect. Please note that this only colors TBODY rows... it purposefully avoids THEAD and TFOOT so you can apply your own formatting.

tools.getClassSelector(stylesheet, selector) is designed to parse your stylesheet and return the values for a specific selector. For instance, you can tell the function to search your main site class for a class called 'test' and have it return all the CSS rules associated with test. From there, additional processing could be accomplished.

The stylesheet is the numerical offset of your stylesheet starting at 0. If you only have 1 stylesheet defined in your site, use 0, otherwise calculate the offset by number

tools.deselect() can be used to deselect anything that's currently selected in a page. IE, if someone selects text or an image, the script can be used to automatically deselect the text or image. This can be handy if you're implemented double-click mouse events, or events based off of clicking and dragging.