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 ( import (
"html/template" "html/template"
"net/http" "net/http"
"strings"
"synlotto-website/models" "synlotto-website/models"
"github.com/gorilla/csrf" "github.com/gorilla/csrf"
@@ -32,6 +33,8 @@ func TemplateFuncs() template.FuncMap {
return *p return *p
}, },
"inSlice": InSlice, "inSlice": InSlice,
"lower": lower,
"rangeClass": rangeClass,
} }
} }
@@ -72,3 +75,24 @@ func InSlice(n int, list []int) bool {
return true 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; gap: 0.5rem;
} }
.matched {
background-color: #22c55e;
color: white;
font-weight: bold;
}
.bonus { .bonus {
border: 2px solid #facc15; border: 2px solid #facc15;
} }
@@ -36,52 +30,79 @@
animation: pulse 1s infinite; animation: pulse 1s infinite;
} }
.prize-badge { /* .prize-badge {
background-color: #9333ea; background-color: #9333ea;
color: white; color: white;
border-radius: 9999px; border-radius: 9999px;
padding: 0.25rem 0.5rem; padding: 0.25rem 0.5rem;
font-size: 0.75rem; font-size: 0.75rem;
box-shadow: 0 0 6px rgba(0,0,0,0.2); box-shadow: 0 0 6px rgba(0,0,0,0.2);
} } */
.ball.bonus { .ball.bonus {
background-color: #d8b4fe; background-color: red;
} }
.ball.matched { .ball.matched {
background-color: #4ade80 !important;
animation: pulse 1s ease-in-out infinite; animation: pulse 1s ease-in-out infinite;
color: white !important;
border: 2px solid red !important;
} }
.ball.game-thunderball { .ball.game-lotto.lotto-range-01-09 {
background-color: #1e3a8a; /* Dark blue */ background-color: white;
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; border: 2px solid white;
border-radius: 12px; /* Remove side rounding */
} }
/* Lotto main balls Orange */ .ball[class*="game-thunderball"] {
.ball.game-lotto { background-color: #d8b4fe ;
background-color: #f97316; /* Bright orange */ border: 2px solid white;
color: white;
border: none;
border-radius: 12px;
} }
/* Optional: Euromillions, Set For Life define as needed */ .ball[class*="game-euromillions"]:not(.bonus) {
.ball.game-euromillions { background-color: #BF1314;
background-color: #2563eb; /* Royal blue */ border: 2px solid white;
color: white;
border-radius: 50%;
} }
.ball.game-setforlife { .ball[class*="game-euromillions"] {
background-color: #6b7280; /* Slate gray */ background-color: #FFDE59 ;
color: white; border: 2px solid 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 { @keyframes pulse {
0% { transform: scale(1); } 0% { transform: scale(1); }

View File

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