Skip to content

Task 4 Submission #28

New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

Sign up for GitHub

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Open
Aakriti582 wants to merge 2 commits into
base: main
Choose a base branch
from
Open

Task 4 Submission #28

Show file tree
Hide file tree
Changes from all commits
Commits
Show all changes
2 commits
Select commit Hold shift + click to select a range
fafcd2e
completed task4
Aakriti582 Apr 9, 2026
67414b5
Merge branch 'MontessoriVisualization:main' into main
Aakriti582 Apr 9, 2026
File filter

Filter by extension

Filter by extension
Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
22 changes: 22 additions & 0 deletions Students/Aakriti/dom.html
View file
Open in desktop
Original file line number Diff line number Diff line change
@@ -0,0 +1,22 @@
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Document</title>
<style>
.butn{
/* background-color: blueviolet; */
}
</style>
<script>
function clicked(){
button.textContent="Clicked";
button.style.backgroundcolor
}
Comment on lines +13 to +16
Copy link

Copilot AI Apr 9, 2026

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

clicked() references button, but no variable named button is defined, so clicking will throw a ReferenceError. Select the element (e.g., via document.querySelector) or pass the element into the handler (e.g., onclick="clicked(this)") and then update its properties; also backgroundcolor should be backgroundColor and the assignment is currently incomplete.

Copilot uses AI. Check for mistakes.
</script>
</head>
<body>
<button class="butn" onclick="clicked()"> Click Me</button>
</body>
</html>
53 changes: 53 additions & 0 deletions Students/Aakriti/dom1.html
View file
Open in desktop
Original file line number Diff line number Diff line change
@@ -0,0 +1,53 @@
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Document</title>
</head>
<body>
<button class="btn">Change Background</button>
</body>
<script>
const colors = ["red","green","blue","yellow","orange"];
const btn = document.querySelector(".btn");
let lastindex = 0;
btn.addEventListener("click",()=>{

let random = Math.floor(Math.random()*colors.length);//range 0 ,0, 0
console.log(random)

// for(let i=0;i<colors.length;i++){// 0,0
// if(random === lastindex){
// random = Math.floor(Math.random()*colors.length);
// i=-1;
// }
// }
//easy infinite loop



// 0===1

for (let index = 0; index < colors.length; index--) {
if(random === lastindex){
random = Math.floor(Math.random()*colors.length);
}
else{
break;
}

}
Comment on lines +32 to +40
Copy link

Copilot AI Apr 9, 2026

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

for (let index = 0; index < colors.length; index--) decrements index while the condition is index < colors.length, which remains true as index becomes negative; if random keeps equaling lastindex, this can loop indefinitely. Use a do...while retry or fix the loop to increment/bound attempts.

Copilot uses AI. Check for mistakes.


console.log(random)
document.body.style.backgroundColor = colors[random];
lastindex = random;

})




</script>
</html>
78 changes: 78 additions & 0 deletions Students/Aakriti/domtask.html
View file
Open in desktop
Original file line number Diff line number Diff line change
@@ -0,0 +1,78 @@
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Document</title>
<style>
.btn{
padding: 10px 20px;
font-size: 1.1em;
color:white;
background-color: #007BFF;
border: none;
}
</style>
</head>
<body>
<button class="btn" >Click Me</button>
<div>
Lorem ipsum dolor sit amet consectetur adipisicing elit. Sint, repellendus quasi!
</div>
<div class="second">
Lorem ipsum dolor sit amet consectetur adipisicing elit. Sint, repellendus quasi!
</div>
<div>
Lorem ipsum dolor sit amet consectetur adipisicing elit. Sint, repellendus quasi!
</div>
<div>
Lorem ipsum dolor sit amet consectetur adipisicing elit. Sint, repellendus quasi!
</div>

