<HTML>

<HEAD>

   <TITLE>Template for HTML and JavaScript details</TITLE>

</HEAD>

<body bgcolor="#FFE4C8">

<!-- Copyright 1998 by Carl Rod Nave, RodNave@gsu.edu-->


<A Name="c1"></A>

<TABLE WIDTH="580" HEIGHT="370" BORDER="1" CELLSPACING="2" CELLPADDING=

"0">

<TR>

<TD WIDTH="514" HEIGHT="309">

<H1 align=center>HTML and JavaScript templates</H1>

<table><tr><td>A table with an image tag

<img src="images/F2mcf.gif"><BR></td>

An example of the Javascript URL

<center><H3><a href="javascript:var cal=force()">Net force</a> = <a href="javascript:var cal=mass()">mass</a> x <a href="javascript:var cal=accel()">acceleration</a></H3></center>


<td> Link to <a href= "newt.html#fma" >Newton's second law</a> 

A JavaScript script with functions and conversion from metric to U.S. common units. 

<SCRIPT LANGUAGE ="JavaScript">

function accel(){fh=document.forms[0];fh.a1.value=aa=(fh.fa.value-fh.mu.value*(fh.m1.value-(-fh.m2.value))*9.8)/(fh.m1.value-(-fh.m2.value));fh.f2.value=fh.m2.value*aa+fh.mu.value*fh.m2.value*9.8;fh.fn.value=fh.fa.value-fh.mu.value*(fh.m1.value-(-fh.m2.value))*9.8}

function force(){fh=document.forms[0];fh.fa.value=fh.a1.value*(fh.m1.value-(-fh.m2.value));fh.f2.value=fh.m2.value*fh.a1.value}


<!--A second form can be used in the same html document, as I did in sweat.html, by using fh=document.forms[0] in the script associated with the second form. Contrary to what I expected, the associated form is initiated by the same <FORM  method="" action="">, and it doesn't work if you use <FORM[1]>. The forms are treated as an array, but the subscript is implicit. I am still avoiding the use of second forms in html documents wherever possible because of subtleties with the use of variables with the same names. -->




<!-- the following is a list of some physical constants-->

<!--h=6.626o755*Math.pow(10,-34);ec=1.602177*Math.pow(10,-19);aa=0.529177*Math.pow(10,-10);mevc=1.782663*Math.pow(10,-30)-->


<!-- the following routines handle some conversions between metric and U.S. common units-->

function fc(x){return x/4.448}

function f(x){return x*4.448}

function mc(x){return x*.3048/4.448}

function m(x){return x*4.448/.3048}

function ac(x){return x/.3048}

function a(x){return x*.3048}

<!-- the following routines handle the conversion to and from scientific notation-->

<!-- sn(b,p) converts number with power of 10 to a number-->

function sn(b,p){return b*Math.pow(10,p)}

<!--snp(x) returns the power of 10 for a number-->

function snp(x){return Math.round(Math.log(x)/Math.LN10)}

<!--snb(x) returns the base of number with which to multiply the power of 10-->

function snb(x){return x/Math.pow(10,snp(x))}

<!--svb(b,p) takes input base and power and scales to make base between 1 and 10, returns base-->

function svb(b,p){n=sn(b,p);return snb(n)}

<!--svp(b,p) takes input base and power and scales to make base between 1 and 10, returns power-->

function svp(b,p){n=sn(b,p);return snp(n)}/Users/rodnave/Desktop/geomdb.xls

<!--snbv and snpv handle the possibility of a negative number which blows up in the above routine-->

function snbv(x){if(x<0)return -snb(-x);else{return snb(x)}}

function snpv(x){if(x<0)return snp(-x);else{return snp(x)}}





<!--display(x) checks to see if a number is too small or too large to fit in a 6-space field, and if so, displays ellipsis ...-->

function display(x){xx=x;if(x<Math.pow(10,-4))xx="...";if(x>.99*Math.pow(10,5))xx="...";return  xx}


<!--default values are set for parameters which have zero values-->

<!--There is value in having an overall default function for a calculation to provide values for all parameter which you dont want to default to zero-->

function def(){fh=document.forms[0];if (fh.v.value==0)fh.v.value=.01;if (fh.pk.value==0)fh.pk.value=1;if (fh.v.value==0)fh.v.value=-1.5;if (fh.wsb.value==0)fh.wsb.value=656.28;if (fh.wsp.value==0)fh.wsp.value=-9}


<!--The following routine returns the standard angle in degrees for a vector to position (x,y). The standard angle is it angle CCW from the positive x-axis, having a value 0 to 360 degrees -->

function ang(x,y){if((x>0)&&(y>=0)){return Math.atan(y/x)*180/Math.PI};if((x>0)&&(y<0)){return 360-(-1)*Math.atan(y/x)*180/Math.PI};if((x<0)&&(y>=0)){return 180-(-1)*Math.atan(y/x)*180/Math.PI};if((x<0)&&(y<0)){return 180-(-1)*Math.atan(y/x)*180/Math.PI} ;if((x==0)&&(y==0)){return 0};if((x==0)&&(y>0)){return 90};if((x==0)&&(y<0)){return 270}}



