add character generator web page
This commit is contained in:
		
							parent
							
								
									dd4aada41c
								
							
						
					
					
						commit
						375b664373
					
				
							
								
								
									
										24
									
								
								web/chargen.html
									
									
									
									
									
										Normal file
									
								
							
							
						
						
									
										24
									
								
								web/chargen.html
									
									
									
									
									
										Normal file
									
								
							@ -0,0 +1,24 @@
 | 
				
			|||||||
 | 
					<!DOCTYPE html>
 | 
				
			||||||
 | 
					<html lang="en">
 | 
				
			||||||
 | 
					<head>
 | 
				
			||||||
 | 
					    <meta charset="UTF-8">
 | 
				
			||||||
 | 
					    <title>Gamma World Character Generator</title>
 | 
				
			||||||
 | 
					    <script src="chargen.js" defer></script>
 | 
				
			||||||
 | 
					</head>
 | 
				
			||||||
 | 
					<body>
 | 
				
			||||||
 | 
					<h1> Gamma World Character Generator </h1>
 | 
				
			||||||
 | 
					<h2> Generate A Character </h2>
 | 
				
			||||||
 | 
					<form id="characterForm">
 | 
				
			||||||
 | 
					    <select id="charType">
 | 
				
			||||||
 | 
					        <option value="human">Human</option>
 | 
				
			||||||
 | 
					        <option value="humanoid">Humanoid</option>
 | 
				
			||||||
 | 
					        <option value="mutant">Mutant</option>
 | 
				
			||||||
 | 
					        <option value="cyborg">Cyborg</option>
 | 
				
			||||||
 | 
					    </select>
 | 
				
			||||||
 | 
					    <button type="submit">Generate character</button>
 | 
				
			||||||
 | 
					</form>
 | 
				
			||||||
 | 
					<hr/>
 | 
				
			||||||
 | 
					<div id="resultSection"></div>
 | 
				
			||||||
 | 
					
 | 
				
			||||||
 | 
					</body>
 | 
				
			||||||
 | 
					</html>
 | 
				
			||||||
							
								
								
									
										67
									
								
								web/chargen.js
									
									
									
									
									
										Normal file
									
								
							
							
						
						
									
										67
									
								
								web/chargen.js
									
									
									
									
									
										Normal file
									
								
							@ -0,0 +1,67 @@
 | 
				
			|||||||
 | 
					document.getElementById('characterForm').addEventListener('submit', function(event) {
 | 
				
			||||||
 | 
					  event.preventDefault(); // Prevents form from submitting normally
 | 
				
			||||||
 | 
					  
 | 
				
			||||||
 | 
					  // Retrieves selected character type
 | 
				
			||||||
 | 
					  var charType = document.getElementById('charType').value;
 | 
				
			||||||
 | 
					  
 | 
				
			||||||
 | 
					  // Makes a POST request to endpoint with selected charType as parameter
 | 
				
			||||||
 | 
					  fetch('http://gammaworld.gmgauthier.com/character/generate', {
 | 
				
			||||||
 | 
					    method: 'POST',
 | 
				
			||||||
 | 
					    headers: {
 | 
				
			||||||
 | 
					      'Content-Type': 'application/json'
 | 
				
			||||||
 | 
					    },
 | 
				
			||||||
 | 
					    body: JSON.stringify({ chartype: charType }) // Data sent to server
 | 
				
			||||||
 | 
					  })
 | 
				
			||||||
 | 
					  .then(response => response.json()) // Gets the response and returns it as JSON
 | 
				
			||||||
 | 
					  .then(data => { // When promise is resolved
 | 
				
			||||||
 | 
					
 | 
				
			||||||
 | 
					    var resultSection = document.getElementById('resultSection');
 | 
				
			||||||
 | 
					    resultSection.innerHTML = '';
 | 
				
			||||||
 | 
					
 | 
				
			||||||
 | 
					    // Display animal-stock if it exists
 | 
				
			||||||
 | 
					    if(data['animal-stock']){
 | 
				
			||||||
 | 
					      resultSection.innerHTML += `<strong>Animal Stock:</strong><br/>`;
 | 
				
			||||||
 | 
					      var animalStock = data['animal-stock'];
 | 
				
			||||||
 | 
					      for(var prop in animalStock){
 | 
				
			||||||
 | 
					        resultSection.innerHTML += ` - ${prop}: ${animalStock[prop]}<br/>`;
 | 
				
			||||||
 | 
					      }
 | 
				
			||||||
 | 
					      resultSection.innerHTML += "<br/>";
 | 
				
			||||||
 | 
					    }
 | 
				
			||||||
 | 
					
 | 
				
			||||||
 | 
					    // Printing abilities
 | 
				
			||||||
 | 
					    resultSection.innerHTML += "<strong>Abilities:</strong><br/>";
 | 
				
			||||||
 | 
					    var abilities = data.abilities;
 | 
				
			||||||
 | 
					    for(var ability in abilities) {
 | 
				
			||||||
 | 
					      resultSection.innerHTML += ` - ${ability}: ${abilities[ability]}<br/>`;
 | 
				
			||||||
 | 
					    }
 | 
				
			||||||
 | 
					    resultSection.innerHTML += "<br/>";
 | 
				
			||||||
 | 
					
 | 
				
			||||||
 | 
					    // Display hp, gold, domars
 | 
				
			||||||
 | 
					    resultSection.innerHTML += `<strong>hp:</strong> ${data.hp}<br/>`;
 | 
				
			||||||
 | 
					    resultSection.innerHTML += `<strong>gold:</strong> ${data.gold}<br/>`;
 | 
				
			||||||
 | 
					    resultSection.innerHTML += `<strong>domars:</strong> ${data.domar}<br/>`;
 | 
				
			||||||
 | 
					    resultSection.innerHTML += "<br/>";
 | 
				
			||||||
 | 
					
 | 
				
			||||||
 | 
					    // Display mutations if they exist
 | 
				
			||||||
 | 
					    if(data.mutations){
 | 
				
			||||||
 | 
					      resultSection.innerHTML += `<strong>Mutations:</strong><br/>`;
 | 
				
			||||||
 | 
					      var mutations = data.mutations;
 | 
				
			||||||
 | 
					      resultSection.innerHTML += ` - Mental (${mutations.count.mental}): ${mutations.mental.join(', ')}<br/>`;
 | 
				
			||||||
 | 
					      resultSection.innerHTML += ` - Physical (${mutations.count.physical}): ${mutations.physical.join(', ')}<br/>`;
 | 
				
			||||||
 | 
					    }
 | 
				
			||||||
 | 
					
 | 
				
			||||||
 | 
					    // Display cybermods if they exist
 | 
				
			||||||
 | 
					    if(data.cybermods){
 | 
				
			||||||
 | 
					      resultSection.innerHTML += `<strong>Cybermods:</strong><br/>`;
 | 
				
			||||||
 | 
					      var cybermods = data.cybermods;
 | 
				
			||||||
 | 
					      if (data.cybermods.mental) {
 | 
				
			||||||
 | 
					        resultSection.innerHTML += ` - Mental (${cybermods.count.mental}): ${cybermods.mental.join(', ')}<br/>`;
 | 
				
			||||||
 | 
					      }
 | 
				
			||||||
 | 
					      if (data.cybermods.physical) {
 | 
				
			||||||
 | 
					        resultSection.innerHTML += ` - Physical (${cybermods.count.physical}): ${cybermods.physical.join(', ')}<br/>`;
 | 
				
			||||||
 | 
					      }
 | 
				
			||||||
 | 
					    }
 | 
				
			||||||
 | 
					
 | 
				
			||||||
 | 
					  })
 | 
				
			||||||
 | 
					      .catch(error => console.error('Error:', error));
 | 
				
			||||||
 | 
					});
 | 
				
			||||||
		Loading…
	
		Reference in New Issue
	
	Block a user