package templates

import (
	"strconv"
	"track-gopher/db"
	"track-gopher/derby"
)

templ Heats(groups []db.Group, racers []db.Racer, selectedGroupID int64) {
	@Layout("Race Heats") {
		<div class="container mx-auto px-4 py-8">
			<h1 class="text-3xl font-bold mb-6">Race Heats Generator</h1>
			
			<div class="mb-6">
				<label for="group-select" class="block text-sm font-medium text-gray-700 mb-2">Select Group</label>
				<select 
					id="group-select" 
					class="block w-full px-3 py-2 border border-gray-300 rounded-md shadow-sm focus:outline-none focus:ring-indigo-500 focus:border-indigo-500"
					hx-get="/heats"
					hx-target="#heats-container"
					hx-trigger="change"
					hx-include="this"
					name="group_id"
				>
					<option value="">Select a group</option>
					for _, group := range groups {
						<option value={ strconv.FormatInt(group.ID, 10) } selected?={ group.ID == selectedGroupID }>
							{ group.Name }
						</option>
					}
				</select>
			</div>
			
			<div id="heats-container">
				if selectedGroupID > 0 {
					@HeatsContent(selectedGroupID, groups, racers)
				} else {
					<div class="bg-gray-100 p-6 rounded-lg">
						<p class="text-gray-600">Please select a group to generate heats.</p>
					</div>
				}
			</div>
		</div>
	}
}

templ HeatsContent(groupID int64, groups []db.Group, allRacers []db.Racer) {
	// Filter racers by group
	var groupRacers []db.Racer
	for _, racer := range allRacers {
		if racer.GroupID == groupID {
			groupRacers = append(groupRacers, racer)
		}
	}
	
	<div class="bg-white shadow-md rounded-lg p-6">
		<div class="flex justify-between items-center mb-6">
			<h2 class="text-xl font-semibold">
				Heats for { getGroupName(groups, groupID) } ({ strconv.Itoa(len(groupRacers)) } racers)
			</h2>
			<div>
				<button 
					class="bg-indigo-600 text-white px-4 py-2 rounded-md hover:bg-indigo-700 mr-2"
					hx-post={ "/api/heats/generate?group_id=" + strconv.FormatInt(groupID, 10) }
					hx-target="#heats-list"
					hx-swap="innerHTML"
				>
					Regenerate Heats
				</button>
				<button 
					class="bg-green-600 text-white px-4 py-2 rounded-md hover:bg-green-700"
					hx-post={ "/api/heats/save?group_id=" + strconv.FormatInt(groupID, 10) }
					hx-target="#save-status"
				>
					Save Heats
				</button>
			</div>
		</div>
		
		<div id="save-status" class="mb-4"></div>
		
		if len(groupRacers) == 0 {
			<div class="bg-yellow-100 p-4 rounded-lg mb-6">
				<p class="text-yellow-800">No racers in this group. Add racers to generate heats.</p>
			</div>
		} else {
			<div id="heats-list" class="space-y-6">
				@GeneratedHeats(groupRacers)
			</div>
		}
	</div>
}

templ GeneratedHeats(racers []db.Racer) {
	// Convert db.Racer to derby.Racer for heat generation
	var derbyRacers []derby.Racer
	for _, racer := range racers {
		derbyRacers = append(derbyRacers, derby.CreateRacer(racer.ID, racer.FirstName, racer.LastName, racer.CarNumber))
	}
	
	var heats = derby.GenerateHeats(derbyRacers)
	
	if len(heats) == 0 {
		<div class="bg-yellow-100 p-4 rounded-lg">
			<p class="text-yellow-800">No heats could be generated. Please add more racers.</p>
		</div>
	} else {
		<div class="grid grid-cols-1 md:grid-cols-2 lg:grid-cols-3 gap-6">
			for _, heat := range heats {
				<div class="bg-gray-50 p-4 rounded-lg shadow">
					<h3 class="text-lg font-semibold mb-3">Heat { strconv.Itoa(heat.HeatNum) }</h3>
					<table class="w-full">
						<thead>
							<tr class="bg-gray-200">
								<th class="px-2 py-1 text-left">Lane</th>
								<th class="px-2 py-1 text-left">Racer</th>
								<th class="px-2 py-1 text-left">Car #</th>
							</tr>
						</thead>
						<tbody>
							<tr>
								<td class="px-2 py-1">1</td>
								<td class="px-2 py-1">{ getRacerName(racers, heat.Lane1ID) }</td>
								<td class="px-2 py-1">{ getRacerCarNumber(racers, heat.Lane1ID) }</td>
							</tr>
							<tr>
								<td class="px-2 py-1">2</td>
								<td class="px-2 py-1">{ getRacerName(racers, heat.Lane2ID) }</td>
								<td class="px-2 py-1">{ getRacerCarNumber(racers, heat.Lane2ID) }</td>
							</tr>
							<tr>
								<td class="px-2 py-1">3</td>
								<td class="px-2 py-1">{ getRacerName(racers, heat.Lane3ID) }</td>
								<td class="px-2 py-1">{ getRacerCarNumber(racers, heat.Lane3ID) }</td>
							</tr>
							<tr>
								<td class="px-2 py-1">4</td>
								<td class="px-2 py-1">{ getRacerName(racers, heat.Lane4ID) }</td>
								<td class="px-2 py-1">{ getRacerCarNumber(racers, heat.Lane4ID) }</td>
							</tr>
						</tbody>
					</table>
				</div>
			}
		</div>
	}
}

func getGroupName(groups []db.Group, groupID int64) string {
	for _, group := range groups {
		if group.ID == groupID {
			return group.Name
		}
	}
	return "Unknown Group"
}

func getRacerName(racers []db.Racer, racerID *int64) string {
	if racerID == nil {
		return "Empty"
	}
	
	for _, racer := range racers {
		if racer.ID == *racerID {
			return racer.FirstName + " " + racer.LastName
		}
	}
	return "Unknown Racer"
}

func getRacerCarNumber(racers []db.Racer, racerID *int64) string {
	if racerID == nil {
		return "-"
	}
	
	for _, racer := range racers {
		if racer.ID == *racerID {
			return racer.CarNumber
		}
	}
	return "-"
}