</SCRIPT>



A form with onChange handlers

<FORM  method="" action="">

A force F= <INPUT Type="text" Name="fa" Value="" Size="6"onChange=accel()>N is applied to two masses m1=<INPUT Type="text" Name="m1" Value="" Size="6"onChange=accel()>kg and m2=<INPUT Type="text" Name="m2" Value="" Size="6"onChange=accel()>kg which are in contact with each other. If there is a coefficient of friction mu = <INPUT Type="text" Name="mu" Value="" Size="6"onChange=accel()>, then the net force on them is <INPUT Type="text" Name="fn" Value="" Size="6"onChange=accel()>N and the acceleration is given by

<table><tr><td><img src="images/f2mf.gif"></td><td>=<INPUT Type="text" Name="a1" Value="" Size="6"onChange=force()> m/s&#178;</td></tr></table>

Then the force exerted on mass m2 can be determined. <table><tr><td><img src="images/f2mf2.gif"></td><td>= <INPUT Type="text" Name="f2" Value="" Size="6"onChange=fnet()> N</td></tr></table>

Note that the share of the force necessary to accelerate the second mass is independent of the friction coefficient. 

</form>


<H3 align=center><a href="f2m.html#c2">Remove friction</a></H3>

</td></tr></table>


<!-- Example of an image map-->

<img src="imgaud/audiocon.gif" usemap="#lcon">

<map name="lcon">

<area shape=rect coords="35,52,195,98" href= "pa.html#c1" >

</map>


Some special symbols:

Degree sign    &#176;

theta  &#952;

tau  &#964;

pi  &#960;

big delta  &#916;

small delta  &#948;

alpha  &#945;

beta  &#946;

gamma  &#947;

big omega  &#937;

psi for wavefunction  &#936;


Mathematical functions in Javascript:

example of nested if statements.

function atan7(x,y){fh=document.forms[1];if (x>0){if (y>=0) return 180*Math.atan(y/x)/Math.PI;if (y<0) return 180*Math.atan(y/x)/Math.PI-(-1)*360};if (x<0){if (y>=0) return 180-180*Math.atan(-y/x)/Math.PI;if (y<0) return -180-(-1)*180*Math.atan(y/x)/Math.PI-(-1)*360}}


Testing for odd and even using the Modulo function:

function ecal(){fh=document.forms[0];def();aa=fh.a.value;zz=fh.z.value;fh.n.value=nn=aa-zz;eeo=15.75*aa-17.8*Math.pow(aa, 2/3)-0.711*sq(zz)/Math.pow(aa,1/3)-23.7*sq(aa-2*zz)/aa;fh.eo.value=eeo;corr=11.18/Math.sqrt(aa);if(zz%2==1){if(nn%2==1){eeb=eeo-corr;fh.ee.value=0;fh.oo.value=-corr};if(nn%2==0){eeb=eeo;fh.ee.value=0,fh.oo.value=0}};if(zz%2==0){if(nn%2==0){eeb=eeo-(-1)*corr;fh.ee.value=corr;fh.oo.value=0};if(nn%2==1){eeb=eeo;fh.ee.value=0, fh.oo.value=0}};fh.eb.value=eeb}


Using a While loop, modulo, round to calculate binary from decimal numbers. 

<SCRIPT LANGUAGE ="JavaScript">

function dcal(){fh=document.forms[0];dd=fh.dec.value;flag=1;bn="";while(flag>0){temp=Math.round(dd/2-.001);bn=dd%2+bn;dd=temp;if(dd==0)flag=0;};fh.bin.value=bn}


</script>



<!-- Modulo returns the remainder when first number divided by second. It is represented by %. Example 5%2=1, 4%2 =0. Useful for binary conversion. Pg 54 in OReilly Javascript.-->



Absolute value    Math.abs()


<!--Example of boxed link-->

<center><table BORDER="1" CELLSPACING="2" CELLPADDING=

"2"><tr><td><a href="compdat.html#c1">Application in Compton scattering</a></td></tr></table></center>


<!--In the document mot.html, I tried 4 different forms. Not a practice to be recommended, but it apparently worked. As I understand it, the first form in a document defaults to forms[0], assuming an array of forms and giving the first one index 0. I used forms[1],forms[2],forms[3] in that document. I used the common variable fh in the last three, and it didn't cause any apparent problems. This is a good document to look at if it is desirable to have multiple forms in an html document, but my current practice is to not put more than one form in the document. -->


</TD>

<TD WIDTH="66" align=center><a href="hframe.html">Index</a><BR><BR><a href= "newt.html" >Newton's laws</a><BR><BR><a href= "N2st.html#c1" >Standard mechanics problems</a></TD></TR>

<TR>

<TD HEIGHT="17">&nbsp;<A HREF="hph.html"> HyperPhysics</A>*****<A HREF="hph.html#mechcon">     Mechanics </A></TD>

<TD><a href="Javascript:history.go(-1)">Go Back</a></TD></TR>

</TABLE>

<BR>

<BR>

<BR>

<BR>

<BR>

<!--Conversions

m/s * 3.6 = km/hr

m/s * 2.2369 = mi/hr



-->


</BODY>

</HTML>