$(function(){
        //all hover and click logic for buttons
        $(".fg-button:not(.ui-state-disabled)")
        .hover(
                function(){ 
                        $(this).addClass("ui-state-hover"); 
                },
                function(){ 
                        $(this).removeClass("ui-state-hover"); 
                }
        )
        .mousedown(function(){
                        $(this).parents('.fg-buttonset-single:first').find(".fg-button.ui-state-active").removeClass("ui-state-active");
                        if( $(this).is('.ui-state-active.fg-button-toggleable, .fg-buttonset-multi .ui-state-active') ){ $(this).removeClass("ui-state-active"); }
                        else { $(this).addClass("ui-state-active"); }	
        })
        .mouseup(function(){
                if(! $(this).is('.fg-button-toggleable, .fg-buttonset-single .fg-button,  .fg-buttonset-multi .fg-button') ){
                        $(this).removeClass("ui-state-active");
                }
        });
});

//On Doc Ready
$(function() {
        /**
         * JQuery Universal Image Button (I just made that up)
         * Version 1.0
         * Created: April 13, 2010
         * Author: Patrick Hansen (http://www.patrickhansen.com)
         *
         * JQuery Universal Image Button is a basic function that will allow you to share the single script
         * across a website for image-based buttons without multiple explicit dependancies and references.
         * Use this if you choose NOT to use CSS-based buttons, but I recommend looking at CSS aproach first.
         *
         * Only 3 Requirements:
         * 1) Have the current JQuery lbrary(1.4.2 +) linked to your page/site, and this script.
         * 2) Just add the class that the script references to the anchor tag that your image is in.
         * 3) Make sure your images for that button instance are named the same 
         *    and the over state image has "_hover" appended to the file name (ex: MyImage.gif & MyImage_hover.gif)
         *
         * Tested in: Mac Safari 4, Firefox 3, Chrome 5 beta, IE6, IE7
         *
         * Feel free to use this script for whatever you want, no licenses here. It's just a simple script, nothing fancy or amazing.
         *
         **/


        //*************** JQeury Universal Image Button ***************
        function getHoverPath (imgPath) {
                //split imgPath after each '/' and create array to path directories and file name
                var srcPathArray = imgPath.split('/');
                //find image file name get length of srcPathArray and retrieve last item which is the image file ex: "images/buttons/IMG.gif"
                var imgFile = srcPathArray[srcPathArray.length-1];
                //image file name array split at "." to get:[fileName, ext]
                var imgArray = imgFile.split('.');
                //img name (first item in imgArray)
                var imgName = imgArray[0];
                //image ext (second item in imgArray)
                var imgExt = imgArray[1];
                //image src path
                var srcPath = imgPath.split(imgFile , 1);
                // concatenate path and add "_hover" to image file name
                return srcPath + imgName+'_hover.'+ imgExt;
        };
        // get hover button array
        var hoveredButtons = new Array();

        $('.js_uniButton').mouseover (function() {
                $this = $(this);
                //get image path of this instance
                var imgPath = $this.children('img').attr('src');
                //cache img path url on initial mouseover
                if (typeof(hoveredButtons[ imgPath ]) == 'undefined') {
                        hoveredButtons[ imgPath ] = getHoverPath( imgPath );
                        //console.log('cache image path ' + imgPath + ' and hover path ' + hoveredButtons[ imgPath ]);
                 }
                $this.children('img').attr('src' , hoveredButtons[ imgPath ]);

                //mouseout actions
                $this.mouseout(function() {
                        //define this handler
                        var $this = $(this), handler = arguments.callee;

                        //unbind mouseout handler
                        $this.unbind('mouseout', handler);

                        // on mouseout, swap current image with original image path
                        $this.children('img').attr('src' , imgPath);
                });
        });
        //Close On Doc Ready
})
