149 lines
6.3 KiB
HTML
149 lines
6.3 KiB
HTML
<!DOCTYPE html>
|
|
<html>
|
|
<head>
|
|
<title>Team and Event Selector</title>
|
|
<link href="https://cdn.jsdelivr.net/npm/bootstrap@5.3.2/dist/css/bootstrap.min.css" rel="stylesheet" integrity="sha384-T3c6CoIi6uLrA9TneNEoa7RxnatzjcDSCmG1MXxSR1GAsXEV/Dwwykc2MPK8M2HN" crossorigin="anonymous">
|
|
<script src="https://cdn.jsdelivr.net/npm/bootstrap@5.3.2/dist/js/bootstrap.bundle.min.js" integrity="sha384-C6RzsynM9kWDrMNeT87bh95OGNyZPhcTNXj1NW7RuBCsyN/o0jlpcV8Qyq46cDfL" crossorigin="anonymous"></script>
|
|
</head>
|
|
<body>
|
|
<h1>Team Information</h1>
|
|
<form id="matchForm" class="container">
|
|
<div class="mb-3 row">
|
|
<label for="teamName" class="col-sm-2 col-form-label">Home Team Name:</label>
|
|
<div class="col-sm-10">
|
|
<input class="form-control" type="text" id="homeTeamName" name="homeTeamName" required>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
<br>
|
|
<div class="mb-3 row">
|
|
<label for="homeTeamColor" class="col-sm-2 col-form-label">Home Team Colour:</label>
|
|
<div class="col-sm-10">
|
|
<input class="form-control form-control-color" type="color" id="homeTeamColor" name="homeTeamColor" required>
|
|
</div>
|
|
</div>
|
|
<br>
|
|
<div class="mb-3 row">
|
|
<label for="awayTeamName" class="col-sm-2 col-form-label">Away Team Name:</label>
|
|
<div class="col-sm-10">
|
|
<input class="form-control" type="text" id="awayTeamName" name="awayTeamName" required>
|
|
</div>
|
|
</div>
|
|
<br>
|
|
<div class="mb-3 row">
|
|
<label for="awayTeamColor" class="col-sm-2 col-form-label">Away Team Colour:</label>
|
|
<div class="col-sm-10">
|
|
<input class="form-control form-control-color" type="color" id="awayTeamColor" name="awayTeamColor" required>
|
|
</div>
|
|
</div>
|
|
<br>
|
|
<div class="mb-3 row">
|
|
<label for="kickOffTime" class="col-sm-2 col-form-label">Kick Off Time:</label>
|
|
<div class="col-sm-10">
|
|
<input class="form-control" type="datetime-local" id="kickOffTime" name="kickOffTime" required>
|
|
</div>
|
|
</div>
|
|
<br>
|
|
<div class="d-grid gap-2 d-md-flex justify-content-md-end">
|
|
<input type="submit" value="Create Match" class="btn btn-primary float-right">
|
|
</div>
|
|
</form>
|
|
|
|
<h1>Event Selector</h1>
|
|
<form id="eventForm">
|
|
<label for="eventType">Event Type:</label>
|
|
<select id="eventType" name="eventType" required>
|
|
<option value="" disabled selected>Select an Event</option>
|
|
<option value="Try">Try</option>
|
|
<option value="Penalty">Penalty</option>
|
|
<option value="Conversion">Conversion</option>
|
|
<option value="DropGoal">Drop Goal</option>
|
|
<option value="SecondHalfStart">Second Half Start</option>
|
|
</select>
|
|
<br>
|
|
<label for="team">Team:</label>
|
|
<select id="team" name="team">
|
|
<option value="">Select a Team (optional)</option>
|
|
<option value="Home">Uckfield</option>
|
|
<option value="Away">Away</option>
|
|
</select>
|
|
<br>
|
|
<input type="submit" value="Submit Event">
|
|
</form>
|
|
|
|
<script>
|
|
// Replace 'YOUR_API_URL' and 'YOUR_API_KEY' with your actual API URL and API key
|
|
const apiKey = '396A62D6-0192-4738-8F45-8AAF7BCFA3EC'; // Replace with your actual API key
|
|
|
|
document.getElementById("matchForm").addEventListener("submit", function (event) {
|
|
event.preventDefault();
|
|
const homeTeamName = document.getElementById("homeTeamName").value;
|
|
const homeTeamColor = document.getElementById("homeTeamColor").value;
|
|
const awayTeamName = document.getElementById("awayTeamName").value;
|
|
const awayTeamColor = document.getElementById("awayTeamColor").value;
|
|
const koTime = document.getElementById("kickOffTime").value;
|
|
const apiUrl = 'https://localhost:7005/api/Score'; // Replace with your API endpoint URL
|
|
|
|
const matchData = {
|
|
home: {
|
|
name: homeTeamName,
|
|
colour: homeTeamColor,
|
|
abbreviation: homeTeamName.slice(0,3)
|
|
},
|
|
away:{
|
|
name: awayTeamName,
|
|
colour: awayTeamColor,
|
|
abbreviation: awayTeamName.slice(0,3)
|
|
},
|
|
kickOffTime: koTime
|
|
};
|
|
|
|
fetch(apiUrl, {
|
|
method: 'POST',
|
|
headers: {
|
|
'Content-Type': 'application/json',
|
|
'x-api-key': apiKey,
|
|
},
|
|
body: JSON.stringify(matchData),
|
|
})
|
|
.then(response => response.json())
|
|
.then(data => {
|
|
console.log('Match data sent successfully:', data);
|
|
})
|
|
.catch(error => {
|
|
console.error('Error sending team data:', error);
|
|
});
|
|
});
|
|
|
|
document.getElementById("eventForm").addEventListener("submit", function (event) {
|
|
event.preventDefault();
|
|
const apiUrl = 'https://localhost:7005/api/Score/event'; // Replace with your API endpoint URL
|
|
|
|
const eventType = document.getElementById("eventType").value;
|
|
const selectedTeam = document.getElementById("team").value;
|
|
|
|
const eventData = {
|
|
eventType: eventType,
|
|
timeStamp: new Date().toISOString()
|
|
};
|
|
|
|
fetch(`${apiUrl}/${selectedTeam}`, {
|
|
method: 'PATCH',
|
|
headers: {
|
|
'Content-Type': 'application/json',
|
|
'x-api-key': apiKey,
|
|
},
|
|
body: JSON.stringify(eventData),
|
|
})
|
|
.then(response => response.json())
|
|
.then(data => {
|
|
console.log('Event data sent successfully:', data);
|
|
})
|
|
.catch(error => {
|
|
console.error('Error sending event data:', error);
|
|
});
|
|
});
|
|
</script>
|
|
</body>
|
|
</html>
|