Kilokem/BroCodeJS
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

RearangeClockMiniProjectAndOthers

Browse Source
This commit is contained in:
Kilokem
2024-10-10 18:01:24 +02:00
parent 182c614783
commit dacbb89950
22 changed files with 232 additions and 2 deletions
Download Patch File Download Diff File Expand all files Collapse all files

80
Practice/ConditionalConquest/index.html Normal file
View File

@ -0,0 +1,80 @@
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Another Junkie site!</title>
</head>
<body>
<div>
<h1>Which one is bigger?</h1>
<label for="">Number a: </label>
<input type="text" id="numberaa">
<label for="">Number b: </label>
<input type="text" id="numberba">
<input type="button" value="Curiculum" id="TheAnsweer">
<p id="answera">The stick of TRUTH</p>
</div>
<div>
<h1 id="thevalueoftruth">CHECKED!</h1>
<label for="theboxoftruth">Checkbox: </label>
<input type="checkbox" checked id="theboxoftruth">
</div>
<div>
<h1>Radio</h1>
<label for="cardiradio">Card1</label>
<input type="radio" name="rad1" id="cardiradio"><label for="cardiradio" id="cardiradiolab"></label><br>
<label for="cardtradio">Card2</label>
<input type="radio" name="rad1" id="cardtradio"><label for="cardtradio" id="cardtradiolab"></label><br>
<label for="cardhradio">Card3</label>
<input type="radio" name="rad1" id="cardhradio"><label for="cardhradio" id="cardhradiolab"></label><br>
<input type="button" value="Submit!" id="radiosubmitter">
</div>
<div></div>
<h1>Ternary operations</h1>
<label for="cardiradio">Card1</label>
<input type="radio" name="rad1" id="cardiradiott" onchange=RadioChanged()><br>
<label for="cardtradio">Card2</label>
<input type="radio" name="rad1" id="cardiradiott2" onchange=RadioChanged()><br>
<label for="cardhradio">Card3</label>
<input type="radio" name="rad1" id="cardiradiott3" onchange=RadioChanged()><br>
<label for="" id="checkedone"></label><br>
</div>
<div>
<h1>Days of the week</h1>
<label for="week-slider">Select a day of the week:</label>
<input type="range" name="week-slider" min="0" max="6" step="1" value="0" id="daysliderer">
<h2 id="daysoftheweek"></h2>
</div>
<div>
<h1>String manipulation</h1>
<label for="textimput">Some string: </label>
<input type="text" name="textimput" id="themodifierinputtext" value="Alapszöveg!">
<p id="modifiedoutput"></p>
</div>
<div>
<h1>MethodChaining</h1>
<input type="button" value="BEGIN THE QUESTIONING!!!" id="MethodChaining">
<p id="capitalisedletter">Your name with capital first letter: </p>
</div>
<div>
<h1>PIRAMIDTIME!!!!</h1>
<input type="button" value="PIRAMIDTIME!" id="beginpiramid">
<p id="piramidtime"></p>
</div>
<div>
<h1>NUMBER Guesser!</h1>
<p>Guess the number between 10 and 25!</p>
<input type="button" value="Begin!" id="Guesserbeginer">
</div>
<script src="script.js"></script>
</body>
</html>

152
Practice/ConditionalConquest/script.js Normal file
View File

