Skip to content

Commit

Permalink
update
Browse files Browse the repository at this point in the history 
added units for time
  • Loading branch information
@sk66641
sk66641 committed May 26, 2024
1 parent a85cc3b commit 135d783
Show file tree
Hide file tree
Showing 4 changed files with 61 additions and 49 deletions.
15 changes: 4 additions & 11 deletions README.md
View file
Original file line number Diff line number Diff line change
Expand Up @@ -19,35 +19,28 @@ On the basis of these three inputs, it simulates conic or linear view for given
<td>
<ul>
<li>1000</li>
<li>1</li>
<li>1 milliseconds</li>
<li>conic</li>
</ul>
</td>
<td>
<ul>
<li>1000</li>
<li>1</li>
<li>1 milliseconds</li>
<li>radial</li>
</ul>
</td>
<td>
<ul>
<li>2</li>
<li>500</li>
<li>500 milliseconds</li>
<li>linear</li>
</ul>
</td>
<td>
<ul>
<li>7</li>
<li>500</li>
<li>conic</li>
</ul>
</td>
<td>
<ul>
<li>1000</li>
<li>1</li>
<li>1 milliseconds</li>
<li>linear</li>
</ul>
</td>
Expand Down
13 changes: 9 additions & 4 deletions index.html
View file
Original file line number Diff line number Diff line change
Expand Up @@ -13,17 +13,22 @@
<div class="box">
<h1>Random Disco Light Simulator</h1>
<div>
<label>1. Number of Colors:</label>
<label for="color">1. Number of Colors:</label>
<input type="number" id="color" placeholder="Enter">
</div>
<div>
<label>2. Time interval (<em>'in milliseconds'</em>), <br>with which the color changes
randomly:</label><br>
<label for="time">2. Time interval <em>(with which the color changes
randomly)</em>:</label><br>
<input type="number" id="time" placeholder="Enter">
<select id="unit">
<option style="background-color: lightslategray; color: white;" value="unit">Unit</option>
<option value="milliseconds">milliseconds</option>
<option value="seconds">seconds</option>
</select>
<br><strong>[Negative interval or no input will be treated as 0 interval]</strong>
</div>
<div>
<label>3. View:</label>
<label for="view">3. View:</label>
<select id="view">
<option style="background-color: lightslategray; color: white;" value="select">Select</option>
<option value="conic">Conic</option>
Expand Down
79 changes: 46 additions & 33 deletions script.js
View file
Original file line number Diff line number Diff line change
Expand Up @@ -15,6 +15,7 @@ function run() {

let n = document.getElementById("color").value
let set_time = document.getElementById("time").value
let unit = document.getElementById("unit").value
let view = document.getElementById("view").value

if (Number(n) < 0) {
Expand All @@ -35,16 +36,21 @@ function run() {

}

else if (unit == "unit") {
document.getElementById("error").innerText = "Please select 'Unit'!"
document.getElementById("error").style.color = "red"
}

else if (view == "select") {
document.getElementById("error").innerText = "Please select 'View'!"
document.getElementById("error").style.color = "red"
}

else {
document.body.children[0].style.display = 'none';

alert("Double click on the screen to reload!")

document.body.children[0].style.display = 'none';

document.body.style.cursor = "pointer";

document.body.addEventListener("dblclick", () => {
Expand All @@ -55,53 +61,60 @@ function run() {
})
}

function number(n) {
let ch = `${getRandomColor()}, `;
if (n == parseInt(n)) {
while (n >= 2) {
ch += `${getRandomColor()}, `;
n = n - 1;
}
return ch;
if (unit != "unit") {

if (unit == "seconds") {
set_time *= 1000;
}
}

setInterval(() => {
random_color = `${getRandomColor()}`;
}, `${set_time}`);
function number(n) {
let ch = `${getRandomColor()}, `;
if (n == parseInt(n)) {
while (n >= 2) {
ch += `${getRandomColor()}, `;
n = n - 1;
}
return ch;
}
}

if (n == 1 && view != "select") {
document.body.style.backgroundColor = `${getRandomColor()}`
setInterval(() => {
document.body.style.backgroundColor = `${getRandomColor()}`
random_color = `${getRandomColor()}`;
}, `${set_time}`);
}

else if (n > 1) {
if (n == 1 && view != "select") {
document.body.style.backgroundColor = `${getRandomColor()}`
setInterval(() => {
document.body.style.backgroundColor = `${getRandomColor()}`
}, `${set_time}`);
}

if (view == "conic") {
else if (n > 1) {

if (view == "conic") {

document.body.style.background = `conic-gradient(${random_color}, ${number(n - 1)} ${random_color})`;
setInterval(() => {
document.body.style.background = `conic-gradient(${random_color}, ${number(n - 1)} ${random_color})`;
}, `${set_time}`);
setInterval(() => {
document.body.style.background = `conic-gradient(${random_color}, ${number(n - 1)} ${random_color})`;
}, `${set_time}`);

}
else if (view == "linear") {
}
else if (view == "linear") {

document.body.style.background = `linear-gradient(${number(n - 1)} ${random_color})`;
setInterval(() => {
document.body.style.background = `linear-gradient(${number(n - 1)} ${random_color})`;
}, `${set_time}`);
setInterval(() => {
document.body.style.background = `linear-gradient(${number(n - 1)} ${random_color})`;
}, `${set_time}`);

}
else if (view == "radial") {
}
else if (view == "radial") {

document.body.style.background = `radial-gradient(${number(n - 1)} ${random_color})`;
setInterval(() => {
document.body.style.background = `radial-gradient(${number(n - 1)} ${random_color})`;
}, `${set_time}`);
setInterval(() => {
document.body.style.background = `radial-gradient(${number(n - 1)} ${random_color})`;
}, `${set_time}`);

}
}
}

Expand Down
3 changes: 2 additions & 1 deletion style.css
View file
Original file line number Diff line number Diff line change
Expand Up @@ -26,7 +26,8 @@ h1 {
box-shadow: 0px 0px 15px 10px black;
}

#view {
#view,
#unit {
text-align: center;
border-radius: 10px;
}
Expand Down

0 comments on commit 135d783

Please sign in to comment.