<!DOCTYPE html>
<html>
<head>
<title>Sentai and Kamen Rider Character Generator</title>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
</head>
<body>
<h1>Choose your character type:</h1>
<label>
<input type="radio" name="character_type" value="sentai"> Sentai
</label>
<label>
<input type="radio" name="character_type" value="kamen_rider"> Kamen Rider
</label>
<br><br>
<div id="sentai_form" style="display:none;">
<h2>Choose your color:</h2>
<label>
<input type="radio" name="sentai_color" value="Red"> Red
</label>
<label>
<input type="radio" name="sentai_color" value="Blue"> Blue
</label>
<label>
<input type="radio" name="sentai_color" value="Yellow"> Yellow
</label>
<label>
<input type="radio" name="sentai_color" value="Green"> Green
</label>
<label>
<input type="radio" name="sentai_color" value="Pink"> Pink
</label>
<label>
<input type="radio" name="sentai_color" value="White"> White
</label>
<label>
<input type="radio" name="sentai_color" value="Gold"> Gold
</label>
<label>
<input type="radio" name="sentai_color" value="Silver"> Silver
</label>
<br><br>
</div>
<button onclick="generateCharacter()">Generate Character</button>
<script>
function generateCharacter() {
var characterType = document.querySelector('input[name="character_type"]:checked').value;
var characterString = "Your character is a ";
if (characterType === "sentai") {
var sentaiColor = document.querySelector('input[name="sentai_color"]:checked');
if (!sentaiColor) {
alert("Please choose a color for your Sentai character.");
return;
}
characterString += sentaiColor.value + " Sentai member.\n";
characterString += "Age: " + generateRandomAge() + "\n";
characterString += "Gender: " + generateRandomGender() + "\n";
characterString += "Height: " + generateRandomHeight() + "\n";
characterString += "Place of Residence: " + generateRandomResidence() + "\n";
characterString += "Personality: " + generateRandomPersonality() + "\n";
characterString += "Occupation: " + generateRandomOccupation() + "\n";
characterString += "Catchphrase: " + generateRandomCatchphrase() + "\n";
characterString += "Weapon Name: " + generateRandomWeaponName() + "\n";
} else if (characterType === "kamen_rider") {
var kamenRiderNumber = Math.floor(Math.random() * 2) + 1;
if (kamenRiderNumber === 1) {
characterString += "Kamen Rider 1.\n";
characterString += "Age: " + generateRandomAge() + "\n";
characterString += "Gender: " + generateRandomGender() + "\n";
characterString += "Height: " + generateRandomHeight() + "\n";
characterString += "Place of Residence: " + generateRandomResidence() + "\n";
characterString += "Personality: " + generateRandomPersonality() + "\n";
characterString += "Occupation: " + generateRandomOccupation() + "\n";
characterString += "Catchphrase: " + generateRandomCatchphrase() + "\n";
characterString += "Bike: <img src='kamen_rider_1_bike.jpg' alt='Kamen Rider 1 bike'>\n";
} else {
characterString += "Kamen Rider 2.\n";
characterString += "Age: " + generateRandomAge() + "\n";
characterString += "Gender: " + generateRandomGender() + "\n";
characterString += "Height: " + generateRandomHeight() + "\n";
characterString += "Place of Residence: " + generateRandomResidence() + "\n";
characterString += "Personality: " + generateRandomPersonality() + "\n";
characterString += "Occupation: " + generateRandomOccupation() + "\n";
characterString += "Catchphrase: " + generateRandomCatchphrase() + "\n";
characterString += "Bike: <img src='kamen_rider_2_bike.jpg' alt='Kamen Rider 2 bike'>\n";
}
}
document.body.innerHTML += "<p>" + characterString + "</p>";
}
function generateRandomAge() {
return Math.floor(Math.random() * 40) + 20;
}
function generateRandomGender() {
var genders = ["Male", "Female"];
return genders[Math.floor(Math.random() * 2)];
}
function generateRandomHeight() {
return Math.floor(Math.random() * 40) + 140;
}
function generateRandomResidence() {
var residences = ["Tokyo", "Kyoto", "Osaka", "Hokkaido", "Fukuoka", "Nagoya", "Sapporo", "Yokohama"];
return residences[Math.floor(Math.random() * residences.length)];
}
function generateRandomPersonality() {
var personalities = ["Serious", "Silly", "Brave", "Cowardly", "Arrogant", "Humble", "Caring", "Selfish"];
return personalities[Math.floor(Math.random() * personalities.length)];
}
function generateRandomOccupation() {
var occupations = ["Student", "Office Worker", "Chef", "Freelancer", "Athlete", "Teacher", "Police Officer", "Doctor"];
return occupations[Math.floor(Math.random() * occupations.length)];
}
function generateRandomCatchphrase() {
var catchphrases = ["Let's do it!", "We will win!", "Justice will prevail!", "Our bond is unbreakable!", "I won't give up!", "This is our fate!", "Our hearts are one!", "We'll fight to the end!"];
return catchphrases[Math.floor(Math.random() * catchphrases.length)];
}
function generateRandomWeaponName() {
var weaponNames = ["Thunder Sword", "Flame Bow", "Ice Hammer", "Earth Axe", "Wind Fan", "Water Trident", "Light Laser", "Shadow Dagger"];
return weaponNames[Math.floor(Math.random() * weaponNames.length)];
}
document.querySelector('input[name="character_type"][value="sentai"]').addEventListener("click", function() {
document.getElementById("sentai_form").style.display = "block";
});
document.querySelector('input[name="character_type"][value="kamen_rider"]').addEventListener("click", function() {
document.getElementById("sentai_form").style.display = "none";
});
</script>
</body>
</html>