/*************************************************** (c)2009 by BookRags, Inc.
Utility JavaScript functions for our widgets.

   Date	  Who Major changes
--------- --- ----------------------------------------------------------------
31may2009 jls Created.
18aug2009 jls Added radiobuttons.
18aug2009 jls
******************************************************************************/

/******************************************************************************
The image buttons.
TO USE:
(style>
#MyOnOffBtn
	{background: url(/qa/images/myppbtn1.png) no-repeat 0 0;
	}
#MyOnOffBtn.down
	{background: url(/qa/images/myppbtn1.png) no-repeat 0 -41px;
	}

#MyPushOnBtn
	{background: url(/qa/images/myppbtn2.png) no-repeat 0 0;
	}
#MyPushOnBtn.down
	{background: url(/qa/images/myppbtn2.png) no-repeat 0 -41px;
	}
(/style>

(script type='text/javascript' src='/qa/jquery-1.3.2.min.js'>(/script>
(script type='text/JavaScript' src='/qa/widgets.js'>(/script>
...
(img src='xxx' width='nnn' height='nnn' class='wImageBtn' onclick='xxx'>  Std. button
(img src='xxx' width='nnn' height='nnn' class='wImageBtn clicked' onclick='xxx'>  Std. button initially clicked

The push-on & push-on/push-off types will submit their form by default, so you might want to put these outside
of a form. Also note you must specify the images as bkgd images in the style section. You'll probably want to
specify the src='/qa/images/null.gif' directly in the html, since $(document).ready doesn't fire off until a bit late.
(input type='image' id='MyOnOffBtn'  width='nnn' height='nnn' class='wImageBtn pushonoff' onclick='xxx'>  Push-on/Push/off
(input type='image' id='MyOnOffBtn'  width='nnn' height='nnn' class='wImageBtn pushonoff down' onclick='xxx'>  Push-on/Push/off initially "on"
(input type='image' id='MyPushOnBtn' width='nnn' height='nnn' class='wImageBtn pushon' onclick='xxx'>  Push-on only
(input type='image' id='MyPushOnBtn' width='nnn' height='nnn' class='wImageBtn pushon down' onclick='xxx'>  Push-on initially "on"

The radio type will submit their form by default, so you might want to put these outside of a form.
Also note you must specify the images as bkgd images in the style section.
(input type='image' id='rbTest1' name='rbTest' width='nnn' height='nnn' class='wImageBtn radio' onclick='xxx'>
(input type='image' id='rbTest2' name='rbTest' width='nnn' height='nnn' class='wImageBtn radio checked' onclick='xxx'>
******************************************************************************/
$(document).ready(function()
	{
	$(".wImageBtn").each (function(i)
		{
		if (this.tagName.toLowerCase()=="input" && this.type.toLowerCase()=="image")
			{
			if (!this.src)
				{this.src = "/qa/images/null.gif";
				}
			this.value = "";
			}
		if ($(this).hasClass("pushon"))
			{$(this).mousedown(function(){
				if (!$(this).hasClass("down"))
					{$(this).addClass("down");
					}
				});
			}
		else if ($(this).hasClass("pushonoff"))
			{$(this).mousedown(function(){$(this).toggleClass("down");});
			}
		else if ($(this).hasClass("radio"))
			{$(this).mousedown(function(){
				$("[name="+this.name+"]").removeClass("checked");
				$(this).addClass("checked");
				});
			}
		else
			{
			$(this).mousedown(function(){$(this).addClass("clicked")});
			$(this).mouseup(function(){$(this).removeClass("clicked")});
			$(this).mouseleave(function(){
				if ($(this).hasClass("clicked"))
					{$(this).removeClass("clicked");
					}
				});
			}
		});
	});