Skip to content
Snippets Groups Projects
Commit a66ff61b authored by Zainab Almeshari's avatar Zainab Almeshari
Browse files

form, templating, database connection and some CSS updates

parent 9c7255d5
No related branches found
No related tags found
3 merge requests!58Resolve "As a user I want to view a list of all locations available",!50ZAINABS work + my basic list locations page and route to help with this issue,!46form, templating, database connection and some CSS updates
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"
......
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)
......@@ -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
......
......@@ -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>
let btn = document.querySelector("button");
let nav = document.querySelector("nav");
btn.addEventListener("click", function() {
nav.classList.toggle("active");
btn.classList.toggle("active");
} );
{%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%}
{%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%}
{%extends "base_template.html"%}
{% extends "base_template.html"%}
{%block mainblock%}
test
{%endblock%}
0% Loading or .
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment