Some questions,Fibonacci calculater

[JooClops]

Hi all.
I'm building a website about Fibonacci for school, So I want to put a calculator that will show all lucas numbers or fibonacci numbers as for the user's decision.
I've made the design and everything and now i just need it to work, but I'm pretty lame in javascript(mainly studying C#,this is just a side project) so I'd like to get some help.
first we can't use recursion cause we didn't learn yet,so I figured a way to calculate the numbers using no recursion,I'll write it when some 1 comments so You could say if It's the most effective way :S

anyway these are the buttons/textbox etc that I have:
Radio buttons:
1 for lucas numbers and 1 for Fibonacci numbers.
Buttons:
Show, clear.
Text Boxes:
from N=:
to N=:

and a big text area underneath.
now few questions and problems:
How can I through a function send messages to the text area?
how can I ,using the function of calculating the numbers ,get the values of initial and final index? Aren't they string? anyway how can i Send them to the function? can some 1 show me how the topic of the function will look like?
Thanks in advanced for Every one really!
I will need alot of help.
Thanks,
JC

[Airshow]

JooClops,
You have set yourself a nice little problem.

First, Fibonacci/Lucas sequences need two seeds to get them started, "seed1" and "seed2", (1,1 for Fibonacci and 2,1 for Lucas), and you also need to specify how many terms are generated, "nTerms". This will have the advantage of allowing users to specify their own seeds. I also think you will run into trouble with "initial and final index", but maybe I misunderstand your intention here.

Next thing you need to know is how to address your HTML input fields and textarea from HTML.

1. In HTML, give each of your fields and textarea a UNIQUE id, eg. <input id="seed1"> <input id="seed2">
2. In Javascript a field reference is created with eg. var seed1_Fld = (document.getElementById) ? document.getElementById('seed1') : document.all['seed1']; This syntax caters for most browsers out there, old and new.
3. You can use the field refernece to both read and wtite as follows:
   • var seed1 = seed1_Fld.value; //read
   • seed1_Fld.value = '5'; //write

   Thus, you can read your data fields and write to the textarea.

As you say, values in input fields are strings. Javascript does automatic conversions when it can but in this application you will need to perform explicit conversions (the reason being that Javascript uses + for both arithmetic addition AND string concatenation!!). Therefore, after you have got the data from the input fields into Javascript, you will need to use eg. parseInt(seed1) to perform the conversion to integer.

Especially if you write your Fib/Lucas function recursively, then it will be easiest to create a "front-end" function (called from your "Show" button) which handles the read/write (from/to the Javascript).

You now need to know how to call javascript functions from HTML buttons. Code it like this:

<input type="button" value="Show" onclick="show()">

where show() is your "font-end" function, which will contain all the document.getElementById() and parsetInt() etc code.
Now simply(!) get show() to call your Fib/Lucas function (you only need one bacause Fibinacci and Lucas sequences differ only in their seeds). You will need to return the calculated sequence back to show() , so it can be displayed in your textarea.

I have drafted a sample solution (7 lines of CSS; 60 lines of javascript; 20 lines of HTML). If you get into deep trouble, then please ask, but I will let you try to solve it for yourself first.

By the way, in my draft:
1. I have written the main Fib/Lucas function recursively, and it was quite a challenge despite being reasonably familiar with recursion. There are several nasty pitfalls.
2. I have included a calculation of the ratio of the last two numbers in the calculated Fib/Lucas sequence; this should converge on the "Golden Ratio" as the number of terms increases.

Airshow

[JooClops]

Hi Airshow!
Thank You for your time!
I appreciate it ! :D
I'm gonna try everything now (by my own) when i come back from school.
And I'll let You know If I have any problems ( I Already done the fibo=lucas thing in C#).

"2. I have included a calculation of the ratio of the last two numbers in the calculated Fib/Lucas sequence; this should converge on the "Golden Ratio" as the number of terms increases."

this is a good idea! I will add it as well(when I'll get it to work :P).

Thank You so much!
I'll report later.

JC

[JooClops]

Hi Airshow,
Some more questions , I think I'm progressing slowly but effectively :)
"onclick="show()""
so this basically tells, that if button show was clicked it will summon the show function right?
now how would it know if it is lucas or fibonacci series? and then change the seeds as needed?

and i really don't understand the :
document.getElementById
Could You please explain or refer me to a webpage that explains these stuff?
I've never used document.XXXXX what ever it says , so It's new for me :{

Thank You very much,
Your help is greatly appreciated!
JC

[Airshow]

JooClops (great name by the way),

"onclick="show()""
so this basically tells, that if button show was clicked it will summon the show function right?

Yup, exactly that.

now how would it know if it is lucas or fibonacci series? and then change the seeds as needed?

It really depends on exacly how you want it to work. In my draft, I have made it such that the "Fibonacci" and "Lucas" buttons do nothing more than populate "seed1" and "seed2" input fields with 1,1 or 2,1 (as per messers Fib and Lucas) - these fields can also be populated manually by the user with any integers of their choosing. Nothing else actually happens until the user clicks the "Show" button. It doesn't matter to the show() function whether the seeds are Fib or Lucas (or user-entered values) because it always does the same thing. This is OK because Fib & Lucas difffer only in their seeds (the first two terms) - the algorithm for generating the rest of the sequence is absolutely identical (see Wikipedia).

and i really don't understand the :
document.getElementById
Could You please explain or refer me to a webpage that explains these stuff?
I've never used document.XXXXX what ever it says , so It's new for me :{

In the bad old days (pre "DOM-savvy" browsers) it was open-season with regard to referring to HTML elements in Javascript - every browser manufacturer did something different so cross-browser scripting involved LOTS of exception handling. The W3C standardised (circa 2001?) resulting in a family of Document Object Model (DOM) methods which quite rapidly perculated into new releases of the major browsers from that date. The most important DOM method is document.getElementById( (str) HTMLElementId ) , which returns an opaque reference to HTMLElement and thus allows it, its contents, behaviour and appearance to be manipulated programmaticaly (chiefly from Javascript, but also from VB). DOM methods also allow for the dynamic creation, duplication, insertion and deltion of HTML elements to/from the DOM. Here is as good a place as any to start reading. Google will yield many other references.

In your program, just think of var foo = document.getElementById() as something that gives you a "handle", foo , with which you can subsequently add/change/read the contents of input fields and your textarea.

Airshow

[JooClops]

Great,
I think I actually understand :}
the calculating part is not hard for me cause I already done that before,
just need the 2 seeds and i can generate other in a for loop, now getting "from" ,"to" indexes can make a problem but I think I will be able to deal with them.
gonna read up in the web page You've directed me.
And try to make it, I'll report if I encounter more problems, and if I'll really couldn't make it I will be more than happy to see Your sample project.

But first I'll show You what I will do .

So thank You so much!!
and I have to sleep now :< so good night :D

JC

[JooClops]

Airshow(You have nice name also :P)
Here is what I done for calculating the series:

function calculate(seed1,seed2,index_end)
var fil=seed1+seed2;
var i=0;
if (index_end==2)
/////show seed 2 and seed 1
else if (index_end==1)
/////show seed 1
else
{///show both seedes and countinue showing this:
for(i=1;i<=index_end-2;i++)
{fil=seed1+seed2;
seed2=seed1;
seed1=fil;
///show fil
}
function show();

I wrote ///show cause I dont know how to send it to the text box :<
so maybe I didn't understand as well as I thought :P
So I need help here..
another thing is , now about the seeds, tell me if I'm heading the right way.
<input type="text" size="20" name="index" value="1">
<input type=RADIO name="pick" value="Fib" checked>
<input type=RADIO name="pick" value="Luc" >

than in show function:
if (pick.value== "Fib")
calculate(1,1,parsetInt(index.value))

first part is part from the html and last part is JS.

tell me what You think, and how can I progress please.
Thank You 1000000 times!
Great to see people willing to help :}

JC

[Airshow]

JooClops,

It's time to give you some code.

This is not my full solution (which is written somewhat differently and includes the Golden Ratio calculation), just something that will help explain the bits that are giving you trouble. Having said that, it is pretty near complete.

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
<title>Fibonacci/Lucas Series</title>
<style type="text/css">
body { font-size:10pt; }
form { width:480px; padding:5px; border:1px solid #999999; }
form h1 { margin-bottom:0 0 6px 0; padding:2px; color:#0c5c0a; background-color:#e0f5db; border:1px solid #0c5c0a; font-family:verdana,arial,helvetica; font-size:12pt; text-align:center; }
form div { margin-bottom:12px; }
label { font-style:italic; }
#dataFields input { width:40px; text-align:center; }
</style>
<script>
var seed1Field, seed2Field, indexEndField, resultField;
function calculate(seed1, seed2, index_end){
	seed1 = (!seed1 || isNaN(seed1)) ? 0 : seed1;//Set default value for seed1 if not specified or not a number.
	seed2 = (!seed2 || isNaN(seed2)) ? 0 : seed2;//Set default value for seed2 if not specified or not a number.
	index_end = (!index_end || isNaN(index_end)) ? 5 : index_end;//Set default value for index_end if not specified
	seqenceArray = [seed1, seed2];
	for(i=2; i<index_end; i++){
		fil = seqenceArray[i-2] + seqenceArray[i-1];
		seqenceArray[i] = fil;
	}
	return seqenceArray.join(', ');
}
function show(){
	var seed1 = parseInt(seed1Field.value);
	var seed2 = parseInt(seed2Field.value);
	var index_end = parseInt(indexEndField.value);
	resultField.innerHTML = calculate(seed1, seed2, index_end);
}
function setFib(){
	seed1Field.value = '1';
	seed2Field.value = '1';
}
function setLucas(){
	seed1Field.value = '2';
	seed2Field.value = '1';
}
function clearResults(){
	resultField.innerHTML = '';
}
function getFieldsById(){
	//Note: These are all globals, so become available to all other functions.
	seed1Field = (document.getElementById) ? document.getElementById('seed1') : document.all['seed1'];
	seed2Field = (document.getElementById) ? document.getElementById('seed2') : document.all['seed2'];
	indexEndField = (document.getElementById) ? document.getElementById('index_end') : document.all['index_end'];
	resultField = (document.getElementById) ? document.getElementById('result') : document.all['result'];
}
function setDefaults(){
	setFib();
	indexEndField.value = '5';
}
onload = function(){//Note: This fires automatically when the page has loaded
	getFieldsById();
	setDefaults();
}
</script>
</head>
<body>
<form id="myForm">
	<h1>Fibonacci/Lucas Series</h1>
	<div id="controls1">
		<input id="r1" name="pick" type="radio" value="Fib" onclick="setFib()" checked><label for="r1">Set Fibonacci</label>
		<br>
		<input id="r2" name="pick" type="radio" value="Luc" onclick="setLucas()"><label for="r2">Set Lucas</label>
	</div>
	<div id="dataFields">
		Seed 1 : <input id="seed1"><br>
		Seed 2 : <input id="seed2"><br>
		Number of terms : <input id="index_end">
	</div>
	<div id="controls">
		<input type="button" value="Show" onclick="show();">&nbsp;
		<input type="button" value="Clear" onclick="clearResults();">
	</div>
	<div id="results">
		<textarea id="result" rows="20" cols="55"></textarea>
	</div>
</form>
</body>
</html>

Notes:

1. Almost all code is organised in functions, which are called from the HTML and also call each other. Programming by function is good practise as keeps the code tidy and allows chunks of code to be reused (by calling a function as many times as necessary).
2. The code does not need to find out the settings of the "Fibonacci" and "Lucas" buttons; instead clicking the buttons causes functions setFib() and setLucas() to be called.
3. The calculate() function accumulates the sequence in an array, and returns a string derived from this array using array.join(). Thus, calculate() calculates and returns a result while show() is responsible for displaying the result.
4. See comments in code for detailed explanation on certain points.

I suggest you paste my code into a file and save as something like "example.html" then view it in your broswer.

Airshow

[JooClops]

Wow, Awesome!
thank You :)
So I'm working further on my code,thus I have some questions about Your code(not huge questions don't worry), just something I don't understand as well as other things:
1.resultField = (document.getElementById)? document.getElementById('result') : document.all
few questions about this line:
1)document.all That's what makes the variable global?
2) what does this way of code means " something? statemnt:stament" ? I thought taht the "something" is a condition and statement 1 is if true and statement 2 is if false...is that the same?

about other things:
seqenceArray.join , I'm trying to do the ratio between the last two numbers in the sequence as well (the golden ratio) ,so I was thinking of making a function that will get the sequence array,and calculate the ratio between the last two numbers(although I need to check that the number of terms is more than 1).
but they are joined with (','), how can i separate them in the golden ration function ? arrayname.separate ??
and one last thing:
resultField.innerHTML , when I made the golden ration function(just returned 1.618 ,didn't calculate anything, it was just a test...)
and wrote in the show function resultField.innerHTML=golden(calculate(seed1, seed2, index_end));
It just printed the ratio and didn't print the sequence although there was a statement before it :
resultField.innerHTML=calculate(seed1, seed2, index_end)
What's wrong??

Airshow,
I'M so grateful ,thank You very much.
JC

[Airshow]

JooClops,

1.resultField = (document.getElementById)? document.getElementById('result') : document.all
few questions about this line:
1) document.all That's what makes the variable global?
2) what does this way of code means " something? statemnt:stament" ? I thought taht the "something" is a condition and statement 1 is if true and statement 2 is if false...is that the same?

