collin/collinenlucy.nl
1
0
Fork 0
Code Issues Pull requests Projects Releases Packages Wiki Activity Actions

Changing how the RSVP button is displayed and how setting the cookie works

Browse source
This commit is contained in:
collin 2025-08-27 17:46:36 +02:00
parent a535d65b52
commit 0e04c0a235
No known key found for this signature in database
6 changed files with 29 additions and 28 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

17
client/index.html
View file

@ -6,6 +6,13 @@
<body> <body>
<h1 class="title fontXL textCenter backgroundLightGreen colorWhite">Collin and Lucy's Wedding</h1> <h1 class="title fontXL textCenter backgroundLightGreen colorWhite">Collin and Lucy's Wedding</h1>
<div class="contents fontM"> <div class="contents fontM">
<a class="rsvpButton backgroundLightGreen hidden" href="/rsvp">
<div class="textCenter">
<p class="colorBlack">
RSVP
</p>
</div>
</a>
<div> <div>
<h2 class="textLeft fontL colorLightGreen">When?</h2> <h2 class="textLeft fontL colorLightGreen">When?</h2>
<p>Saturday 16th of May 2026</p> <p>Saturday 16th of May 2026</p>
@ -35,16 +42,6 @@
<a href="https://www.openstreetmap.org/node/2869212621"><h5 class="fontS">Open Map</h5></a> <a href="https://www.openstreetmap.org/node/2869212621"><h5 class="fontS">Open Map</h5></a>
</div> </div>
</div> </div>
<a href="/rsvp">
<div class="rsvpButton textCenter backgroundLightGreen hidden">
<p class="colorBlack">
R <br/>
S <br/>
V <br/>
P <br/>
</p>
</div>
</a>
<script src="/index.js"></script> <script src="/index.js"></script>
</body> </body>
</html> </html>

10
client/index.js
View file

@ -8,20 +8,10 @@ function hasRsvped() {
return cookies[COOKIE_NAME] === "true"; return cookies[COOKIE_NAME] === "true";
} }
function persistRsvp(hasRsvped = true) {
document.cookie = `${COOKIE_NAME}=${String(hasRsvped)}; path=/`;
console.log(document.cookie);
}
function rsvpButtonClicked() {
persistRsvp(true);
}
window.onload = function () { window.onload = function () {
if (!hasRsvped()) { if (!hasRsvped()) {
const rsvpButton = document.querySelector(".rsvpButton"); const rsvpButton = document.querySelector(".rsvpButton");
rsvpButton.classList.remove("hidden"); rsvpButton.classList.remove("hidden");
rsvpButton.onclick = rsvpButtonClicked;
} }
}; };

1
client/rsvp_confirmed.html
View file

@ -10,5 +10,6 @@
<br/> <br/>
<a href="/">Back</a> <a href="/">Back</a>
</div> </div>
<script src="/rsvp_confirmed.js"></script>
</body> </body>
</html> </html>

11
client/rsvp_confirmed.js Normal file
View file

@ -0,0 +1,11 @@
const COOKIE_NAME = "hasRsvped";
function persistRsvp(hasRsvped = true) {
document.cookie = `${COOKIE_NAME}=${String(hasRsvped)}; path=/`;
}
function rsvpConfirmed() {
persistRsvp(true);
}
rsvpConfirmed();

15
client/style.css
View file

@ -138,7 +138,7 @@ button {
/* #region contents */ /* #region contents */
.contents { .contents {
height: auto; height: auto;
padding: 50px; padding: 32px;
} }
@media (max-width: 539px) { @media (max-width: 539px) {
@ -188,14 +188,13 @@ button {
/* #region rsvp */ /* #region rsvp */
.rsvpButton { .rsvpButton {
position: fixed; display:inline-block;
height: 100px; width: 80%;
width: 18px; margin-left: 10%;
top: 25px; margin-right: 10%;
right: 0px; text-decoration: none;
padding: 16px; padding: 16px;
border-radius: 16px 0px 0px 16px; border-radius: 16px 16px;
mix-blend-mode: color-dodge;
cursor: pointer; cursor: pointer;
} }

3
controller.go
View file

@ -176,6 +176,9 @@ func (h *Handler) ServeHTTP(w http.ResponseWriter, r *http.Request) {
case r.Method == "GET" && r.URL.Path == "/rsvp.js": case r.Method == "GET" && r.URL.Path == "/rsvp.js":
getStaticFile("./client/rsvp.js", "text/javascript", w) getStaticFile("./client/rsvp.js", "text/javascript", w)
case r.Method == "GET" && r.URL.Path == "/rsvp_confirmed.js":
getStaticFile("./client/rsvp_confirmed.js", "text/javascript", w)
case r.Method == "GET" && r.URL.Path == "/rsvps_list.js": case r.Method == "GET" && r.URL.Path == "/rsvps_list.js":
getStaticFile("./client/rsvps_list.js", "text/javascript", w) getStaticFile("./client/rsvps_list.js", "text/javascript", w)