Merge branch '7-as-a-user-i-want-to-see-all-of-the-working-spaces-available' into 'development'

Update static/testSearch.html, templates/OurSpaces.html, templates/Space.html,...

Closes #7

See merge request !47

README.md

+# README
+
+Write an overview of your project here...

WorkSpaces.sql

+DELETE FROM 'coworking_spaces' WHERE Name = 'Name';
+--DROP TABLE IF EXISTS coworking_spaces;
+
+
+--CREATE TABLE IF NOT EXISTS 'coworking_spaces' (
+--`Name`	TEXT NOT NULL,
+--`Address`	TEXT NOT NULL,
+--`Main_Photo`	TEXT NOT NULL,
+--`Additional_photos`	TEXT NOT NULL,
+--`Description`	TEXT NOT NULL,
+--`Website`	TEXT NOT NULL,
+--`Email`	TEXT NOT NULL,
+--`Phone_Number`	TEXT NOT NULL,
+--`Opening_Hours`	TEXT NOT NULL,
+--`Checkin_Instructions`	TEXT NOT NULL,
+--);
+
+
+--INSERT INTO 'coworking_spaces'('Name','Address', 'Main_Photo', 'Additional_photos','Description','Website','Email','Phone_Number','Opening_Hours','Checkin_Instructions') VALUES ('Codebase	CodeBase Edinburgh' , '37a Castle Terrace, Edinburgh, EH1 2EL	', 'https://images.squarespace-cdn.com/content/v1/55439320e4b0f92b5d6c4c8b/1646867535415-4JI39H286BUMT26H4FHN/C36A1915.jpg?format=2500w','	https://images.squarespace-cdn.com/content/v1/55439320e4b0f92b5d6c4c8b/1646868533510-J1OT4PEG5VM9FCBF8BJE/15.10.19_-_CREATIVE_BRIDGE_C02_-_DAY01_-_LQ-19+%281%29.jpg?format=2500w','https://images.squarespace-cdn.com/content/v1/55439320e4b0f92b5d6c4c8b/1646868421127-07KQ4N1OHTDDKQME686A/15.10.19_-_CREATIVE_BRIDGE_C02_-_DAY01_-_LQ-52+%281%29.jpg?format=2500w',	'Hi. We’re CodeBase. We've been exploring the world of startups and innovation for over five years now. We're not really sure how to best describe what we do, but we think the words "tech cluster" probably do it best. Please get in touch! We’re friendly people who are geeky about building tech startups, managing disruption and innovation.',	'https://www.thisiscodebase.com','info@thisiscodebase.com','(+44) 0131 560 2003',	'08:00 - 17:00','	Use the email address or phone number to call ahead and book a desk, let them know you're a Tramshed member');

coworking_spaces.csv

-Name,Address,Main_Photo,Additional_Photos,Description,Website,Email,Phone_Number,Opening_Hours,Checkin_Instructions
+Name,Address,Main_Photo,Additional_Photos,Description,Website,Email,Phone_Number,Opening_Hours,Checkin_Instructions
 Codebase,"CodeBase Edinburgh , 37a Castle Terrace, Edinburgh, EH1 2EL",https://images.squarespace-cdn.com/content/v1/55439320e4b0f92b5d6c4c8b/1646867535415-4JI39H286BUMT26H4FHN/C36A1915.jpg?format=2500w,"https://images.squarespace-cdn.com/content/v1/55439320e4b0f92b5d6c4c8b/1646868533510-J1OT4PEG5VM9FCBF8BJE/15.10.19_-_CREATIVE_BRIDGE_C02_-_DAY01_-_LQ-19+%281%29.jpg?format=2500w,https://images.squarespace-cdn.com/content/v1/55439320e4b0f92b5d6c4c8b/1646868421127-07KQ4N1OHTDDKQME686A/15.10.19_-_CREATIVE_BRIDGE_C02_-_DAY01_-_LQ-52+%281%29.jpg?format=2500w","Hi. We’re CodeBase. We've been exploring the world of startups and innovation for over five years now. We're not really sure how to best describe what we do, but we think the words ""tech cluster"" probably do it best. Please get in touch! We’re friendly people who are geeky about building tech startups, managing disruption and innovation.",https://www.thisiscodebase.com,info@thisiscodebase.com,(+44) 0131 560 2003,08:00 - 17:00,"Use the email address or phone number to call ahead and book a desk, let them know you're a Tramshed member"
 Catalyst,"Titanic Quarter, Queens Road, Belfast, BT3 9DT",https://wearecatalyst.org/wp-content/uploads/2022/05/Catalyst03.jpg,"https://wearecatalyst.org/wp-content/uploads/2022/03/DSC07673-scaled-2048x1570.jpg,https://wearecatalyst.org/wp-content/uploads/2021/01/2F6A1513.jpg","We are an independent, not-for-profit organisation working together for the greater good, enabling a connected community of like-minded innovators in an entrepreneurial eco-system that is the key driver of the knowledge economy in Northern Ireland.",https://wearecatalyst.org,enquiries@wearecatalyst.org,+44(0)28 9073 7800,08:00 - 18:00,"Use the email address or phone number to call ahead and book a desk, let them know you're a Tramshed member"
 C4DI,"C4DI Campus, 31-38 Queen Street, Hull, HU1 1UU",https://images.squarespace-cdn.com/content/v1/5709040420c647579532dbb4/1594914119071-OWI9G22S295OCMSWL0VL/_K5L1162.jpg?format=2500w,"https://images.squarespace-cdn.com/content/v1/5709040420c647579532dbb4/1588346951023-V0QWKQI35IDUACMOJ0WM/_MKL2718.jpg?format=750w,https://images.squarespace-cdn.com/content/v1/5709040420c647579532dbb4/1588346977833-LGY6P9473H2C5JF6I2UG/_K5M5505.jpg?format=750w","C4DI is an incubator that helps tech companies grow, and traditional businesses innovate.",http://www.c4di.co.uk,lc@c4di.net,+44 1482 304244,9am - 5pm,"Use the email address or phone number to call ahead and book a desk, let them know you're a Tramshed member"
 Dogpatch Labs,"Custom House Quay, Dublin, D01 Y6H7",https://dogpatchlabs.wpenginepowered.com/wp-content/uploads/2022/09/ian_browne.jpg,"https://dogpatchlabs.wpenginepowered.com/wp-content/uploads/2021/07/bordered.jpg,https://dogpatchlabs.com/wp-content/uploads/2020/03/UG_3-1.jpg","Dogpatch Labs is a startup hub, located in the heart of Dublin’s Digital Docklands.",https://dogpatchlabs.com,info@dogpatchlabs.com,,8:30 - 5:30,"Use the email address or phone number to call ahead and book a desk, let them know you're a Tramshed member"
-Stafion F,"5 Parvis Alan Turing, Paris",https://stationf.co/img/misc/create-zone.jpg,",https://stationf.co/img/flatmates/coffee-restaurant.jpg","Based in central Paris, STATION F gathers a whole entrepreneurial ecosystem under one roof. We help entrepreneurs bring their ambitious ideas to life.",https://stationf.co,,,0:00 - 0:00,Book through the Tramshed Tech app
+Stafion F,"5 Parvis Alan Turing, Paris",https://stationf.co/img/misc/create-zone.jpg,",https://stationf.co/img/flatmates/coffee-restaurant.jpg","Based in central Paris, STATION F gathers a whole entrepreneurial ecosystem under one roof. We help entrepreneurs bring their ambitious ideas to life.",https://stationf.co,,,0:00 - 0:00,Book through the Tramshed Tech app
\ No newline at end of file

db.sqbpro

+<?xml version="1.0" encoding="UTF-8"?><sqlb_project><db path="C:/Users/c21070842/OneDrive - Cardiff University/Desktop/tramshed-tech-client-project-team-15/db.db" readonly="0" foreign_keys="1" case_sensitive_like="0" temp_store="0" wal_autocheckpoint="1000" synchronous="2"/><attached/><window><main_tabs open="structure browser pragmas query" current="1"/></window><tab_structure><column_width id="0" width="300"/><column_width id="1" width="0"/><column_width id="2" width="150"/><column_width id="3" width="2218"/><column_width id="4" width="0"/><expanded_item id="0" parent="1"/><expanded_item id="1" parent="1"/><expanded_item id="2" parent="1"/><expanded_item id="3" parent="1"/></tab_structure><tab_browse><current_table name="4,16:maincoworking_spaces"/><default_encoding codec=""/><browse_table_settings><table schema="main" name="coworking_spaces" show_row_id="0" encoding="" plot_x_axis="" unlock_view_pk="_rowid_"><sort/><column_widths><column index="1" value="139"/><column index="2" value="300"/><column index="3" value="300"/><column index="4" value="300"/><column index="5" value="300"/><column index="6" value="299"/><column index="7" value="265"/><column index="8" value="199"/><column index="9" value="169"/><column index="10" value="300"/></column_widths><filter_values/><conditional_formats/><row_id_formats/><display_formats/><hidden_columns/><plot_y_axes/><global_filter/></table></browse_table_settings></tab_browse><tab_sql><sql name="SQL 1">DELETE FROM coworking_spaces WHERE Name = 'Name';
+</sql><current_tab id="0"/></tab_sql></sqlb_project>

framework.css

+body{
+  background-color: white;
+  color: black;
+}
+
+header{
+  background-color: white;
+  color: black;
+  display: block;
+  margin-left: auto;
+  margin-right: auto;
+  float: center;
+}

main.py

+from flask import Flask, request, render_template, redirect
+
+import sqlite3
+app = Flask(__name__)
+DATABASE = "db.db"
+ALLOWED_EXTENSIONS = set(['txt', 'pdf', 'png', 'jpg', 'jpeg', 'gif'])
+
+
+@app.route("/Load/CodeBase")
+def Load():
+			Name = "Codebase";
+			conn = sqlite3.connect(DATABASE)
+			cur = conn.cursor()
+			print(Name)
+		#	getAddress(Name)
+			cur.execute("SELECT * FROM 'coworking_spaces' WHERE Name =?;", [Name])
+			data = cur.fetchall()
+			print(data)
+		#	cur.execute("SELECT Address FROM coworking_spaces WHERE Name =? ;", [Name])
+		#	Address = cur.fetchall()
+		#	print(Address)
+		#	cur.execute("SELECT Main_Photo FROM coworking_spaces WHERE Name =? ;", [Name])
+		#	Main_Photo = cur.fetchall()
+		#	print(Main_Photo)
+		#	cur.execute("SELECT Additional_photos FROM coworking_spaces WHERE Name =? ;", [Name])
+		#	Additional_photos = cur.fetchall()
+		#	print(Additional_photos)
+		#	cur.execute("SELECT Description FROM coworking_spaces WHERE Name =? ;", [Name])
+		#	Description = cur.fetchall()
+		#	print(Description)
+		#	cur.execute("SELECT Website FROM coworking_spaces WHERE Name =? ;", [Name])
+		#	Website = cur.fetchall()
+		#	print(Website)
+		#	cur.execute("SELECT Opening_Hours FROM coworking_spaces WHERE Name =? ;", [Name])
+		#	Opening_Hours = cur.fetchall()
+		#	print(Opening_Hours)
+			conn.close()
+			return render_template('Space.html', data = data)
+			# pageAddress = Address, pageMain_Photo = Main_Photo, pageAdditional_photos = Additional_photos, pageDescription = Description, pageWebsite = Website, pageOpening_Hours = Opening_Hours  )
+
+if __name__ == "__main__":
+	app.run(debug=True)

spaces.js

+function SpacesLoad() {
+  document.getElementById('nextButton').addEventListener('click',loadValidatedQuestion);
+}
+
+// Loads an validated question when called.
+function loadpaceInfo() {
+  var xhttp = new XMLHttpRequest();
+  xhttp.open("PUT", '/LoadValidatedQuestion', true);
+  xhttp.setRequestHeader("Content-type", "application/x-www-form-urlencoded");
+  xhttp.onreadystatechange = function() {
+    if (xhttp.readyState === 4 && xhttp.status === 200) {
+      console.log(xhttp.responseText);
+      // Below is the message to output onto the Question Validation page,
+      // after it has been approved or rejected by a moderator.
+      document.getElementById("quizText").innerHTML = xhttp.responseText;
+    } else {
+//      console.error(`Status Text: ${xhttp.statusText}.`);
+//      console.error(`Ready State: ${xhttp.readyState}.`);
+    }
+  };
+  xhttp.send();
+}
+
+// Function to call multiple functions.
+function quizLoad() {
+  onQuizPageLoad();
+  loadValidatedQuestion();
+}
+
+function submitAnswer(e) {
+  // Removes the standard form processing.
+  e.preventDefault();
+  e.stopPropagation();
+  var quizText = document.getElementById("quizText").textContent;
+  var quizAnswer = document.forms["quizForm"]["quizAnswer"].value;
+  params = 'quizText='+quizText+'&quizAnswer='+quizAnswer;
+  var xhttp = new XMLHttpRequest();
+  xhttp.open("POST", '/SubmitAnswer', true);
+  xhttp.setRequestHeader("Content-type", "application/x-www-form-urlencoded");
+  xhttp.onreadystatechange = function() {
+    if (xhttp.readyState === 4 && xhttp.status === 200) {
+//      console.log(xhttp.responseText);
+      // Below is the message to output onto the Question Validation page,
+      // after it has been approved or rejected by a moderator.
+      document.getElementById("DEBUGserverMessage").innerHTML = xhttp.responseText;
+      loadValidatedQuestion()
+    } else {
+//      console.error(`Status Text: ${xhttp.statusText}.`);
+//      console.error(`Ready State: ${xhttp.readyState}.`);
+    }
+  };
+  xhttp.send(params);
+}

static/CSS/OurSpaces.css

+header{
+  background-color: black;
+  display: block;
+  margin-left: auto;
+  margin-right: auto;
+  width: 100%;
+  height: 10%;
+  float: center;
+  text-align: center;
+  margin: auto;
+  color: white;
+
+}
+body{
+
+  font-family: 'Sora', sans-serif;
+}
+
+#ImageBox{
+  border-radius: 7px;
+  width: 810px;
+  height: 610px;
+  border: 15px solid Black ;
+  padding: 5px;
+  margin: 20px;
+  float: right;
+
+}
+#AddImageBox{
+  border-radius: 7px;
+  width: 810px;
+  height: 610px;
+  border: 15px solid Black ;
+  padding: 5px;
+  margin: 20px;
+  float: Left;
+
+}
+
+#DescriptionBox{
+  border-radius: 7px;
+  width: 640px;
+  height: 490px;
+  border: 15px solid Black ;
+  padding: 5px;
+  margin: 20px;
+  float: left;
+
+}
+
+#AddressBox{
+  border-radius: 7px;
+  width: 640px;
+  height: 630px;
+  border: 15px solid Black ;
+  padding: 5px;
+  margin: 20px;
+  float: Right;
+}
+
+#timesBox{
+  border-radius: 7px;
+  width: 480px;
+  height: 120px;
+  border: 15px solid Black ;
+  padding: 5px;
+  margin: 20px;
+  float: left;
+}
+#WebsiteBox{
+  border-radius: 7px;
+  width: 320px;
+  height: 80px;
+  border: 15px solid Black ;
+  padding: 5px;
+  margin: 20px;
+  float: right;
+}

