Bulbs in javascript

Marko Anic · November 11, 2020

Hello.I started learning javascript and my professor give me this to solve. Its program that turn on and turn off bulbs on different ways. It have number of bulbs and number of variations . The problem is that i don't know how to use function deleteBulbs because when i type smaller number , those who left must get changed with blank.jpg but they won't. Please help me and sorry for my bad english. I uploaded images with problem. In first example, 3 are turned on . So in example 2,when i type 1 and 0, last bulb is turned off and other 2 must be blank but they are not in my case.

<!DOCTYPE html>
<html>
<head>
<title>
</title>
</head>
<body>
<p> <b> Task: </b> There are <i> n </i> bulbs in the room, each of which is turned on by a separate switch. How many ways can a room be lit? </p>
 Number of bulbs: <input id = "numOfBulbs" type = "number"> </p>
Number of variations<input id="numOfVariations" type="number"></p>
<p> <button type="button" onclick="numOfVariations();">Light up </button> </p>
<img id="image7" src="blank.jpg">
<img id="image6" src="blank.jpg">
<img id="image5" src="blank.jpg">
<img id="image4" src="blank.jpg">
<img id="image3" src="blank.jpg">
<img id="image2" src="blank.jpg">
<img id="image1" src="blank.jpg">
<img id="image0" src="blank.jpg">
<p id="solution"></p>
<script>
function numOfVariations()
{
var n, i, p=1,v,s;
n=document.getElementById("numOfBulbs").value;
if(n>8 || n<=0)
{
window.alert("Incorrect number of bulbs!");
var s=document.getElementById("image0").value;
s.src="blank.jpg" ;
s=document.getElementById("image2").value;
s.src="blank.jpg";
s=document.getElementById("image3").value;
s.src="blank.jpg";
s=document.getElementById("image4").value;
s.src="blank.jpg";
s=document.getElementById("image5").value;
s.src="blank.jpg";
s=document.getElementById("image6").value;
s.src="blank.jpg";
s=document.getElementById("image7").value;
s.src="blank.jpg";
document.getElementById("solution").innerHTML="Total variations: 0";
return;
}
v=document.getElementById("numOfVariations").value;
for (i=1;i<=n;i++) p*=2;
if((v<0) || (v>=p)){
window.alert("Incorrect number of variations!");
var s=document.getElementById("image0").value;
s.src="blank.jpg" ;
s=document.getElementById("image1").value;
s.src="blank.jpg";
s=document.getElementById("image2").value;
s.src="blank.jpg";
s=document.getElementById("image3").value;
s.src="blank.jpg";
s=document.getElementById("image4").value;
s.src="blank.jpg";
s=document.getElementById("image5").value;
s.src="blank.jpg";
s=document.getElementById("image6").value;
s.src="blank.jpg";
s=document.getElementById("image7").value;
s.src="blank.jpg";
document.getElementById("solution").innerHTML="Total variations:"+ p;
return;
}
document.getElementById("solution").innerHTML="Total variations:"+ p;
p=1;
for(i=0;i<n;i++){
if(v&p) turnOn(i);
else
turnOff(i);
p*=2;
}

}
function turnOff(i)
{
var s;
if(i==0){
s=document.getElementById("image0");
s.src="off.jpg";
}
if(i==1){
s=document.getElementById("image1");
s.src="off.jpg";
}
if(i==2){
s=document.getElementById("image2");
s.src="off.jpg";
}
if(i==3){
s=document.getElementById("image3");
s.src="off.jpg";
}
if(i==4){
s=document.getElementById("image4");
s.src="off.jpg";
}
if(i==5){
s=document.getElementById("image5");
s.src="off.jpg";
}
if(i==6){
s=document.getElementById("image6");
s.src="off.jpg";
}
if(i==7){
s=document.getElementById("image7");
s.src="off.jpg";
}
}
function turnOn(i)
{
var s;
if(i==0){
s=document.getElementById("image0");
s.src="on.jpg";
}
if(i==1){
s=document.getElementById("image1");
s.src="on.jpg";
}
if(i==2){
s=document.getElementById("image2");
s.src="on.jpg";
}
if(i==3){
s=document.getElementById("image3");
s.src="on.jpg";
}
if(i==4){
s=document.getElementById("image4");
s.src="on.jpg";
}
if(i==5){
s=document.getElementById("image5");
s.src="on.jpg";
}
if(i==6){
s=document.getElementById("image6");
s.src="on.jpg";
}
if(i==7){
s=document.getElementById("image7");
s.src="on.jpg";
}
}
function deleteBulbs(i)
{
var s;
if(i==0){
s=document.getElementById("image0");
s.src="blank.jpg";
}
if(i==1){
s=document.getElementById("image1");
s.src="blank.jpg";
}
if(i==2){
s=document.getElementById("image2");
s.src="blank.jpg";
}
if(i==3){
s=document.getElementById("image3");
s.src="blank.jpg";
}
if(i==4){
s=document.getElementById("image4");
s.src="blank.jpg";
}
if(i==5){
s=document.getElementById("image5");
s.src="blank.jpg";
}
if(i==6){
s=document.getElementById("image6");
s.src="blank.jpg";
}
if(i==7){
s=document.getElementById("image7");
s.src="blank.jpg";
}

}
</script>
</body>
</html>

y are not.

bulbs translated.rar

Hema · November 12, 2020

first of all let's try to solve what do you mean step by step because i'm also not an expert but i may tell you what to do or where to find the hint for doing it,

1- the first thing can you get the value that you add it to the text input or not ?

please answer it to get to the second step.

Sign In

Bulbs in javascript

Recommended Posts

Marko Anic

Link to comment

Share on other sites

Hema

Link to comment

Share on other sites

Create an account or sign in to comment

Create an account

Sign in

Browse

Activity