diff --git a/public/name_form.html b/public/name_form.html
new file mode 100644
index 00000000..d3e44290
--- /dev/null
+++ b/public/name_form.html
@@ -0,0 +1,28 @@
+
+
+
+
+
+
+
+ Framadate
+
+
+
+
+
+
+
+
+
+
+
+
+
+
diff --git a/public/parametres.html b/public/parametres.html
index 1a32a7e7..9a3996dc 100644
--- a/public/parametres.html
+++ b/public/parametres.html
@@ -19,17 +19,17 @@
diff --git a/public/script.js b/public/script.js
index 32f88226..022ce157 100644
--- a/public/script.js
+++ b/public/script.js
@@ -1,3 +1,8 @@
+'use strict'
+
+const $ = selector => document.querySelector(selector)
+const $$ = selector => document.querySelectorAll(selector)
+
const debugStorage = () => {
for(var i = 0; i < localStorage.length; i++) {
let key = localStorage.key(i)
@@ -5,7 +10,30 @@ const debugStorage = () => {
}
}
-document.querySelectorAll('input').forEach((inputElement) => {
+var nameFieldLink = $("#name").addEventListener("click", (e) => {
+ e.preventDefault();
+ console.log("click sur le name");
+ createModal("truc");
+});
+
+const removeOverlay = () => {
+ $('body').removeChild($('.overlay'))
+}
+
+const createModal = (text) => {
+ const overlay = document.createElement('div')
+ const popin = document.createElement('div')
+
+ popin.innerHTML = text
+ popin.className = 'modal'
+ overlay.className = 'overlay'
+ overlay.appendChild(popin)
+ overlay.addEventListener('click', removeOverlay)
+ $('body').insertBefore(overlay, $('main'))
+}
+
+
+$$('input').forEach((inputElement) => {
inputElement.addEventListener("change", () => {
localStorage[inputElement.name] = inputElement.value
});
@@ -16,10 +44,10 @@ if(document.getElementById("type_sondage")) {
let typeSondage = this.options[this.selectedIndex].text;
if(typeSondage == "classique") {
localStorage.setItem('type_sondage', this.options[this.selectedIndex].text);
- document.querySelector('#next').href = "reponses.html";
+ $('#next').href = "reponses.html";
} else {
localStorage.setItem('type_sondage', 'dates');
- document.querySelector('#next').href = "dates.html";
+ $('#next').href = "dates.html";
}
debugStorage()
})
diff --git a/public/style.css b/public/style.css
index c877e63a..ae14a052 100644
--- a/public/style.css
+++ b/public/style.css
@@ -43,3 +43,25 @@ input[type="text"], input[type="email"] {
line-height:60%;
}
+.toggle-field {
+ color: blue;
+ cursor: pointer;
+ text-decoration: underline;
+}
+
+.overlay {
+ background: rgba(1, 1, 1, .3);
+ height: 100%;
+ top: 0;
+ left: 0;
+ position: absolute;
+ width: 100%;
+ z-index: 5;
+}
+.modal {
+ background: #fff;
+ top: 10%;
+ left: 40%;
+ padding: 10px;
+ position: absolute;
+}