From a66ff61bafc02fb0f900732275e0714bea98c925 Mon Sep 17 00:00:00 2001
From: Zainab Almeshari <almeshariz@cardiff.ac.uk>
Date: Fri, 9 Dec 2022 11:07:07 +0000
Subject: [PATCH] form, templating, database connection and some CSS updates
---
coworking_spaces.csv | 2 +-
project_server.py | 33 ++++++++++++++++-
static/CSS/locations.css | 63 ++++++++++++++++++++++----------
static/locations.html | 73 +++++++++++++++++++++++++++++---------
static/locations.js | 10 ++++++
templates/OneLocation.html | 11 ++++++
templates/locations.html | 13 +++++++
templates/test.html | 2 +-
8 files changed, 170 insertions(+), 37 deletions(-)
create mode 100644 static/locations.js
create mode 100644 templates/OneLocation.html
create mode 100644 templates/locations.html
diff --git a/coworking_spaces.csv b/coworking_spaces.csv
index d2b3226..8b2ba4d 100644
--- a/coworking_spaces.csv
+++ b/coworking_spaces.csv
@@ -1,5 +1,5 @@
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"
+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"
diff --git a/project_server.py b/project_server.py
index d5abe52..3fce449 100644
--- a/project_server.py
+++ b/project_server.py
@@ -1,9 +1,10 @@
import os
import sqlite3
-from flask import Flask, redirect, request, render_template, jsonify
+from flask import Flask, redirect, request, render_template, jsonify, url_for, flash, session
app = Flask(__name__)
DATABASE = "project_db.db"
+app.secret_key = "hello"
ALLOWED_EXTENSIONS = set(['txt', 'pdf', 'png', 'jpg', 'jpeg', 'gif'])
@@ -12,6 +13,11 @@ ALLOWED_EXTENSIONS = set(['txt', 'pdf', 'png', 'jpg', 'jpeg', 'gif'])
def returnTemplate():
return render_template("test.html")
+@app.route("/OneLocation", methods=['GET'])
+def OneLocation():
+ return render_template("locations.html")
+
+
@app.route("/SearchRecord", methods=['POST'])
def searchRecord():
@@ -110,5 +116,30 @@ def editRecord():
print(infoMessage)
return (infoMessage)
+@app.route("/locations", methods=["POST" , "GET"])
+def Locations():
+
+ print('Processing location')
+
+ if request.method == "POST":
+ session.permanent = True
+ locationsName = request.form['name']
+ locationPic = request.form['image']
+
+
+ conn = sqlite3.connect(DATABASE)
+ cur = conn.cursor()
+ cur.execute("SELECT Name, Main_photo FROM coworking_spaces WHERE Name= ?;", [locationsName])
+ conn.commit()
+ conn.close()
+
+ msg= " Location added successfuly!"
+
+ return render_template('locations.html')
+
+
+
+
+
if __name__ == "__main__":
app.run(debug=True)
diff --git a/static/CSS/locations.css b/static/CSS/locations.css
index 93d4213..76f5b34 100644
--- a/static/CSS/locations.css
+++ b/static/CSS/locations.css
@@ -5,34 +5,63 @@ color: black;
.container {
+display: flex;
position: relative;
-padding: 5px;
-width: 50%;
-height: 70%;
+padding: 5px 640px 5px 5px;
+width: 40%;
+height: 50%;
background-color: white;
box-shadow: 0 4px 8px 0 rgba(0, 0, 0, 0.2), 0 6px 20px 0 rgba(0, 0, 0, 0.19);
margin-bottom: 25px;
+border-radius: 10px;
+
}
.image {
opacity: 1;
display: block;
-width: 100%;
-height: 75%;
transition: .5s ease;
backface-visibility: hidden;
+border-radius: 10px 10px 10px 10px;
+ float: left;
+ width: 300px;
+ height: 250px;
+ object-fit: cover;
+}
+
+h2 {
+position: absolute;
+margin-left: 320px;
+margin-top: 30px;
+ }
+
+p{
+ margin-top: 80px;
+ margin-left: 50px;
+}
+
+.checked{
+ color: orange;
+}
+.star{
+ position: absolute;
+ top: 50%;
+ left: 40%;
+ transform: translate(-50%, -50%);
+ margin-top: 80px;
+
}
.middle {
transition: .5s ease;
opacity: 0;
position: absolute;
-top: 50%;
-left: 50%;
-transform: translate(-50%, -50%);
--ms-transform: translate(-50%, -50%)
+top: 45%;
+left: 10.5%;
+transform: translate(-25%, -25%);
+-ms-transform: translate(-25%, -25%)
}
@@ -51,17 +80,14 @@ font-size: 16px;
padding: 16px 32px;
}
-
-
div.contain {
text-align: center;
}
ul.list {
display: inline-block;
-text-align: center;
list-style-type: none;
-margin-left: 350px;
+margin: 0;
}
h1 {
@@ -98,7 +124,7 @@ margin: 10px 10px;
outline: none;
border-radius: 4px;
padding: 4px;
- position: fixed;
+ position: absolute;
top: 65px;
right: 20px;
cursor: pointer;
@@ -124,13 +150,13 @@ margin: 10px 10px;
nav{
background-color: black;
padding: 15px;
- height: 100vh;
- position: fixed;
+ height: 18.1vh;
+ position: absolute;
top: 0;
right: 0;
width: 200px;
transform: translateX(100%);
- margin-top: 0.5em;
+ margin-top: 2.25em;
border-radius: 10px;
transition: 0.4s ease-in-out;
}
@@ -153,7 +179,8 @@ margin: 10px 10px;
display: block;
}
nav ul li a:hover {
- color: white;
+ color: #A9A9A9;
+
JScript/locations.js 0 → 100644
+
10
diff --git a/static/locations.html b/static/locations.html
index b2d3567..8718127 100644
--- a/static/locations.html
+++ b/static/locations.html
@@ -2,11 +2,12 @@
<html>
<head>
<link rel="stylesheet" href= "CSS/locations.css">
+ <link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/4.7.0/css/font-awesome.min.css">
<title> Locations </title>
</head>
<body>
- <section>
- <h1><img src="https://www.4piproductions.com/wp-content/uploads/2017/04/tramshed_.png" class="logo"> Our Locations </h1>
+ <section>
+ <h1><img src="Media/logo.png" class="logo"/> Our Locations </h1>
<button>
<span></span>
<span></span>
@@ -14,29 +15,44 @@
</button>
<nav>
<ul>
- <li><a href="#"> Home </a></li>
- <li><a href="#"> ### </a></li>
- <li><a href="#"> ### </a></li>
- </ul>
+ <li><a href="landingpage.html"> Home </a></li>
+ <li><a href="#"> ### </a></li>
+ <li><a href="#"> ### </a></li>
+ </ul>
</nav>
-
<div class="contain">
<ul class= "list">
<li>
<div class="container">
<img src="https://images.squarespace-cdn.com/content/v1/55439320e4b0f92b5d6c4c8b/1646867535415-4JI39H286BUMT26H4FHN/C36A1915.jpg?format=2500w" class="image" >
-
+ <h2> Codebase </h2>
+ <p>hhhhhhhhhhhhhhhhhhhhhhhhhhh</p>
+ <div class= star>
+ <span class="fa fa-star fa-3x checked" ></span>
+ <span class="fa fa-star fa-3x checked"></span>
+ <span class="fa fa-star fa-3x checked"></span>
+ <span class="fa fa-star fa-3x" ></span>
+ <span class="fa fa-star fa-3x" ></span>
+ </div>
<div class="middle">
<div class="text"> Codebase </div>
- </div>
</div>
+ </div>
</li>
<li>
<div class="container">
- <img src="https://wearecatalyst.org/wp-content/uploads/2022/05/Catalyst03.jpg" class="image" >
-
- <div class="middle">
+ <img src="https://wearecatalyst.org/wp-content/uploads/2022/05/Catalyst03.jpg" class="image" >
+ <h2> Catalyst </h2>
+ <p>hhhhhhhhhhhhhhhhhhhhhhhhhhh</p>
+ <div class= star>
+ <span class="fa fa-star fa-3x checked" ></span>
+ <span class="fa fa-star fa-3x checked"></span>
+ <span class="fa fa-star fa-3x checked"></span>
+ <span class="fa fa-star fa-3x" ></span>
+ <span class="fa fa-star fa-3x" ></span>
+ </div>
+ <div class="middle">
<div class="text"> Catalyst </div>
</div>
</div>
@@ -44,7 +60,15 @@
<li>
<div class="container">
<img src="https://images.squarespace-cdn.com/content/v1/5709040420c647579532dbb4/1594914119071-OWI9G22S295OCMSWL0VL/_K5L1162.jpg?format=2500w" Class="image" >
-
+ <h2> C4DI </h2>
+ <p>hhhhhhhhhhhhhhhhhhhhhhhhhhh</p>
+ <div class= star>
+ <span class="fa fa-star fa-3x checked" ></span>
+ <span class="fa fa-star fa-3x checked"></span>
+ <span class="fa fa-star fa-3x checked"></span>
+ <span class="fa fa-star fa-3x" ></span>
+ <span class="fa fa-star fa-3x" ></span>
+ </div>
<div class="middle">
<div class="text"> C4DI </div>
</div>
@@ -54,7 +78,15 @@
<li>
<div class="container">
<img src="https://dogpatchlabs.wpenginepowered.com/wp-content/uploads/2022/09/ian_browne.jpg" class="image" >
-
+ <h2> Dogpatch </h2>
+ <p>hhhhhhhhhhhhhhhhhhhhhhhhhhh</p>
+ <div class= star>
+ <span class="fa fa-star fa-3x checked" ></span>
+ <span class="fa fa-star fa-3x checked"></span>
+ <span class="fa fa-star fa-3x checked"></span>
+ <span class="fa fa-star fa-3x" ></span>
+ <span class="fa fa-star fa-3x" ></span>
+ </div>
<div class="middle">
<div class="text"> Dogpatch </div>
</div>
@@ -64,7 +96,15 @@
<li>
<div class="container">
<img src="https://stationf.co/img/misc/create-zone.jpg" class="image" >
-
+ <h2>Station F </h2>
+ <p>hhhhhhhhhhhhhhhhhhhhhhhhhhh</p>
+ <div class= star>
+ <span class="fa fa-star fa-3x checked" ></span>
+ <span class="fa fa-star fa-3x checked"></span>
+ <span class="fa fa-star fa-3x checked"></span>
+ <span class="fa fa-star fa-3x" ></span>
+ <span class="fa fa-star fa-3x" ></span>
+ </div>
<div class="middle">
<div class="text"> Station F </div>
</div>
@@ -72,8 +112,9 @@
</li>
</ul>
</div>
-
</section>
+ <footer>
+ </footer>
<script src="JS/locations.js"> </script>
</body>
diff --git a/static/locations.js b/static/locations.js
new file mode 100644
index 0000000..9c8f709
--- /dev/null
+++ b/static/locations.js
@@ -0,0 +1,10 @@
+let btn = document.querySelector("button");
+let nav = document.querySelector("nav");
+
+
+btn.addEventListener("click", function() {
+
+ nav.classList.toggle("active");
+ btn.classList.toggle("active");
+
+ } );
diff --git a/templates/OneLocation.html b/templates/OneLocation.html
new file mode 100644
index 0000000..0f02369
--- /dev/null
+++ b/templates/OneLocation.html
@@ -0,0 +1,11 @@
+{%extends "base_template.html"%}
+{%block mainblock%}
+{% with messages = get_flashed_messages() %}
+ {% if messages %}
+ {% for msg in messages %}
+ <p>{{msg}}</p>
+ {% endfor %}
+ {% endif %}
+ {% endwith %}
+ <p> {{OneLocation}} </p>
+{%endblock%}
diff --git a/templates/locations.html b/templates/locations.html
new file mode 100644
index 0000000..8ba0d77
--- /dev/null
+++ b/templates/locations.html
@@ -0,0 +1,13 @@
+{%extends "base_template.html"%}
+{%block mainblock%}
+ <form action="#" method='POST'>
+ <p>Location's name </p>
+ <p><input type='text' name='name' id='locationsName'/></p>
+ {%if data%}
+ {{data[2][1]}} <b>
+ {%endif%}
+ <p>Add the URL of the picture of your location</p>
+ <p><input type='text' name='image' id='locationsImage' /></p>
+ <p><input type='submit' value='submit' /></p>
+ </form>
+{%endblock%}
diff --git a/templates/test.html b/templates/test.html
index 1a4bf46..f3b8a8a 100644
--- a/templates/test.html
+++ b/templates/test.html
@@ -1,4 +1,4 @@
-{%extends "base_template.html"%}
+{% extends "base_template.html"%}
{%block mainblock%}
test
{%endblock%}
--
GitLab