This caters for older "pre-DOM" (version 4) browsers, which didn't support document.getElementById(). Your understanding of the (condition)?trueExe:falseExe; syntax is absolutely correct. What is not immediately obvious is (document.getElementById) returns true if the method exists and falsy if it doesn't exist. Hence DOM-equipped browsers execute the first method and pre-DOM browsers execute the second. To be strictly correct, there should be further conditions & methods to support yet more browsers, as document.all was itself only supported in some browsers (IIRC it was proprietary, not a W3C standard). However, getElementById and all should cater for 95+% of browsers in use today.

seqenceArray.join , I'm trying to do the ratio between the last two numbers in the sequence as well (the golden ratio), so I was thinking of making a function that will get the sequence array, and calculate the ratio between the last two numbers (although I need to check that the number of terms is more than 1).
but they are joined with (','), how can i separate them in the golden ration function ? arrayname.separate ??

OK, the trick here is to do the gRatio calculation inside function calc where the sequence array is available - as you know, you are interested in its last two entries. The calculation is pretty trivial, but what is less obvious is how to return both the gRatio calculation AND the sequence string. ie. two results from one function! The solution is actually very simple. You need to return a "hash" containng the two results as follows:

return {
    gRatio : seqenceArray[seqenceArray.length-1] / seqenceArray[seqenceArray.length-2],
    sequence : seqenceArray.join(', ')
};

