Javascript to determine stroke color and change it depending on that color

I have an ellipse that starts out with a stroke color of gray. I want to write some javascript that will basically work like this: if the stroke is gray, click the ellipse to make the stroke green, if the stroke is green(maybe because I clicked it previously to make it green), then the stroke will turn gray again. I want to be able to click it as many times as I want and have the stroke alternate between green and gray every time I click the ellipse. Thanks for the help!

 

post the code you have so far .....

 

sure...

right now I can only click it the first time and change it from gray to green, though.

Here's the ellipse I'm using:

<Ellipse x:Name="powerButton" MouseLeftButtonDown="power_on" Fill="DarkGray" Stroke="Gray" StrokeThickness="4" Width="48" Height="48" Canvas.Left="56" Canvas.Top="56"/>

Here's the Javascript:

function power_on(sender, args) {
sender.findName("powerButton").Stroke = "lime";
}

very simple. I was playing around using a power_off function and inserting a different mouse event in the ellipse code, but that's not ideal. I want to use the mouseleftbuttondown for both, on the same object. maybe something with an if else statement?

 

Sorry, I have no clue what language that is, I have never seen that tag before.

Can I see a page with that on ??

 

It's XAML. I'm working with Silverlight. Honestly that's not the part that matters. The only thing you need to know from the XAML part is that MouseLeftButtonDown calls the function power_on. I only need help with the javascript part.

If you want to learn more about Silverlight and XAML go to http://silverlight.net/Learn/ and do the quickstarts.

 

I don't think you can use findName is xaml ....

You'd probably have better luck asking in a .NET forum.....

 

findName is working right now. That code I put in my post works. I only need help with syntax for an if else statement, I'll work out how the rest. I can't ask about javascript in an asp.net forum. nothing i'm doing here deals with .net. Maybe show me how you would do it with your own code, maybe substitute html for the xaml or something. I just need to find an example somewhere of how you would click on an object to get different colors, regardless of whether you use xaml or html or whatever else. How would you do it?

 

<script language="javascript">
	function swap_color( obj )
	{
		return obj.style.backgroundColor == 'blue' ? obj.style.backgroundColor = 'red' : obj.style.backgroundColor = 'blue' ;
	}
	function swap_color_else( obj )
	{
		var color = obj.style.backgroundColor ;
		if( color == 'red' )
		{
			return ( obj.style.backgroundColor = 'blue' );
		}	
		else
		{
			return ( obj.style.backgroundColor = 'red' );
		}
	}
</script>
<div onclick="swap_color( this );">
the first example
</div>
<div onclick="swap_color_else( this );">
the second example
</div>

PHP:

Id do it like that, hope it helps .......

 

Thank you!! I'll try it out and let you know what happens.