updated so balls are coloured to their respective game. need to thing about set for life.

This commit is contained in:
2025-03-28 14:52:50 +00:00
parent cabc283673
commit 75d8d1700e
3 changed files with 113 additions and 65 deletions

View File

@@ -3,6 +3,7 @@ package helpers
import (
"html/template"
"net/http"
"strings"
"synlotto-website/models"
"github.com/gorilla/csrf"
@@ -31,7 +32,9 @@ func TemplateFuncs() template.FuncMap {
}
return *p
},
"inSlice": InSlice,
"inSlice": InSlice,
"lower": lower,
"rangeClass": rangeClass,
}
}
@@ -72,3 +75,24 @@ func InSlice(n int, list []int) bool {
return true
}
func lower(input string) string {
return strings.ToLower(input)
}
func rangeClass(n int) string {
switch {
case n >= 1 && n <= 9:
return "01-09"
case n >= 10 && n <= 19:
return "10-19"
case n >= 20 && n <= 29:
return "20-29"
case n >= 30 && n <= 39:
return "30-39"
case n >= 40 && n <= 49:
return "40-49"
default:
return "50-plus"
}
}

View File

@@ -19,12 +19,6 @@
gap: 0.5rem;
}
.matched {
background-color: #22c55e;
color: white;
font-weight: bold;
}
.bonus {
border: 2px solid #facc15;
}
@@ -36,52 +30,79 @@
animation: pulse 1s infinite;
}
.prize-badge {
/* .prize-badge {
background-color: #9333ea;
color: white;
border-radius: 9999px;
padding: 0.25rem 0.5rem;
font-size: 0.75rem;
box-shadow: 0 0 6px rgba(0,0,0,0.2);
}
} */
.ball.bonus {
background-color: #d8b4fe;
background-color: red;
}
.ball.matched {
background-color: #4ade80 !important;
animation: pulse 1s ease-in-out infinite;
color: white !important;
border: 2px solid red !important;
}
.ball.game-thunderball {
background-color: #1e3a8a; /* Dark blue */
color: white;
.ball.game-lotto.lotto-range-01-09 {
background-color: white;
border: .1px solid #000000;
color: black;
}
.ball.game-lotto.lotto-range-10-19 {
background-color: #add8e6;
color: black;
}
.ball.game-lotto.lotto-range-20-29 {
background-color: #ffc0cb;
color: black;
}
.ball.game-lotto.lotto-range-30-39 {
background-color: #90ee90;
color: black;
}
.ball.game-lotto.lotto-range-40-49 {
background-color: #ffff99;
color: black;
}
.ball.game-lotto.lotto-range-50-plus {
background-color: #B40AE3;
color: black;
}
.ball[class*="game-thunderball"]:not(.bonus) {
background-color: #6B65FC;
border: 2px solid white;
}
.ball[class*="game-thunderball"] {
background-color: #d8b4fe ;
border: 2px solid white;
}
.ball[class*="game-euromillions"]:not(.bonus) {
background-color: #BF1314;
border: 2px solid white;
}
.ball[class*="game-euromillions"] {
background-color: #FFDE59 ;
border: 2px solid white;
border-radius: 12px; /* Remove side rounding */
}
/* Lotto main balls Orange */
.ball.game-lotto {
background-color: #f97316; /* Bright orange */
color: white;
border: none;
border-radius: 12px;
}
/* Optional: Euromillions, Set For Life define as needed */
.ball.game-euromillions {
background-color: #2563eb; /* Royal blue */
color: white;
border-radius: 50%;
}
.ball.game-setforlife {
background-color: #6b7280; /* Slate gray */
color: white;
border-radius: 50%;
/* .ball[class*="game-setforlife"]:not(.bonus) {
background-color: #6B65FC;
border: 2px solid white;
} */
.ball[class*="game-setforlife"] {
background-color: #98F5F9 ;
border: 2px solid white;
}
@keyframes pulse {
0% { transform: scale(1); }

View File

@@ -19,46 +19,49 @@
</thead>
<tbody>
{{ range .Tickets }}
{{ $ticket := . }}
<tr>
<td>{{ .GameType }}</td>
<td>{{ .DrawDate }}</td>
<td>{{ $ticket.GameType }}</td>
<td>{{ $ticket.DrawDate }}</td>
<td>
<div class="flex flex-wrap gap-1">
{{ range $i, $ball := .Balls }}
<div class="ball {{ if inSlice $ball $.MatchedDraw.Balls }}matched pulse{{ end }}">{{ $ball }}</div>
{{ end }}
{{ range $i, $ball := $ticket.Balls }}
<div class="ball game-{{lower $ticket.GameType}} {{ if eq $ticket.GameType "Lotto" }}lotto-range-{{rangeClass $ball}} {{ end }}{{ if inSlice $ball $ticket.MatchedDraw.Balls }}matched pulse{{ end }}">
{{ $ball }}
</div>
{{ end }}
</div>
{{ if or (gt .MatchedMain 0) (gt .MatchedBonus 0) }}
{{ if or (gt $ticket.MatchedMain 0) (gt $ticket.MatchedBonus 0) }}
<div class="text-xs text-gray-500 mt-1">
{{ .MatchedMain }} match{{ if ne .MatchedMain 1 }}es{{ end }}
{{ if gt .MatchedBonus 0 }}, {{ .MatchedBonus }} bonus{{ end }}
{{ $ticket.MatchedMain }} match{{ if ne $ticket.MatchedMain 1 }}es{{ end }}
{{ if gt $ticket.MatchedBonus 0 }}, {{ $ticket.MatchedBonus }} bonus{{ end }}
</div>
{{ end }}
</td>
<td>
{{ if eq .GameType "Lotto" }}
<span style="color: lightgray; font-style: italic;"></span>
{{ else if gt (intVal .Bonus2) 0 }}
<div class="flex flex-wrap gap-1">
{{ if gt (intVal .Bonus1) 0 }}
{{ $b1 := intVal .Bonus1 }}
<div class="ball bonus {{ if inSlice $b1 $.MatchedDraw.BonusBalls }}matched-bonus{{ end }}">
{{ $b1 }}
</div>
{{ end }}
{{ $b2 := intVal .Bonus2 }}
<div class="ball bonus {{ if inSlice $b2 $.MatchedDraw.BonusBalls }}matched-bonus{{ end }}">
{{ $b2 }}
{{ if eq $ticket.GameType "Lotto" }}
<span style="color: lightgray; font-style: italic;"></span>
{{ else if gt (intVal $ticket.Bonus2) 0 }}
<div class="flex flex-wrap gap-1">
{{ if gt (intVal $ticket.Bonus1) 0 }}
{{ $b1 := intVal $ticket.Bonus1 }}
<div class="ball game-{{lower $ticket.GameType}} bonus{{ if inSlice $b1 $ticket.MatchedDraw.BonusBalls }} matched-bonus{{ end }}">
{{ $b1 }}
</div>
{{ end }}
{{ $b2 := intVal $ticket.Bonus2 }}
<div class="ball game-{{lower $ticket.GameType}} bonus{{ if inSlice $b2 $ticket.MatchedDraw.BonusBalls }} matched-bonus{{ end }}">
{{ $b2 }}
</div>
{{ else if gt (intVal .Bonus1) 0 }}
{{ $b := intVal .Bonus1 }}
<div class="ball bonus {{ if inSlice $b $.MatchedDraw.BonusBalls }}matched-bonus{{ end }}">
{{ $b }}
</div>
{{ else }}
<span style="color: lightgray;"></span>
{{ end }}
</div>
{{ else if gt (intVal $ticket.Bonus1) 0 }}
{{ $b := intVal $ticket.Bonus1 }}
<div class="ball game-{{lower $ticket.GameType}} bonus{{ if inSlice $b $ticket.MatchedDraw.BonusBalls }} matched-bonus{{ end }}">
{{ $b }}
</div>
{{ else }}
<span style="color: lightgray;"></span>
{{ end }}
</td>
<td>{{ .PurchaseDate }}</td>
<td>{{ .PurchaseMethod }}</td>