This is a useful technique which can return as many partial results as you need.

Back in function show where calc() was called, you can now access the partial results as follows:

var results = calculate(seed1, seed2, index_end);
    resultField.innerHTML = results.sequence;
    gRatioField.innerHTML = results.gRatio;

resultField.innerHTML , when I made the golden ration function (just returned 1.618, didn't calculate anything, it was just a test...)
and wrote in the show function resultField.innerHTML=golden(calculate(seed1, seed2, index_end));
It just printed the ratio and didn't print the sequence although there was a statement before it :
resultField.innerHTML=calculate(seed1, seed2, index_end)
What's wrong??

The problem there is that foo.innerHTML=string performs a total replacement of the HTML contents of foo; it does not append. Consequently, with two consecutive statements foo.innerHTML=string1 followd by foo.innerHTML=string2 , string1 is completly overwritten by string2.

A solution is to create in your HTML a separate entity, say <div id="gRatio"></div> into which your gRatio calculation will get written (this is assumed in the partial results code snippet above).

I think that should give you enough clues to make more progress; maybe even to complete! But please come back with more questions if you need to.

Airshow

[JooClops]

Woohoo!
Awesome!
It's finished, Thanks to You :D
I made the clear function to clear the gRatioField as well, It's perfect!
And I'll have more questions in the future cause I'll have to do a registration form (almost done) but having troubles checking some stuff,
And ,ASP,MYSQL, is just Foreign for me :< I hope I'll get along with them.

So thank You very much for your help!

Again thanks,

JC

[Airshow]

JooClops,

OK then, it's time to post my full solution.

It will look a bit odd because I have encapsulated most of the code in a Contructor, FIBLUCAS. This is not strictly necessary but is good practice, especially in a co-operative, multi-programmer environment as it is less polluting of the global namespace, hence lower probabilityof name conflicts.

If you want to know more about good Javascript practice and design patterns, then read everything you can by guru Douglas Crockford, and watch all his videos.

Here goes:

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
<title>Fibonacci/Lucas Series Generator</title>
<style type="text/css">
body { font-family:verdana,arial,helvetica,sans-serif; font-size:10pt; background-color:#ffffff; }
h1 { margin-bottom:0 0 6px 0; padding:2px; color:#0c5c0a; background-color:#e0f5db; border:1px solid #0c5c0a; font-family:verdana,arial,helvetica; font-size:12pt; text-align:center; }
hr { height:0; border-top:1px solid #c0c0c0; }
em { font-weight:bold; font-style:normal; }
.clearboth { clear:both; }
#data { float:left; width:187px; height:200px; margin-right:12px; }
#data1, #data2 { width:175px; padding:5px; background-color:#e0f5db; border:1px solid #999999; }
#data2 { border-top-width:0px; text-align:center; }
#controls { float:left; width:65px; height:200px; margin-right:6px; }
#controls .button { margin:0 0 6px 0; display:block; }
#controls .first { margin-top:10px; }
#resultsWrapper { float:left; width:460px; margin-right:12px; }
#results { display:block; margin-top:0px; background-color:#e0f5db; }
#gRatioWrapper { width:100%; margin-top:12px; border-bottom:1px solid #c0c0c0; }
#footer { margin-top:12px; padding:6px; border:0 solid #c0c0c0; border-width:1px 0; color:#999999; font-style:italic; xfont-weight:bold; font-size:9pt; text-align:center; }
#footer a { color:#999999; }
#footer a:hover { color:#666666; }
.note { font-style:italic; }
</style>

<script type="text/javascript">
function FIBLUCAS(defaultTerms, displayElementIds, controlElementIds){
	//***** Parameter Validation *****
	defaultTerms = (!defaultTerms) ? '5': defaultTerms;
	if( !displayElementIds || (typeof displayElementIds != 'object') || !displayElementIds.seed1 || !displayElementIds.seed2 || !displayElementIds.nTerms || !displayElementIds.results || !displayElementIds.gRatio ){
		alert('Error initialising FIBLUCAS (displayElements)');
		return false;
	}
	if( !controlElementIds || (typeof controlElementIds != 'object') || !controlElementIds.fibButton || !controlElementIds.lucasButton || !controlElementIds.showButton || !controlElementIds.clearButton ){
		alert('Error initialising FIBLUCAS (controlElements)');
		return false;
	}
	//***** Private Variables *****
	var that = this;//Standard trick to overcome loss of scope of "this" in private methods and attached event handlers.
	var seed_1Fld = (document.getElementById) ? document.getElementById(displayElementIds.seed1) : document.all[displayElementIds.seed1ID];
	var seed_2Fld = (document.getElementById) ? document.getElementById(displayElementIds.seed2) : document.all[displayElementIds.seed2ID];
	var nTermsFld = (document.getElementById) ? document.getElementById(displayElementIds.nTerms) : document.all[displayElementIds.nTermsID];
	var resultsFld = (document.getElementById) ? document.getElementById(displayElementIds.results) : document.all[displayElementIds.resultsID];
	var gRatioFld = (document.getElementById) ? document.getElementById(displayElementIds.gRatio) : document.all[displayElementIds.gRatioID];
	//***** Private Methods *****
	var attachEventHandlers = function(){
		//Attach Event Handlers to HTML control elements (buttons)
		var fibonacciButton = (document.getElementById) ? document.getElementById(controlElementIds.fibButton) : document.all[controlElementIds.fibButton];
		var lucasButton = (document.getElementById) ? document.getElementById(controlElementIds.lucasButton) : document.all[controlElementIds.lucasButton];
		var showButton = (document.getElementById) ? document.getElementById(controlElementIds.showButton) : document.all[controlElementIds.showButton];
		var clearButton = (document.getElementById) ? document.getElementById(controlElementIds.clearButton) : document.all[controlElementIds.clearButton];
		fibonacciButton.onclick = that.setFib;
		lucasButton.onclick = that.setLucas;
		showButton.onclick = that.show;
		clearButton.onclick = that.clearResults;
	};
	var buildSequence = function(a, b, n, $n){
		//General descripton: Recursive calls drill down to the lowest level, where array R is created and returned all the way up the stack. As the call stack unwinds, so terms are successively added to the **front** of R.
		//Recursion is significantly more complex than a for loop, and with no particular advantage other than the satisfaction of having gotten it to work!
		n = Math.max(2, n);
		$n = (!$n) ? n : $n;
		if(n > 2 && $n == 2) { return [b]; }//Recursion's terminal condition; create and return an array of one element containing b.
		else{
			var R = (n == 2) ? [] : buildSequence(b, (a+b), n, $n-1);//Recursive call. Note special case when n==2 (no drill down, just create an empty array).
			R.unshift(b);//Add this iterations's b to **front** of array R.
			if($n != n){ return R; }//Normal recursive return.
			else{//Special handler for the top level iteration, with return to the original call point.
				R.unshift(a);//Add top-level's a to **front** of R.
				return {//Return hash of Fib/Lucas sequence and "golden ration" calculation.
					sequence : R.join(', '),// Concatenate array R into comma separated string.
					gRatio : R[R.length-1] / R[R.length-2]//Golden Ratio calculation
				};
			}
		}
	};
	var validateFlds = function(){
		if( isNaN(parseInt(seed_1Fld.value, 10)) ){ seed_1Fld.value = '1'; }
		if( isNaN(parseInt(seed_2Fld.value, 10)) ){ seed_2Fld.value = '1'; }
		if( isNaN(parseInt(nTermsFld.value, 10)) || parseInt(nTermsFld.value, 10) < 2){ nTermsFld.value = defaultTerms; }
	};
	//***** Privileged Methods *****
	this.show = function(){
		validateFlds();
		var r = buildSequence( parseInt(seed_1Fld.value, 10), parseInt(seed_2Fld.value, 10), parseInt(nTermsFld.value, 10) );
		resultsFld.innerHTML = r.sequence;
		gRatioFld.innerHTML = r.gRatio.toString();
	};
	this.setFib = function(){
		seed_1Fld.value = '1';
		seed_2Fld.value = '1';
		validateFlds();
		that.clearResults();
	};
	this.setLucas = function(){
		seed_1Fld.value = '2';
		seed_2Fld.value = '1';
		validateFlds();
		that.clearResults();
	};
	this.clearResults = function(){
		resultsFld.innerHTML = '';
		gRatioFld.innerHTML = '&nbsp;';
	};
	this.clearAll = function(){
		seed_1Fld.value = '';
		seed_2Fld.value = '';
		nTermsFld.value = '';
		that.clearResults();
	};
	//***** Init function calls *****
	attachEventHandlers();
	this.clearAll();//Ensures frash start after page refresh.
	window.focus();//Clears system carat after page refresh.
}
var fibLucas;
onload = function(){
	//Here we define two hashes of HTML element ids and pass them as parameters when creating an instance FIBLUCAS. This avoids hard-coding the ids inside FIBLUCAS, and thus provides for **reuse** of FIBLUCAS on the same web page if ever necessary.
	var displayElementIdHash = { seed1:'seed1', seed2:'seed2', nTerms:'nTerms', results:'results', gRatio:'gRatio' };
	var controlElementIdHash = { fibButton:'fibButton', lucasButton:'lucasButton', showButton:'showButton', clearButton:'clearButton' };
	fibLucas = new FIBLUCAS(15, displayElementIdHash, controlElementIdHash);
};
</script>
</head>

<body>
<h1>Fibonacci/Lucas Series Generator</h1>
<!-- Note: Button onclick handlers are attached within JavaScript. Doug Crockford says to avoid specifying as HTML attributes. -->
<div id="data">
	<div id="data1">
		<table>
		<tr><td class="label">First seed</td><td><input id="seed1" class="inputFld" size="5"></td></tr>
		<tr><td class="label">Second seed</td><td><input id="seed2" class="inputFld" size="5"></td></tr>
		<tr><td class="label">Number of terms</td><td><input id="nTerms" class="inputFld" size="5"></td></tr>
		</table>
	</div>
	<div id="data2">
		<input id="fibButton"   type="button" value="Fibonacci">&nbsp;
		<input id="lucasButton" type="button" value="Lucas">
	</div>
</div>
<div id="controls">
	<input id="showButton"  class="button first" type="button" value="Show">
	<input id="clearButton" class="button last"  type="button" value="Clear">
</div>
<div id="resultsWrapper">
	<textarea id="results" cols="55" rows="15"></textarea>
	<div id="gRatioWrapper"><em>Ratio of last two numbers : </em><span id="gRatio"></span></div>
	<div class="note">This will tend to the "Golden Ratio" as the number of terms in the sequence increases.</div>
</div>
<div id="footer" class="clearboth">
	by <em><a href="http://www.daniweb.com/forums/member512379.html" title="Airshow">Airshow</a></em>
</div>
</body>
</html>

Airshow

[JooClops]

Heh,
Your code looks so organized and professional :D
I found a book of Douglas Crockford, the good JS-The good part,
and I'll search for some videos.
well now I really should focus on physics, cause I passed to the second stage of physics olympics in our country :},
but I'll read up as soon as I can, cause It's interesting( I have some goals for the summer: Windows APP in C# and JS and keep learning physics :}

thanks for Your help, I appreciate it greatly.

Cya soon(muhahaha),
JC