diff --git a/WIM4.1/tp/tp2/ex1/favoris.html b/WIM4.1/tp/tp2/ex1/favoris.html new file mode 100644 index 0000000..e35571e --- /dev/null +++ b/WIM4.1/tp/tp2/ex1/favoris.html @@ -0,0 +1,13 @@ + + + + + + + + + + +

Favoris

+ + diff --git a/WIM4.1/tp/tp2/ex1/js/favoris.js b/WIM4.1/tp/tp2/ex1/js/favoris.js new file mode 100644 index 0000000..57d07ce --- /dev/null +++ b/WIM4.1/tp/tp2/ex1/js/favoris.js @@ -0,0 +1,34 @@ +let favoris = [ + { + nom:"Google" , + url:"www.google.fr", + img:"https://upload.wikimedia.org/wikipedia/commons/thumb/2/2f/Google_2015_logo.svg/200px-Google_2015_logo.svg.png" + }, + { + nom:"Le Monde", + url:"lemonde.fr", + img:"https://upload.wikimedia.org/wikipedia/commons/thumb/2/22/Lemonde_fr_2005_logo.svg/200px-Lemonde_fr_2005_logo.svg.png?uselang=fr" + + }, + { + nom:"L'Equipe", + url:"www.lequipe.fr", + img:"https://upload.wikimedia.org/wikipedia/commons/thumb/3/32/L%27%C3%89quipe_wordmark.svg/200px-L%27%C3%89quipe_wordmark.svg.png" + } +] + +window.addEventListener("load",()=>{ +// TODO + let body = document.body + let ul = document.createElement("ul") + for (f of favoris){ + let li = document.createElement("li") + let a = document.createElement("a") + a.href = "http://" + f.url + let txt = document.createTextNode(f.nom) + a.appendChild(txt) + li.appendChild(a) + ul.appendChild(li) + } + body.appendChild(ul) +}) diff --git a/WIM4.1/tp/tp2/ex2/contacts.html b/WIM4.1/tp/tp2/ex2/contacts.html new file mode 100644 index 0000000..a809391 --- /dev/null +++ b/WIM4.1/tp/tp2/ex2/contacts.html @@ -0,0 +1,73 @@ + + + + + tp dom + + + + + + + + +

TP DOM

+
+
+

Contacts

+ + + + + + + + + + +
NomPrénomEmail
+ +
+
+

Saisie

+
+
+
+
+ +
+
+ +
+ +
+
+ +
+ +
+ +
+ +
+
+
+
Cliquez sur une ligne pour la supprimer.
+
+
+ + diff --git a/WIM4.1/tp/tp2/ex2/js/contacts.js b/WIM4.1/tp/tp2/ex2/js/contacts.js new file mode 100644 index 0000000..f82e023 --- /dev/null +++ b/WIM4.1/tp/tp2/ex2/js/contacts.js @@ -0,0 +1,77 @@ +window.addEventListener( + "load", + ()=>{ + let Model = { + getContacts(){ + return JSON.parse(localStorage.getItem('ct')) || [] + }, + saveContacts(arr){ + return localStorage.setItem('ct',JSON.stringify(arr)) + } + } + + let View ={ + + tableContact : document.querySelector("#contacts"), + formContact : document.getElementById("form"), + saveButton : document.getElementById("sauver"), + + getContactForm(){ + let data = new FormData(this.formContact) + return { + "nom" : data.get('nom'), + "prenom" : data.get('prenom'), + "email" : data.get("email") + } + }, + updateTable(cts){ + let fg = document.createElement("tbody") + cts.forEach((ct)=>{ + let tr = document.createElement("tr") + for (p in ct){ + let td = document.createElement("td") + let txt = document.createTextNode(ct[p]) + td.appendChild(txt) + tr.appendChild(td) + } + fg.appendChild(tr) + }) + this.tableContact.replaceChild(fg,this.tableContact.querySelector('tbody')) + }, + suscribeSubmitForm(f){ + this.formContact.addEventListener("submit",(ev)=>{ + ev.preventDefault() + f(this.getContactForm()) + }) + }, + suscribeSaveTable(f){ + // TODO + }, + suscribeClickTable(f){ + // TODO + } + } + + + let Controller = { + cts : [], // les contacts + init(){ + View.suscribeSubmitForm((ct)=>{ + if (this.cts.find(x=>x.email == ct.email) !== undefined){ + this.cts.push(ct) + View.updateTable(this.cts) + } + }) + + View.suscribeSaveTable(() => Model.saveContacts(this.cts)) + + View.suscribeClickTable( (ct)=> { + // TODO + }) + + this.cts = Model.getContacts() + View.updateTable(this.cts) + } + } + Controller.init() + }) diff --git a/WIM4.1/tp/tp2/ex3/cookie.html b/WIM4.1/tp/tp2/ex3/cookie.html new file mode 100644 index 0000000..08638aa --- /dev/null +++ b/WIM4.1/tp/tp2/ex3/cookie.html @@ -0,0 +1,26 @@ + + + + + + Cookie clicker + + + +
+

Cookie clicker

+
+ cookie + 0 +
+ + + + +
+ + + diff --git a/WIM4.1/tp/tp2/ex3/css/img/bg.jpg b/WIM4.1/tp/tp2/ex3/css/img/bg.jpg new file mode 100644 index 0000000..1a45fb8 Binary files /dev/null and b/WIM4.1/tp/tp2/ex3/css/img/bg.jpg differ diff --git a/WIM4.1/tp/tp2/ex3/css/style.css b/WIM4.1/tp/tp2/ex3/css/style.css new file mode 100644 index 0000000..558dd08 --- /dev/null +++ b/WIM4.1/tp/tp2/ex3/css/style.css @@ -0,0 +1,63 @@ +@import url(https://fonts.googleapis.com/css?family=Kavoon); + +body { + background-image: url("img/bg.jpg"); + background-repeat: repeat; + font-family: Kavoon; + font-size: 24px; + text-align: center; + color: white; +} + +.container { + max-width: 320px; + margin: auto; +} + +h1 { + font-size: 28px; + background-color: rgba(0, 0, 0, 0.25); + padding: 10px 40px 10px 40px; + border-radius: 10px; +} + +figure { + position: relative; + margin: 0; +} + +figure > span { + position: absolute; + top: 25px; + right: 50px; + border-radius: 21px; + height: 42px; + width: 56px; + background-color: #f4d03f; + box-shadow: 4px 4px 4px black; + padding-top: 9px; +} + +button { + display: block; + width: 100%; + font-family: Kavoon; + font-size: 24px; + background-color: white; + padding: 9px; + border-radius: 10px; + border-width: 0; +} + +p { + text-align: left; +} + +img[alt="GrandMa"] { + float: left; +} + +.hidden { + display: none; +} + diff --git a/WIM4.1/tp/tp2/ex3/img/bg.jpg b/WIM4.1/tp/tp2/ex3/img/bg.jpg new file mode 100644 index 0000000..1a45fb8 Binary files /dev/null and b/WIM4.1/tp/tp2/ex3/img/bg.jpg differ diff --git a/WIM4.1/tp/tp2/ex3/img/cookie.png b/WIM4.1/tp/tp2/ex3/img/cookie.png new file mode 100644 index 0000000..ee14eee Binary files /dev/null and b/WIM4.1/tp/tp2/ex3/img/cookie.png differ diff --git a/WIM4.1/tp/tp2/ex3/img/memee.png b/WIM4.1/tp/tp2/ex3/img/memee.png new file mode 100644 index 0000000..25a9e08 Binary files /dev/null and b/WIM4.1/tp/tp2/ex3/img/memee.png differ diff --git a/WIM4.1/tp/tp2/ex3/js/game.js b/WIM4.1/tp/tp2/ex3/js/game.js new file mode 100644 index 0000000..2ed247c --- /dev/null +++ b/WIM4.1/tp/tp2/ex3/js/game.js @@ -0,0 +1,47 @@ +// TODO + +let numberOfSecond + +let id_interval + +let btt = document.getElementsByTagName("button")[0] +let p = document.getElementsByTagName("p")[0] +let text_numberOfSecond = document.getElementsByTagName("p")[0].lastElementChild +let figure = document.getElementsByTagName("figure")[0] +let numberOfClick = document.getElementsByTagName("figure")[0].lastElementChild + + +function Timer(e4) { + numberOfSecond--; + text_numberOfSecond.innerText = numberOfSecond + " seconds left!" +} + +function Ending(e3) { + figure.removeEventListener("click", ClickIMG, false) + + clearInterval(id_interval) + text_numberOfSecond.innerText = 0 + " second left!" +} + +function ClickIMG(e2) { + numberOfClick.innerText = Number(numberOfClick.innerText) + 1 +} + +function ReponseClick(e1) { + numberOfSecond = 15 + btt.classList.add("hidden") + p.classList.remove("hidden") + text_numberOfSecond.innerText = numberOfSecond + " seconds left!" + text_numberOfSecond.style = "color:red" + + figure.addEventListener("click", ClickIMG, false) + + id_interval = setInterval(Timer, 1000) + + setTimeout(Ending, 15000) + +} + + +btt.addEventListener("click", ReponseClick, false) +