summaryrefslogtreecommitdiff
path: root/index.tmpl.html
blob: 78bb347258abc1ceb199fadf551dbd2731e2ac54 (plain) (blame)
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
  <!DOCTYPE html>
  <html lang="fr">
   <head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">

    <meta property="og:title" content="Cadeaux de noël 2025"/>
    <meta property="og:description" content="À qui offrir le cadeau de noël?"/>

    <meta property="og:image" content="/static/favicon.ico" />

    <link rel="icon" type="image/x-icon" href="/static/favicon.ico">
    <link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/@picocss/pico@2/css/pico.min.css">
    <style>
h1 {
 display: flex;
 justify-content: center;
}
button {
 font-size: 1em;
 margin-left: 1em;
 margin-right: 1em;
}
#buttons {
 display: flex;
 justify-content: center;
 align-items: center;
}

body {
 display: flex;
 justify-content: center;
 align-items: center;
 height: 50vh;
}
    </style>
    <script>
let people =
[{{ range . }}
 {"name": "{{.Name}}", "other": {{.Other}}}, {{ end }}
];

function clickButton(button) {
 let name = button.innerText;
 let person = null;
 let person_index = 0;
 for(; person_index < people.length; person_index += 1)
 {
  if(people[person_index].name === name)
  {
   person = people[person_index];
   break;
  }
 }

 fetch('/person/', {
  method: 'POST',
  headers:
  {
   'Content-Type': 'application/x-www-form-urlencoded'
  },
  body: "name=" + person.name
 })
 .then(function(response) {
  response.text().
   then(function(text_response) {
    if(text_response === 'ok') {
     window.location.reload();
    }
   })
  })
 .catch(error => console.error('Error:', error));

 let other_person = people[person.other];
 document.body.innerHTML = "<h1>Tu as: " + other_person.name + "</h1>";
}

window.onload = function() {
 let buttons = document.querySelectorAll("button");

 for(let index = 0; index < buttons.length; index += 1)
 {
  let button = buttons[index];
  button.addEventListener("click", function(event) {
   event.preventDefault();
   clickButton(button);
  });
 }

};
    </script>

   </head>
   <body>
    <div>
     <h1>Qui es-tu?</h1>
     <div id="buttons">
     {{ range . }}
     <button>{{ .Name }}</button>
     {{ end }}
     </div>
    </div>
   </body>
  </html>