subscription page

cheerz · Jul 26, 2018 · 4f5782d · 4f5782d
1 parent c8836cc
commit 4f5782d
Show file tree

Hide file tree

Showing 4 changed files with 72 additions and 27 deletions.
diff --git a/README.md b/README.md
@@ -16,4 +16,4 @@ post /cheerzers {name: string, available: bool}
 -> add a new cheerzer
 
 put /cheerzers/:cheerzer_id {name: string, available: bool}
--> update cheerzer's availability
+-> update cheerzer's availability
diff --git a/client/index.js b/client/index.js
@@ -1,15 +1,6 @@
-// const axios = require('axios');
-
 const http = axios
 const apiUrl = 'http://localhost:3000'
 
-const getRandomInt = (min, max) => Math.floor(Math.random() * (max - min + 1) + min)
-
-const allCheerzers = ['Milisa', 'Romain', 'Marie-Blanche', 'Sara', 'Guillaume', 'Elodie', 'Elif', 'Robin', 
-'Thomas', 'DavidG', 'Arnaud', 'Hugo', 'Kevin', 'DavidP', 'Leo', 'Denis', 'Johnny', 'Charles', 'Tom', 'Melissa', 'Thiefaine', 'AlexandreW', 'Aminata', 'AlexandreC',
-'Daniel', 'Charlotte', 'Theo', 'Maxime', 'Raphaele', 'Yao', 'Cindy', 'Ana', 'Pierre', 'Damien', 'Amel', 'Tristan', 'Maxime', 'Maria', 'Mapy', 'Sandra', 'Marie-Julia', 
-'Julien', 'Mathieu', 'Valentine', 'Aurel', 'Antoine', 'Bea', 'Valeria', 'Denisse']
-
 const getAvailableCheerzers = () => {
 	return http.get(apiUrl+'/cheerzers')
 	.then(response => {
@@ -30,7 +21,6 @@ const addCheerzer = (name, available) => {
 	.catch(err => console.log(err))
 }
 
-
 const updateCheerzerAvailability = (name, available) => {
 	const cheerzerToModify = availableCheerzers.find(cheerzer => cheerzer.name === name)
 
@@ -43,23 +33,8 @@ const updateCheerzerAvailability = (name, available) => {
 	.catch(err => console.log(err))
 }
 
-/*
-addCheerzer('Melissa', false)
-
-setTimeout(() => {
- 	updateCheerzerAvailability('Melissa', true)
-}, 1000)
-*/
-
-
-let availableCheerzers = []
-
-getAvailableCheerzers().then(res => {
-	availableCheerzers = res
-})
-
 // get 4 random people to eat with, from available people
-getRandomCheerzersToEatWith = () => {
+const getRandomCheerzersToEatWith = () => {
 	return http.get('http://localhost:8081/api/cheerzers/Guillaume')
 	.then(response => {
 		console.log('CHEERZERS:', response.data)
@@ -72,5 +47,18 @@ getRandomCheerzersToEatWith = () => {
 }
 
 
+let availableCheerzers = []
+
+getAvailableCheerzers().then(res => {
+	availableCheerzers = res
+})
 
 getRandomCheerzersToEatWith()
+
+/*
+addCheerzer('Melissa', false)
+
+setTimeout(() => {
+ 	updateCheerzerAvailability('Melissa', true)
+}, 1000)
+*/
diff --git a/client/subscribe.html b/client/subscribe.html
@@ -0,0 +1,21 @@
+<!DOCTYPE html>
+<html lang="fr">
+  <head>
+    <meta charset="utf-8">
+    <title>Meetz</title>
+    <link rel="stylesheet" href="style.css">
+    <script src="scripts/axios/dist/axios.min.js"></script>
+    <script src="subscribe.js"></script>
+  </head>
+  <body>
+    <h1>Subscribe</h1>
+
+    <form class="subscribeForm" onsubmit="return false">
+      <label for="name">Name
+        <input id="name" class="name" placeholder="your name" />
+      </label>
+      <button id="subscribeButton" class="subscribeButton" type="submit">Subscribe</button>
+    </form>
+    <h3 class="subscribed" style="display:none">You subscribed!</h3>
+  </body>
+</html>
diff --git a/client/subscribe.js b/client/subscribe.js
@@ -0,0 +1,36 @@
+const http = axios
+const apiUrl = 'http://localhost:3000'
+
+const addCheerzer = (name, available) => {
+	return http.post(apiUrl+'/cheerzers', {name, available})
+	.then(response => {
+		return response.data
+	})
+	.catch(err => console.log(err))
+}
+
+
+const x = () => {
+	const submitButton = document.querySelector('.subscribeButton')
+	submitButton.onclick = subscribe
+}
+
+const subscribe = (ev) => {
+	const cheerzerName = document.querySelector('.name').value
+	return addCheerzer(cheerzerName, true).then(res => {
+		const formElement = document.querySelector('.subscribeForm')
+		const subscribedElement = document.querySelector('.subscribed')
+
+		formElement.style.display = 'none'
+		subscribedElement.style.display = 'block'
+
+		console.log('YOU SUBSCRIBED', res, formElement, subscribedElement)
+	})
+	.catch(err => {
+		console.log(err)
+	})
+}
+
+window.onload = x
+
+