@ -0,0 +1,152 @@
document.addEventListener("DOMContentLoaded", function() {
document.getElementById("TheAnsweer").onclick = function(){
let a = Number(document.getElementById("numberaa").textContent);
let b = Number(document.getElementById("numberba").textContent);
if(a > b){
document.getElementById("answera").textContent = "Number a is bigger!!!!";
}else{
document.getElementById("answera").textContent = "Number b is bigger!!!!";
}
};
document.getElementById("theboxoftruth").onchange = function(){
let a = document.getElementById("theboxoftruth").checked;
if(a == true){
document.getElementById("thevalueoftruth").textContent = "CHECKED!";
}else{
document.getElementById("thevalueoftruth").textContent = "UNCHECKED!";
}
};
document.getElementById("radiosubmitter").onclick = function(){
document.getElementById("cardiradiolab").textContent = document.getElementById("cardiradio").checked;
document.getElementById("cardtradiolab").textContent = document.getElementById("cardtradio").checked;
document.getElementById("cardhradiolab").textContent = document.getElementById("cardhradio").checked;
};
document.getElementById("daysliderer").onchange = function(){ //The switch
let day = "asd";
switch(Number(document.getElementById("daysliderer").value)){
case 0:
day = "Monday";
break;
case 1:
day = "Tuesday";
break
case 2:
day = "Wednesday";
break
case 3:
day = "Thursday";
break
case 4:
day = "Friday";
break
case 5:
day = "Saturday";
break
case 6:
day = "Sunday";
break
}
document.getElementById("daysoftheweek").textContent = day;
};
document.getElementById("themodifierinputtext").onchange = function(){ //Text mods text.trim() will reomve all the widespaces before and after the string
let text = document.getElementById("themodifierinputtext").value;
let out = document.getElementById("modifiedoutput");
if(Boolean(text)){
out.innerHTML = "The first letter: " + text.charAt(0) + "<br>";
out.innerHTML += "The last letter: " + text.charAt(text.length - 1) + "<br>";
out.innerHTML += "First location of the letter 's': " + text.indexOf('s') + "<br>";
out.innerHTML += "Last location of the letter 's': " + text.lastIndexOf('s') + "<br>";
out.innerHTML += "Uppercase: " + text.toUpperCase() + "<br>";
out.innerHTML += "Lovercase: " + text.toLowerCase() + "<br>";
out.innerHTML += "Repeate: " + text.repeat(3) + "<br>";
out.innerHTML += "Does it starts with 'Awesome': " + text.startsWith("Awesome") + "<br>";
out.innerHTML += "Does it ends with 'me': " + text.startsWith("me") + "<br>";
out.innerHTML += "Replace letter 'a' with 'o': " + text.replaceAll("a", "o") + "<br>";
out.innerHTML += "Fill till 15 with 'o': " + text.padStart(15, "o") + "<br>";
out.innerHTML += "Fill till 15 with 'o': " + text.padEnd(15, "o") + "<br>";
out.innerHTML += "Slice: " + text.slice(0, 3) + "<br>";
}else{
out.innerHTML = "";
}
};
document.getElementById("MethodChaining").onclick = function(){ //Method chaining
let name = null;
while (name === "" || name === null) { // Strict operators: === and !== compares the value and the type while single == and != just compares the value
name = window.prompt("Please enter your gorgeous name!! THERES NO ESCAPE!");
}
name = name.trim();
document.getElementById("capitalisedletter").innerHTML += name.charAt(0).toUpperCase() + name.slice(1)
};
document.getElementById("beginpiramid").onclick = function() {
let out = document.getElementById("piramidtime");
if(out.innerHTML === ""){
for (let i = 0; i < 30; i++) {
for(let j = i; j < 15; j++){
out.innerHTML += "V";
for (let ii = 0; ii < i; ii++) {
out.innerHTML += "A";
}
}
out.innerHTML += "<br/>";
}
}else out.innerHTML = "";
};
document.getElementById("Guesserbeginer").onclick = function(){
const min = 10, max = 24;
random = Math.trunc(Math.random()*(max-min)) + min
do {
answer = window.prompt("Guess the number between 10 and 25!")
} while (random !== Number(answer) && answer !== "" && answer !== null);
random === Number(answer) ? alert("You guessed it!!!") : null;
};
});
function RadioChanged(){ //ternary operator statement ? true : false
document.getElementById("checkedone").textContent =
document.getElementById("cardiradiott").checked ? "Card1" :
document.getElementById("cardiradiott2").checked ? "Card2" :
document.getElementById("cardiradiott3").checked ? "Card3" :
"Not this!";
};
//Messing with lists
let fruits = ["Apple", "Preal", "Plum", "Banana", "Orange"];
console.log(fruits);
console.log(fruits[2]);
fruits[0] = "Coconut";
fruits.push("Apple");
console.log(fruits);
fruits.pop();
console.log(fruits.length);
console.log(fruits);
for (let index = 0; index < fruits.length; index++) {
console.error("Fake warning!!! " + fruits[index]);
}
for(let item of fruits){
console.log(item);
}
fruits.sort();
console.log(fruits);
fruits.sort().reverse();
console.log(fruits);
//https://youtu.be/lfmg-EJ8gm4?si=I0Ugyw-qkk3VX8Rk&t=7429