<HTML>
<HEAD><TITLE>Fraction</TITLE>
<SCRIPT LANGUAGE=JavaScript></SCRIPT>
</HEAD>

<BODY BGCOLOR=beige style="font-size:50px;font-family:Arial"><CENTER>
<STYLE TYPE="text/css">
<!--
TD{font-family: Arial; font-size: 50px;}
--->
</STYLE>
<H1 style="font-size:50px">Fraction 分数</H1>

<FORM NAME="myform">

<TABLE>
<TR ALIGN=center><TD COLSPAN=2>First Fraction:</TD><TD></TD>
    <TD COLSPAN=2>Second Fraction:</TD></TR>
<TR ALIGN=center VALIGN=middle>
<TD ROWSPAN=3><SELECT NAME=sign1 SIZE=1 style="font-size:50px" ONCHANGE=calculate()>
	<OPTION>+</OPTION>
	<OPTION>-</OPTION></SELECT>
<INPUT TYPE=text NAME=integer1 SIZE=1 VALUE=1 style="font-size:50px" ONMOUSEOVER=select() ONCHANGE=calculate()></TD>
<TD><INPUT TYPE=text NAME=numerator1 SIZE=1 style="font-size:50px" VALUE=1 ONMOUSEOVER=select() ONCHANGE=calculate()></TD>
<TD ROWSPAN=3 WIDTH=200><SELECT NAME=Operator SIZE=1 style="font-size:50px" ONCHANGE=calculate()>
	<OPTION>+</OPTION>
	<OPTION>-</OPTION>
	<OPTION>x</OPTION>
	<OPTION>&divide;</OPTION></SELECT></TD>
<TD ROWSPAN=3><SELECT NAME=sign2 SIZE=1 style="font-size:50px" ONCHANGE=calculate()>
	<OPTION>+</OPTION>
	<OPTION>-</OPTION></SELECT>
<INPUT TYPE=text NAME=integer2 SIZE=1 VALUE=1 style="font-size:50px" ONMOUSEOVER=select() ONCHANGE=calculate()></TD>
<TD><INPUT TYPE=text NAME=numerator2 SIZE=1 VALUE=1 style="font-size:50px" ONMOUSEOVER=select() ONCHANGE=calculate()></TD></TR>

<TR ALIGN=center><TD>--------</TD><TD>--------</TD></TR>

<TR ALIGN=center>
<TD><INPUT TYPE=text NAME=denominator1 SIZE=1 VALUE=2 style="font-size:50px" ONMOUSEOVER=select() ONCHANGE=calculate()>
<TD><INPUT TYPE=text NAME=denominator2 SIZE=1 VALUE=3 style="font-size:50px" ONMOUSEOVER=select() ONCHANGE=calculate()></TD></TR>
</TABLE>

<BR><BR>Answer:
<TABLE>
<TR ALIGN=center VALIGN=middle>
	<TD ROWSPAN=3>	<INPUT TYPE=text NAME=sign3 SIZE=1 style="font-size:50px">
			<INPUT TYPE=text NAME=integer3 SIZE=1 style="font-size:50px"></TD>
	<TD><INPUT TYPE=text NAME=numerator3 SIZE=1 style="font-size:50px"></TD></TR>
<TR ALIGN=center VALIGN=middle><TD>--------</TD></TR>
<TR ALIGN=center VALIGN=middle><TD><INPUT TYPE=text NAME=denominator3 SIZE=1 style="font-size:50px"></TD></TR>
</TABLE>

</FORM>

<SCRIPT><!--
function calculate()
{var 	i1 = Number(document.myform.integer1.value),
 	i2 = Number(document.myform.integer2.value),
 	n1 = Number(document.myform.numerator1.value),
 	n2 = Number(document.myform.numerator2.value),
 	d1 = Number(document.myform.denominator1.value),
 	d2 = Number(document.myform.denominator2.value),
 	in1, in2, in3, d3, x, y, remainder;

in1 = (i1*d1+n1);	//change to improper fractions
in2 = (i2*d2+n2);
if (document.myform.sign1.options[document.myform.sign1.selectedIndex].text == "-") in1 = -in1;
if (document.myform.sign2.options[document.myform.sign2.selectedIndex].text == "-") in2 = -in2;

if (document.myform.Operator.selectedIndex == 0)		//add up
	{
	in3 = (in1*d2)+(in2*d1);
	d3 = d1*d2;
	}

if (document.myform.Operator.selectedIndex == 1)		//subtract
	{
	in3 = (in1*d2)-(in2*d1);
	d3 = d1*d2;
	}

if (document.myform.Operator.selectedIndex == 2)		//multiply
	{
	in3 = in1*in2;
	d3 = d1*d2;
	}

if (document.myform.Operator.selectedIndex == 3)		//divide
	{
	in3 = in1*d2;
	d3 = d1*in2;
	if (d3 < 0) in3 = -in3;
	d3 = Math.abs(d3);
	}

x = in3;
y = d3;
do	{			//find the highest common factor
	remainder = x%y;
	x = y;
	y = remainder;
	} //end of do
while (remainder != 0);
in3 = in3/Math.abs(x);		//reduce to lowest term
d3 = d3/Math.abs(x);

if (in3<0) document.myform.sign3.value = "-";	//show the correct sign
	else document.myform.sign3.value = "";
in3 = Math.abs(in3);
document.myform.numerator3.value = in3%d3;
document.myform.denominator3.value = d3;
document.myform.integer3.value = Math.floor(in3/d3);
	
} //end of function calculate

//--></SCRIPT>


<BR><BR><BR><BR><BR><BR><BR><BR><BR><BR><BR><BR><BR><BR>
</BODY>
</HTML>