From 5fd81c8920330410144e072f24a362f788ea5354 Mon Sep 17 00:00:00 2001 From: vista-man <524715@vistacollege.nl> Date: Mon, 27 Jan 2025 20:37:24 +0100 Subject: [PATCH] Add comments and styling enhancements to Fibonacci generator application --- JavaScript/fibonacci/fibonacci.js | 21 ++++++++++++--------- JavaScript/fibonacci/index.html | 14 +++++++------- JavaScript/fibonacci/styles.css | 7 +++++++ 3 files changed, 26 insertions(+), 16 deletions(-) diff --git a/JavaScript/fibonacci/fibonacci.js b/JavaScript/fibonacci/fibonacci.js index e6bb775..1bb9b2c 100644 --- a/JavaScript/fibonacci/fibonacci.js +++ b/JavaScript/fibonacci/fibonacci.js @@ -1,19 +1,22 @@ +// Function to generate the first N numbers of the Fibonacci sequence function generateFibonacci(n) { - if (n <= 0) return []; - if (n === 1) return [0]; - if (n === 2) return [0, 1]; + if (n <= 0) return []; // Return an empty array if n is less than or equal to 0 + if (n === 1) return [0]; // Return [0] if n is 1 + if (n === 2) return [0, 1]; // Return [0, 1] if n is 2 - const fib = [0, 1]; + const fib = [0, 1]; // Initialize the array with the first two Fibonacci numbers for (let i = 2; i < n; i++) { - fib.push(fib[i - 1] + fib[i - 2]); + fib.push(fib[i - 1] + fib[i - 2]); // Calculate the next Fibonacci number and add it to the array } - return fib; + return fib; // Return the array containing the first N Fibonacci numbers } +// Function to display the Fibonacci sequence on the webpage function displayFibonacci() { - const n = parseInt(document.getElementById('fibonacciInput').value); - const result = generateFibonacci(n); - document.getElementById('fibonacciResult').innerText = result.join(', '); + const n = parseInt(document.getElementById('fibonacciInput').value); // Get the input value and convert it to an integer + const result = generateFibonacci(n); // Generate the Fibonacci sequence + document.getElementById('fibonacciResult').innerText = result.join(', '); // Display the result on the webpage } +// Add an event listener to the button to call the displayFibonacci function when clicked document.getElementById('generateButton').addEventListener('click', displayFibonacci); diff --git a/JavaScript/fibonacci/index.html b/JavaScript/fibonacci/index.html index 542e1f3..775d15f 100644 --- a/JavaScript/fibonacci/index.html +++ b/JavaScript/fibonacci/index.html @@ -4,14 +4,14 @@ Fibonacci Generator - + -

Fibonacci Generator

- - - -

- +

Fibonacci Generator

+ + + +

+ diff --git a/JavaScript/fibonacci/styles.css b/JavaScript/fibonacci/styles.css index c528bd2..813b888 100644 --- a/JavaScript/fibonacci/styles.css +++ b/JavaScript/fibonacci/styles.css @@ -1,3 +1,4 @@ +/* Style for the body element */ body { font-family: Arial, sans-serif; display: flex; @@ -9,19 +10,23 @@ body { background-color: #f0f0f0; } +/* Style for the h1 element */ h1 { color: #333; } +/* Style for the label, input, and button elements */ label, input, button { margin: 10px 0; } +/* Style for the input and button elements */ input, button { padding: 10px; font-size: 16px; } +/* Style for the button element */ button { background-color: #007BFF; color: white; @@ -29,10 +34,12 @@ button { cursor: pointer; } +/* Style for the button element when hovered */ button:hover { background-color: #0056b3; } +/* Style for the paragraph displaying the result */ #fibonacciResult { margin-top: 20px; font-size: 18px;