</body>
<script>
//dom (Documnet object model ) ever element is an object in js
//we can manipulate the element using js
const btn = document.querySelector(".btn");
// btn.addEventListener("work",function)
btn.addEventListener("click",handelClick);
function handelClick(){
if(btn.textContent === "Click Me"){
btn.style.backgroundColor = "green";
btn.textContent = "Clicked";
}
else{
btn.style.backgroundColor = "#007BFF";
btn.textContent = "Click Me";
}

}
btn.addEventListener("mouseover",function(){
if(btn.textContent === "Clicked"){
}
else{
btn.style.backgroundColor = "red";
}
})
btn.addEventListener("mouseout",function(){
if(btn.textContent === "Click me"){

btn.style.backgroundColor = "#007BFF";
}
})
Comment on lines +57 to +62
Copy link

Copilot AI Apr 9, 2026

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

The mouseout handler checks btn.textContent === "Click me", but the button text is set to "Click Me" / "Clicked" elsewhere. This condition never becomes true, so the background may stay red after hover. Align the string comparison (or better, track clicked state and reset on mouseout when not clicked).

Copilot uses AI. Check for mistakes.


//click ,hover ,mouseout ,keydown ,


const colors = ["red","green","blue","yellow","orange"];

// document.body bg green
// document.getElementsByTagName("button) bg green text white




</script>

