Add seasons’ relation, functions, and admin section
Seasons have a color to show on the calendar. I need them in HTML format
(e.g., #123abc) in order to set as value to `<input type="color">`, but
i did not want to save them as text in the database, as integers are
better representations of colors—in fact, that’s what the HTML syntax
also is: an integer.
I think the best would be to create an extension that adds an HTML color
type, with functions to convert from many representations (e.g., CSS’
rgb or even color names) to integer and back. However, that’s a lot of
work and i can satisfy Camper’s needs with just a couple of functions
and a domain.
To show the color on the index, at first tried to use a read-only
`<input type="color">`, but seems that this type of input can not be
read-only and must be disabled instead. However, i do not know whether
it makes sense to have a disabled input outside a form “just” to show
a color; i suspect it does not. Thus, at the end i use SVG with a
single circle, which is better that a 50%-rounded div with a background
color, even if the result is the same—SVG **is** intended for showing
pictures, which is this case.
2023-08-16 18:15:57 +00:00
|
|
|
<!--
|
|
|
|
|
SPDX-FileCopyrightText: 2023 jordi fita mas <jordi@tandem.blog>
|
|
|
|
|
SPDX-License-Identifier: AGPL-3.0-only
|
|
|
|
|
-->
|
|
|
|
|
{{ define "title" -}}
|
|
|
|
|
{{( pgettext "Seasons" "title" )}}
|
|
|
|
|
{{- end }}
|
|
|
|
|
|
|
|
|
|
{{ define "content" -}}
|
|
|
|
|
{{- /*gotype: dev.tandem.ws/tandem/camper/pkg/season.seasonIndex*/ -}}
|
|
|
|
|
<a href="/admin/seasons/new">{{( pgettext "Add Season" "action" )}}</a>
|
|
|
|
|
<h2>{{( pgettext "Seasons" "title" )}}</h2>
|
|
|
|
|
{{ if .Seasons -}}
|
|
|
|
|
<table>
|
|
|
|
|
<thead>
|
|
|
|
|
<tr>
|
|
|
|
|
<th scope="col">{{( pgettext "Color" "header" )}}</th>
|
2023-09-28 00:23:25 +00:00
|
|
|
<th scope="col">{{( pgettext "Name" "header" )}}</th>
|
2023-10-03 19:14:37 +00:00
|
|
|
<th scope="col">{{( pgettext "Translations" "campsite type" )}}</th>
|
Add seasons’ relation, functions, and admin section
Seasons have a color to show on the calendar. I need them in HTML format
(e.g., #123abc) in order to set as value to `<input type="color">`, but
i did not want to save them as text in the database, as integers are
better representations of colors—in fact, that’s what the HTML syntax
also is: an integer.
I think the best would be to create an extension that adds an HTML color
type, with functions to convert from many representations (e.g., CSS’
rgb or even color names) to integer and back. However, that’s a lot of
work and i can satisfy Camper’s needs with just a couple of functions
and a domain.
To show the color on the index, at first tried to use a read-only
`<input type="color">`, but seems that this type of input can not be
read-only and must be disabled instead. However, i do not know whether
it makes sense to have a disabled input outside a form “just” to show
a color; i suspect it does not. Thus, at the end i use SVG with a
single circle, which is better that a 50%-rounded div with a background
color, even if the result is the same—SVG **is** intended for showing
pictures, which is this case.
2023-08-16 18:15:57 +00:00
|
|
|
<th scope="col">{{( pgettext "Active" "season" )}}</th>
|
|
|
|
|
</tr>
|
|
|
|
|
</thead>
|
|
|
|
|
<tbody>
|
|
|
|
|
{{ range .Seasons -}}
|
|
|
|
|
<tr>
|
|
|
|
|
<td>
|
|
|
|
|
<svg width="20px" height="20px">
|
2023-09-26 16:54:53 +00:00
|
|
|
<circle cx="50%" cy="50%" r="49%" fill="{{ .Color }}" stroke="#000" stroke-width=".5"/>
|
Add seasons’ relation, functions, and admin section
Seasons have a color to show on the calendar. I need them in HTML format
(e.g., #123abc) in order to set as value to `<input type="color">`, but
i did not want to save them as text in the database, as integers are
better representations of colors—in fact, that’s what the HTML syntax
also is: an integer.
I think the best would be to create an extension that adds an HTML color
type, with functions to convert from many representations (e.g., CSS’
rgb or even color names) to integer and back. However, that’s a lot of
work and i can satisfy Camper’s needs with just a couple of functions
and a domain.
To show the color on the index, at first tried to use a read-only
`<input type="color">`, but seems that this type of input can not be
read-only and must be disabled instead. However, i do not know whether
it makes sense to have a disabled input outside a form “just” to show
a color; i suspect it does not. Thus, at the end i use SVG with a
single circle, which is better that a 50%-rounded div with a background
color, even if the result is the same—SVG **is** intended for showing
pictures, which is this case.
2023-08-16 18:15:57 +00:00
|
|
|
</svg>
|
|
|
|
|
</td>
|
2023-10-03 19:14:37 +00:00
|
|
|
<td><a href="{{ .URL }}">{{ .Name }}</a></td>
|
|
|
|
|
<td>
|
|
|
|
|
{{ range .Translations }}
|
|
|
|
|
<a
|
|
|
|
|
{{ if .Missing }}class="missing-translation"{{ end }}
|
|
|
|
|
href="{{ .URL }}">{{ .Endonym }}</a>
|
|
|
|
|
{{ end }}
|
|
|
|
|
</td>
|
Add seasons’ relation, functions, and admin section
Seasons have a color to show on the calendar. I need them in HTML format
(e.g., #123abc) in order to set as value to `<input type="color">`, but
i did not want to save them as text in the database, as integers are
better representations of colors—in fact, that’s what the HTML syntax
also is: an integer.
I think the best would be to create an extension that adds an HTML color
type, with functions to convert from many representations (e.g., CSS’
rgb or even color names) to integer and back. However, that’s a lot of
work and i can satisfy Camper’s needs with just a couple of functions
and a domain.
To show the color on the index, at first tried to use a read-only
`<input type="color">`, but seems that this type of input can not be
read-only and must be disabled instead. However, i do not know whether
it makes sense to have a disabled input outside a form “just” to show
a color; i suspect it does not. Thus, at the end i use SVG with a
single circle, which is better that a 50%-rounded div with a background
color, even if the result is the same—SVG **is** intended for showing
pictures, which is this case.
2023-08-16 18:15:57 +00:00
|
|
|
<td>{{ if .Active }}{{( gettext "Yes" )}}{{ else }}{{( gettext "No" )}}{{ end }}</td>
|
|
|
|
|
</tr>
|
|
|
|
|
{{- end }}
|
|
|
|
|
</tbody>
|
|
|
|
|
</table>
|
|
|
|
|
{{ else -}}
|
|
|
|
|
<p>{{( gettext "No seasons added yet." )}}</p>
|
|
|
|
|
{{- end }}
|
2023-09-27 00:23:09 +00:00
|
|
|
|
|
|
|
|
<h2>{{( pgettext "Calendar" "title" )}}</h2>
|
2023-09-27 12:21:27 +00:00
|
|
|
{{ template "calendar.gohtml" .Calendar }}
|
Add seasons’ relation, functions, and admin section
Seasons have a color to show on the calendar. I need them in HTML format
(e.g., #123abc) in order to set as value to `<input type="color">`, but
i did not want to save them as text in the database, as integers are
better representations of colors—in fact, that’s what the HTML syntax
also is: an integer.
I think the best would be to create an extension that adds an HTML color
type, with functions to convert from many representations (e.g., CSS’
rgb or even color names) to integer and back. However, that’s a lot of
work and i can satisfy Camper’s needs with just a couple of functions
and a domain.
To show the color on the index, at first tried to use a read-only
`<input type="color">`, but seems that this type of input can not be
read-only and must be disabled instead. However, i do not know whether
it makes sense to have a disabled input outside a form “just” to show
a color; i suspect it does not. Thus, at the end i use SVG with a
single circle, which is better that a 50%-rounded div with a background
color, even if the result is the same—SVG **is** intended for showing
pictures, which is this case.
2023-08-16 18:15:57 +00:00
|
|
|
{{- end }}
|