From 560b7ec663755c6695ae01e4ae52b26d25f76e7e Mon Sep 17 00:00:00 2001
From: 3wc <3wc.git@doesthisthing.work>
Date: Fri, 13 Nov 2020 03:20:15 +0200
Subject: [PATCH] Get phone number too, dump into <pre>

---
 src/App.css |  8 ++++++--
 src/App.js  | 53 +++++++++++++++++++++++++++++------------------------
 2 files changed, 35 insertions(+), 26 deletions(-)

diff --git a/src/App.css b/src/App.css
index d7016ce..6b4a325 100644
--- a/src/App.css
+++ b/src/App.css
@@ -24,7 +24,11 @@ body {
 
 .App .Main form {
   display: flex;
-  flex-direction: column;
+  flex-direction: row;
   align-items: center;
-  justify-content: center;
+  justify-content: space-between;
+  margin-bottom: 20px;
+}
+.App .Main form * {
+  margin: 0 5px;
 }
diff --git a/src/App.js b/src/App.js
index 4635a9f..7c8937c 100644
--- a/src/App.js
+++ b/src/App.js
@@ -1,12 +1,12 @@
 import React from 'react';
 
 import { 
-  Heading, IconButton, StarIcon, Pane, TextInput, Text, Spinner
+  Heading, IconButton, StarIcon, Pane, TextInput, Text, Spinner, Textarea
 } from 'evergreen-ui'
 
 import './App.css';
 
-const API_URL = 'https://api.jitsi.net/conferenceMapper';
+const API_URL = 'https://api.jitsi.net/';
 
 class Form extends React.Component {
   constructor() {
@@ -15,7 +15,7 @@ class Form extends React.Component {
     this.handleSubmit = this.handleSubmit.bind(this);
   }
 
-  handleSubmit(event) {
+  async handleSubmit(event) {
     event.preventDefault();
     this.setState({
       loading: true,
@@ -32,25 +32,33 @@ class Form extends React.Component {
 
     const form = event.target;
     const form_data = new FormData(form);
-    fetch(`${API_URL}?conference=${form_data.get('meeting-name')}@conference.meet.jit.si`, {
-      method: 'GET',
+
+    let name = form_data.get('meeting-name');
+
+    let [data_id, data_numbers] = await Promise.all([
+      fetch(`${API_URL}conferenceMapper?conference=${name}@conference.meet.jit.si`).then(res => res.json()),
+      fetch(`${API_URL}phoneNumberList?conference=${name}@conference.meet.jit.si`).then(res => res.json()),
+    ])
+
+    console.log(data_id);
+    console.log(data_numbers);
+
+    this.setState({ 
+      invalid: false,
+      displayErrors: false,
+      name: name,
+      meetingid: data_id.id,
+      phone: data_numbers.numbers.UK,
+      loading: false,
+      str: `Notes: https://pad.riseup.net/p/${name}
+        Computer / app: https://meet.jit.si/${name}
+        Phone: ${data_numbers.numbers.UK}
+        PIN: ${data_id.id}`
     })
-      .then(res => res.json())
-      .then((data) => {
-        this.setState({ 
-          invalid: false,
-          displayErrors: false,
-          name: form_data.get('meeting-name'),
-          meetingid: data.id,
-        loading: false,
-        })
-        console.log('Meeting ID: ' + this.state.meetingid)
-      })
-      .catch(console.log);
   }
 
   render() {
-  	const { name, meetingid, invalid, loading, displayErrors } = this.state;
+  	const { str, name, meetingid, invalid, phone, loading, displayErrors } = this.state;
     return (
     	<div>
         <form
@@ -61,7 +69,6 @@ class Form extends React.Component {
           <Heading size={700}>meeting name:</Heading>
           <TextInput
             height={60}
-            margin={20}
             name="meeting-name"
             placeholder="YourMeetingNameHere"
             required
@@ -79,12 +86,10 @@ class Form extends React.Component {
             <Spinner marginX="auto" />
           )}
           {!invalid && name && (
-          	<div>
+          	<Pane>
               <h3>Copy Pasta</h3>
-              <p>Notes: https://pad.riseup.net/p/{name}</p>
-              <p>Link: https://meet.jit.si/{name}</p>
-              <p>PIN: {meetingid}</p>
-          	</div>
+              <Textarea value={str} />
+          	</Pane>
           )}
         </div>
     	</div>