</html>
27 changes: 14 additions & 13 deletions Students/Aakriti/task3.js
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -84,7 +84,7 @@ for (let i=0; i<students.length;i++){
console.log(students[i].name)//with meassage
}
}
//top performer
//top performer//to use students updated array
let topPerformer=avgmarks[0]
for (let i=0; i<avgmarks.length;i++){
if(avgmarks[i]>topPerformer){
Expand All @@ -106,40 +106,41 @@ for(let i=0; i<avgmarks.length;i++){
console.log(`The loe Scorer is : ${lowScorer}`)

// Check eligibility (average > 40 AND attendance > 75%)
let eligibility=[]

for(let i=0; i<avgmarks.length;i++){
if(students[i].Average_Marks>40 && students[i].attendance >75){
eligibility.push("PASS")
students[i].eligibility="PASS"
}
else{
eligibility.push("FAIL")
students[i].eligibility="FAIL"
}
}
console.log("The pass/fail eligibilty of each student; ",eligibility)
console.log(students)


//again updating with results
for(let i=0; i<students.length;i++){
students[i].Result=eligibility[i]
// for(let i=0; i<students.length;i++){
// students[i].Result=eligibility[i]

}
console.log("Updated Students Profile with grade and avgmarks:",students)
// }
// console.log("Updated Students Profile with grade and avgmarks:",students)


//pass count
let pcount=0;
for(let i=0;i<eligibility.length;i++){
for(let i=0;i<students[i].length;i++){

if(eligibility[i]==="PASS"){
if(students.eligibility[i]==="PASS"){
pcount+=1
}
}
console.log("The pass count in letslearn is: ",pcount)

//fail count
let fcount=0;
for(let i=0;i<eligibility.length;i++){
for(let i=0;i<students[i].length;i++){

if(eligibility[i]==="PASS"){
if(students.eligibility[i]==="PASS"){
continue;
}
Comment on lines +131 to 145
Copy link

Copilot AI Apr 9, 2026

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

students.eligibility[i] is incorrect because students is an array; the eligibility property is on each student object. Use students[i].eligibility (and similarly in the fail-count loop) so the PASS/FAIL counts reflect the values set earlier.

Copilot uses AI. Check for mistakes.
else{
Expand Down
98 changes: 98 additions & 0 deletions Students/Aakriti/task4.html
View file
Open in desktop
Original file line number Diff line number Diff line change
@@ -0,0 +1,98 @@
<!-- Project idea: Quote + Color Generator

Build a tiny page with one button: every click changes background color and shows a random motivational quote.

How you can do it:

Keep 2 arrays: one for colors, one for short quotes.
On button click, generate random index for both.
Update page background and the text content.
Add one small rule: don’t repeat the same color twice in a row (you already know this concept).
Why this boosts confidence:

Super short build time (15-25 min).
Uses DOM + arrays + random + condition in one clean mini-project.
Looks fun and “real”, so students feel progress fast.
If you want, I can give you 5 more “15-minute confidence projects” in the same style.

const quotes = [
"Believe in yourself and all that you are.",
"Small progress is still progress.",
"Discipline beats motivation.",
"Success is the sum of daily efforts.",
"Stay focused and never give up.",
"Your only limit is your mindset.",
"Dream big, start small, act now.",
"Consistency creates confidence."
];

const colors = [
"#FF6B6B",
"#4ECDC4",
"#45B7D1",
"#F7B267",
"#6A4C93",
"#2EC4B6",
"#FF9F1C",
"#1B9AAA"
]; -->

<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Task4</title>
<style>
button{
background-color: rgb(108, 172, 228);
}
.quote{
color:white;
font-weight:bold;
z-index:-1;
}
</style>
</head>
<body>
<button> Change BG with Quotes</button>
<div class="quote"></div>
</body>
<script>
const colors = ["red","blue","green","yellow","purple","black","orange","grey"];
const quotes = [
"Believe in yourself and all that you are.",
"Small progress is still progress.",
"Discipline beats motivation.",
"Success is the sum of daily efforts.",
"Stay focused and never give up.",
"Your only limit is your mindset.",
"Dream big, start small, act now.",
"Consistency creates confidence."
];

const button = document.querySelector('button');
button.addEventListener("click",function(){
button.textContent="clicked";
let lastindex=0;
let randomColor=Math.floor(Math.random()*colors.length);
for(let i=0; i<colors.length;i--){
if(randomColor===lastindex){
Comment on lines +75 to +80
Copy link

Copilot AI Apr 9, 2026

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

lastindex is declared inside the click handler (let lastindex = 0;), so it resets on every click and can’t prevent repeating the same color across clicks. Declare the last-used color index outside the handler (persist between clicks) and update it after choosing a new color.

Copilot uses AI. Check for mistakes.
randomColor=Math.floor(Math.random()*colors.length);
}
else{
break
}
}
Comment on lines +79 to +86
Copy link

Copilot AI Apr 9, 2026

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

for(let i=0; i<colors.length; i--) decrements i while the loop condition is i < colors.length, which stays true as i goes negative; if randomColor keeps matching lastindex, this can loop indefinitely. Replace this with a bounded retry (e.g., do...while), a while loop with a max-iterations guard, or adjust the for loop to increment correctly.

Copilot uses AI. Check for mistakes.
document.body.style.backgroundColor = colors[randomColor];

// let randomQuotes=Math.floor(Math.random()*quotes.length)
lastindex=randomColor;
const div=document.querySelector('div')
div.textContent=quotes[lastindex];

Comment on lines +87 to +93
Copy link

Copilot AI Apr 9, 2026

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

The quote selection uses quotes[lastindex], where lastindex is being set from the chosen color index. This couples quote choice to the color array length/order and doesn’t produce a random quote. Generate a separate random quote index (independent of the color index) and use that for div.textContent.

Copilot uses AI. Check for mistakes.

})

</script>
</html>
22 changes: 22 additions & 0 deletions Students/Aakriti/try.html
View file
Open in desktop
Original file line number Diff line number Diff line change
@@ -0,0 +1,22 @@
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Document</title>
</head>
<body>
<p id="p1">
This is a text.
This is a text.
This is a text.
This is a text.
</p>

<input type="button" value="Hide text" onclick="document.getElementById('p1').style.visibility='hidden'">
<input type="button" value="Show text" onclick="document.getElementById('p1').style.visibility='visible'">

<input type="button" value="aakriti" onclick="document.getElementById('p1').style.visibility='hidden'">
<input type="button" value="richa" onclick="document.getElementById('p1').style.visibility='visible'">
</body>
</html>
Loading