static/JS/spaces.js

+function loadSpaceInfo() {
+  var xhttp = new XMLHttpRequest();
+  xhttp.open('/Load/CodeBase', true);
+  xhttp.setRequestHeader("Content-type", "application/x-www-form-urlencoded");
+  xhttp.onreadystatechange = getAddress() {
+    if (this.readyState == 4 && this.status == 200) {
+
+       document.getElementById("AddressText").innerHTML = xhttp.responseText;
+       console.log(xhttp.responseText);
+    }
+
+
+  xhttp.onreadystatechange = getMain_Photo() {
+    if (this.readyState == 4 && this.status == 200) {
+
+        document.getElementById("Main_PhotoText").innerHTML = xhttp.responseText;
+        console.log(xhttp.responseText);
+    }
+
+
+  xhttp.onreadystatechange = getAdditional_photos() {
+    if (this.readyState == 4 && this.status == 200) {
+
+        document.getElementById("Additional_photosText").innerHTML = xhttp.responseText;
+        console.log(xhttp.responseText);
+    }
+
+
+  xhttp.onreadystatechange = getWebsite() {
+    if (this.readyState == 4 && this.status == 200) {
+
+        document.getElementById("WebsiteText").innerHTML = xhttp.responseText;
+        console.log(xhttp.responseText);
+    }
+
+
+  xhttp.onreadystatechange = getDescription() {
+    if (this.readyState == 4 && this.status == 200) {
+
+        document.getElementById("DescriptionText").innerHTML = xhttp.responseText;
+        console.log(xhttp.responseText);
+    }
+
+
+  xhttp.onreadystatechange = getOpening_Hours() {
+      if (this.readyState == 4 && this.status == 200) {
+
+        document.getElementById("Opening_HoursText").innerHTML = xhttp.responseText;
+        console.log(xhttp.responseText);
+    }
+
+
+
+  xhttp.onreadystatechange = function() {
+    if (xhttp.readyState === 4 && xhttp.status === 200) {
+      console.log(xhttp.responseText);
+      // Below is the message to output onto the workspace page,
+
+      document.getElementById("loadText").innerHTML = xhttp.responseText;
+      console.log(xhttp.responseText);
+    } else {
+//      console.error(`Status Text: ${xhttp.statusText}.`);
+//      console.error(`Ready State: ${xhttp.readyState}.`);
+    }
+  };
+  xhttp.send();
+}

static/testSearch.html

+<head>
+	<link rel="stylesheet" href="framework.css">
+</head>
+
+<body class="body">
+
+<header>
+
+  <li><a href="/Load/CodeBase">view CodeBase</a></li>
+
+</header>

templates/OurSpaces.html

+<head>
+<link rel="stylesheet" href="/static/CSS/OurSpaces.css">
+</head>
+
+<body class="body">
+<link href="https://cdn.jsdelivr.net/npm/bootstrap@5.2.3/dist/css/bootstrap.min.css" rel="stylesheet">
+<script src="https://cdn.jsdelivr.net/npm/@popperjs/core@2.9.2/dist/umd/popper.min.js" ></script>
+<script src="https://cdn.jsdelivr.net/npm/bootstrap@5.0.1/dist/js/bootstrap.min.js" integrity="sha384-Atwg2Pkwv9vp0ygtn1JAojH0nYbwNJLPhwyoVbhoPwBhjQPR5VtM2+xf0Uwh9KtT" crossorigin="anonymous"></script>
+<header>
+	<h1>{% block titleBlock%}	{%endblock%}</h1>
+</header>
+
+<div id = "ImageBox"class="ImageBox">
+	<img src="{% block imageBlock%}{%endblock%}"width="770" height="570" style="border:3;" class="img-rounded" allowfullscreen="" loading="lazy">
+</div>
+
+<div id= "DescriptionBox" class="DescriptionBox">
+<h2>About us</h2>
+<h3>{% block descriptionBlock%}  {%endblock%}</h3>
+</div>
+
+<div id= "AddImageBox"class="AddImageBox">
+	<img src="{% block addimageBlock%}{%endblock%}"width="770" height="570" style="border:3;" class="img-rounded" allowfullscreen="" loading="lazy">
+</div>
+
+<div id= "AddressBox"class="AddressBox">
+{% block addressBlock%}
+{%endblock%}
+</div>
+
+<div id= "timesBox"class="timesBox">
+	<h2>When are we Open?</h2>
+	<h3>{% block timeBlock%}  {%endblock%}</h3>
+</div>
+
+<div id= "WebsiteBox"class="WebsiteBox">
+	<h2><a href="{% block WebsiteBlock%}{%endblock%}">Get More Info here</a><h2>
+  <h3></h3>
+</div>
+
+</body>

templates/Space.html

+{%extends 'OurSpaces.html'%}
+<form id='myForm' action='/Load/CodeBase>' method ='post'>
+  {% block titleBlock%}
+  {%if data%}
+    {{data[0][0]}} <br>
+  {%endif%}
+  {%endblock%}
+
+  {% block addressBlock%}
+  <h2>Address info</h2>
+  <iframe src="https://www.google.com/maps/embed?pb=!1m18!1m12!1m3!1d4957.954181608377!2d-2.999839445369478!3d51.58698324808131!2m3!1f0!2f0!3f0!3m2!1i1024!2i768!4f13.1!3m3!1m2!1s0x4871e6cc3bd82553%3A0x684c1227f14b4a15!2sNational%20Software%20Academy%20(Cardiff%20University)!5e0!3m2!1sen!2suk!4v1669722978098!5m2!1sen!2suk"
+   width="600" height="450" style="border:0;" allowfullscreen="" loading="lazy" referrerpolicy="no-referrer-when-downgrade"></iframe>
+   <br>
+  <h3>
+  {%if data%}
+    {{data[0][1]}}
+  {%endif%}
+</h3>
+  {%endblock%}
+
+
+
+  {% block descriptionBlock%}{%if data%}{{data[0][4]}}{%endif%}{%endblock%}
+
+  {% block imageBlock%}{%if data%}{{data[0][2]}}{%endif%}{%endblock%}
+
+  {% block addimageBlock%}{%if data%}{{data[0][3]}}{%endif%}{%endblock%}
+
+  {% block timeBlock%}{%if data%}{{data[0][8]}}{%endif%}{%endblock%}
+
+  {% block WebsiteBlock%}{%if data%}{{data[0][5]}}{%endif%}{%endblock%}
+<span id='txt'></span>
+
+<script>
+  function loadSpace() {
+    var Name = document.forms["coworking_spaces"]["Name"].value;
+    var Address = document.forms["coworking_spaces"]["Address"].value;
+    var Main_Photo = document.forms["coworking_spaces"]["Main_Photo"].value;
+    var Additional_photos = document.forms["coworking_spaces"]["Main_Photo"].value;
+    var Description = document.forms["coworking_spaces"]["Description"].value;
+    var Website = document.forms["coworking_spaces"]["Website"].value;
+    var Opening_Hours = document.forms["coworking_spaces"]["Opening_Hours"].value;
+
+    var xhttp = new XMLHttpRequest();
+
+    xhttp.setRequestHeader("Content-type", "application/x-www-form-urlencoded");
+    xhttp.onload = function() {
+      if (xhttp.readyState === 4 && xhttp.status === 200) {
+        console.log(xhttp.responseText);
+        document.getElementById("txt").innerHTML = xhttp.responseText;
+      } else {
+        console.error(xhttp.statusText);
+      }
+    };
+    xhttp.send(params);
+    return false;
+  }
+
+</script>
+
+
+</form>