Added django templates and dynamic pages

This commit is contained in:
Allen
2023-09-23 23:02:36 -05:00
parent 2834da98c1
commit 3916475c54
24 changed files with 1696 additions and 1 deletions

117
frontend/templates/buy.html Normal file
View File

@ -0,0 +1,117 @@
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>SeatStock</title>
<link rel="stylesheet" href="static/style.css">
<script src="static/script.js"></script>
</head>
<body>
<!-- ******************** HEADER ************ -->
<logo><a href="index.html">SeatStock</a></logo>
<signinButton><a href="signin.html">Sign In</a></signinButton>
<faqButton><a href="FAQ.html">How it Works</a></faqButton>
<tixButton><a href="tickets.html">Your Tickets</a></tixButton>
<!-- *********************** BODY *********** -->
<div class="buy-body">
<div class="buy-game-title" id="buy-game-title"></div>
<script>
const game = new URLSearchParams(window.location.search).get("game");
console.log(game);
const game_title = document.getElementById("buy-game-title");
if (game === "iowavmichiganst") {
game_title.textContent = "Iowa vs Michigan State"
} else if (game === "iowavrutgers") {
game_title.textContent = "Iowa vs Rutgers"
} else if (game === "iowavpurdue") {
game_title.textContent = "Iowa vs Purdue"
} else if (game === "iowavminnesota") {
game_title.textContent = "Iowa vs Minnesota"
}
</script>
<div class="buy-game-info">Sat Sep 30, Time TBD · Kinnick Stadium, Iowa City, Iowa</div><br>
<br>
<img src="static/icons/stadiumicon.png" class="buy-stadium-icon">
<br><br>
<div class="buy-bid-button-container">
<button class="place-bid-button">Bid</button>
<button class="buy-button">Buy</button>
</div>
<div class="bid-container">
<form id="sell-Ticket" class="stuff" method="post">
<input type="text" id="bid" placeholder="Bid Amount"name="price" required>
</form>
</div>
<br>
<div class="price-box">
<div class="subtotal">
<div class="subtotal-title">Subtotal</div>
<div class="subtotal-amount">$36.13</div>
</div>
<div class="purchase-price">
<div class="purchase-price-title">Purchase Price</div>
<div class="purchase-price-amount">$32.00</div>
</div>
<div class="transaction-fee">
<div class="transaction-fee-title">Transaction Fee (10%)</div>
<div class="transaction-fee-amount">+$3.20</div>
</div>
<div class="processing-fee">
<div class="purchase-price-title">Processing Fee</div>
<div class="purchase-price-amount">+$0.93</div>
</div>
</div>
<br><br>
<div class="agree-container">
<label for="myCheckbox" class="checkbox-label">I agree to the</label>&nbsp;
<a href="static/termsofservice.html" class="terms-of-service">Terms of Service</a>
<input type="checkbox" id="myCheckbox" name="myCheckbox">
</div>
</div>
<!-- ******************* FOOTER******************** **** -->
<br><br><br><br><br><br><br><br><br><br><br><br>
<br><br><br><br><br><br><br><br><br><br><br><br>
<br><br><br><br><br><br><br><br><br><br><br><br>
<br><br><br><br><br><br><br>
<footer>
<p>&copy; 2023 SeatStock V. All rights reserved. </p>
</footer>
</body>
</html>

View File

@ -0,0 +1,128 @@
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewpoint" content="width=device-width, initial-scale=1.0">
<title>SeatStock</title>
<link rel="stylesheet" href="static/style.css">
<script type="text/javascript" src="static/script.js"></script>
</head>
<body>
<!--************************ HEADER ****************-->
<logo><a href="index.html">SeatStock</a></logo>
{% if session %}
<signinButton><a href="logout">({{ session.userinfo.name }}) Sign Out</a></signinButton>
{% else %}
<signinButton><a href="login">Sign In</a></signinButton>
{% endif %}
<faqButton><a href="static/FAQ.html">How it Works</a></faqButton>
<tixButton><a href="tickets.html">Your Tickets</a></tixButton>
<!--************************ BODY ****************-->
<br><br>
<div class="home-info-title1">
<b>Buy, sell, or exchange even ticets with ease in the industry's
first safe ticket exchange marketplace for students.</b>
</div>
<div class="search-container">
<input type="text" id="searchInput" placeholder="Search...">
<button class="search-button">Search</button>
</div>
<br><br>
<div class="home-info-title2">
<b>Upcoming Games:</b>
</div>
<div class="home-info-title3">
University of Iowa
</div>
<div class="box">
<img src="static/gameimages/iowavmichiganst.png" class="game-window-image">
<div class="game-window-title">Iowa Vs. Michigan St</div><br>
<button class="buy-or-bid" onclick="check_sign_in('iowavmichiganst')">Buy $55 or Bid</a>
<a href="sell.html?game=iowavmichiganst" class="sell-home">Sell</a> <br><br><br>
<marketData><a href="https://www.example.com">Market Data</a></marketData>
</div>
<div class="box">
<img src="static/gameimages/iowavpurdue.png" class="game-window-image">
<div class="game-window-title">Iowa Vs. Purdue</div>
<button class="buy-or-bid" onclick="check_sign_in('iowavpurdue')">Buy $25<br>or Bid</button>
<a href="sell.html?game=iowavpurdue" class="sell-home">Sell</a> <br>
<marketData><a href="https://www.example.com">Market Data</a></marketData>
</div>
<div class="box">
<img src="static/gameimages/iowavminnesota.png" class="game-window-image">
<div class="game-window-title">Iowa Vs. Minnesota</div>
<button class="buy-or-bid" onclick="check_sign_in('iowavminnesota')">Buy $45<br>or Bid</button>
<a href="sell.html?game=iowavminnesota" class="sell-home">Sell</a> <br><br>
<marketData><a href="https://www.example.com">Market Data</a></marketData>
</div>
<div class="box">
<img src="static/gameimages/iowavrutgers.png" class="game-window-image">
<div class="game-window-title">Iowa Vs Rutgers</div>
<button class="buy-or-bid" onclick="check_sign_in('iowavrutgers')">Buy $20<br>or Bid</button>
<a href="sell.html?game=iowavrutgers" class="sell-home">Sell</a> <br><br>
<marketData><a href="https://www.example.com">Market Data</a></marketData>
</div>
<!-- **************** FOOTER******************** **** -->
<footer>
<br><br><br><br><br>
</footer>
</body>
</html>

View File

@ -0,0 +1,134 @@
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>SeatStock</title>
<link rel="stylesheet" href="style.css">
<script src="static/script.js"></script>
</head>
<body>
<!-- ******************** HEADER ************ -->
<logo><a href="index.html">SeatStock</a></logo>
<signinButton><a href="login">Sign In</a></signinButton>
<faqButton><a href="static/FAQ.html">How it Works</a></faqButton>
<tixButton><a href="tickets.html">Your Tickets</a></tixButton>
<!-- *********************** BODY *********** -->
<div class="sell-body">
<div class="sell-game-title" id="sell-game-title"></div><br>
<form id="sell-Ticket" class="stuff" method="post">
<br>
<img src="static/icons/stadiumicon.png" class="buy-stadium-icon"><br><br> <br>
<input type="text" id="price" placeholder="Price" required><br><br>
<input type="submit" class="submit-price" value="Submit">
</form>
<!-- *********************** SCRIPT *********** -->
<script>
const game = new URLSearchParams(window.location.search).get("game");
console.log(game);
const game_title = document.getElementById("sell-game-title");
if (game === "iowavmichiganst") {
game_title.textContent = "Iowa vs Michigan State"
} else if (game === "iowavrutgers") {
game_title.textContent = "Iowa vs Rutgers"
} else if (game === "iowavpurdue") {
game_title.textContent = "Iowa vs Purdue"
} else if (game === "iowavminnesota") {
game_title.textContent = "Iowa vs Minnesota"
}
</script>
</div>
<!-- ******************* FOOTER ******************** **** -->
<br><br><br><br><br><br><br><br><br><br><br><br>
<br><br><br><br><br><br><br><br><br><br><br><br>
<br><br><br><br><br><br><br><br><br><br><br><br>
<br><br><br><br><br><br><br>
<footer>
<p>&copy; 2023 SeatStock V. All rights reserved. </p>
</footer>
</body>
</html>

View File

@ -0,0 +1,75 @@
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>SeatStock</title>
<link rel="stylesheet" href="style.css">
<script src="script.js"></script>
<link rel="icon" type="image/png" href="/favicon.png" sizes="32x32">
<link rel="icon" type="image/vnd.microsoft.icon" href="/favicon.ico" sizes="16x16">
</head>
<body>
<!-- *************** HEADER ******************** **** -->
<logo><a href="index.html">SeatStock</a></logo>
<signinButton><a href="signin.html">Sign In</a></signinButton>
<faqButton><a href="FAQ.html">How it Works</a></faqButton>
<tixButton><a href="tickets.html">Your Tickets</a></tixButton>
<!-- ************* BODY ******************** **** -->
<div class="signin-body">
<div class="form-name"><br>Sign In</div>
<div class="form-name-subtitle">Log in for secure transactions.</div>
<form action="./index.html" class="stuff" method="post">
<input type="text" placeholder="Email" id="username" name="username" required><br><br>
<input type="password" placeholder="Password" id="password" name="password" required><br><br>
<div class="remember-me-container">
<input type="checkbox" class="sign-in-checkbox" name="myCheckbox">
<label for="myCheckbox" class="sign-in-checkbox-label">Remember Me</label> </label>
</div>
<div class="sign-in-button-container">
<button class="sign-in-button" onclick="set_user_signed_in()">Sign In</button>
</div>
<a class="sign-up-link" href="signup.html">Sign Up</a>
</form>
<br>
</div>
<br><br><br><br><br><br><br><br><br><br><br><br>
<br><br><br><br><br><br><br><br><br><br><br><br><br>
<br><br><br><br><br><br><br>
<footer>
<p>&copy; 2023 SeatStock V. All rights reserved. </p>
</footer>
</body>
</html>

View File

@ -0,0 +1,70 @@
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>SeatStock</title>
<link rel="stylesheet" href="style.css">
<script src="script.js"></script>
<link rel="icon" type="image/png" href="/favicon.png" sizes="32x32">
<link rel="icon" type="image/vnd.microsoft.icon" href="/favicon.ico" sizes="16x16">
</head>
<body>
<!-- *************** HEADER ******************** **** -->
<logo><a href="index.html">SeatStock</a></logo>
<signinButton><a href="signin.html">Sign In</a></signinButton>
<faqButton><a href="FAQ.html">How it Works</a></faqButton>
<tixButton><a href="tickets.html">Your Tickets</a></tixButton>
<!-- ************* BODY ******************** **** -->
<div class="signup-body">
<div class="form-name"><br>Register</div>
<div class="form-name-subtitle">Join other verified students.</div>
<form action="./index.html" class="stuff" method="post">
<input type="text" placeholder="First Name" id="firstname" name="firstname" required><br><br>
<input type="text" placeholder="Last Name" id="lastname" name="lastname" required><br><br>
<input type="text" placeholder="Student Email" id="email" name="email" required><br><br>
<input type="text" placeholder="Phone Number" id="phone" name="phone" required><br><br>
<input type="password" placeholder="Password" id="password" name="password" required><br><br>
<input type="password" placeholder="Confirm Password" id="password" name="password" required><br><br>
<div class="promotion-container">
<input type="checkbox" class="promotion-checkbox" name="myCheckbox">
<label for="myCheckbox" class="promotion-checkbox-label">I want to be emailed about special promotions and deals</label> </label>
</div>
<div class="terms-container">
<input type="checkbox" class="terms-checkbox" name="myCheckbox">
<label for="myCheckbox" class="terms-checkbox-label">I have read and agree to the terms and conditions</label> </label>
</div>
<div class="sign-in-button-container">
<button class="sign-up-button" onclick="set_user_signed_in()">Sign Up</button>
</div>
</form>
</div>
<br><br><br><br><br><br><br><br><br><br><br><br>
<br><br><br><br><br><br><br><br><br><br><br><br><br>
<br><br><br><br><br><br><br><br><br><br><br><br><br><br>
<br><br><br><br><br><br><br>
<footer>
<p>&copy; 2023 SeatStock V. All rights reserved. </p>
</footer>
</body>
</html>

View File

@ -0,0 +1,113 @@
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>SeatStock</title>
<link rel="stylesheet" href="style.css">
<script src="static/script.js"></script>
</head>
<body>
<!--************************ HEADER *********************-->
<logo><a href="index.html">SeatStock</a></logo>
<signinButton><a href="login">Sign In</a></signinButton>
<faqButton><a href="static/FAQ.html">How it Works</a></faqButton>
<tixButton><a href="tickets.html">Your Tickets</a></tixButton>
<!--************************** BODY ***********************-->
<div class="tab">
<button class="tablinks" onclick="openCity(event, 'Tickets')">Tickets</button>
<button class="tablinks" onclick="openCity(event, 'Active-Bids')">Active Bids</button>
<button class="tablinks" onclick="openCity(event, 'Active-Asks')">Active Asks</button>
<button class="tablinks" onclick="openCity(event, 'History')">History</button>
</div>
<div id="Tickets" class="tabcontent">
<h3>London</h3>
<p>London is the capital city of England.</p>
</div>
<div id="Active-Bids" class="tabcontent">
<h3>Paris</h3>
<p>Paris is the capital of France.</p>
</div>
<div id="Active-Asks" class="tabcontent">
<h3>Tokyo</h3>
<p>Tokyo is the capital of Japan.</p>
</div>
<div id="History" class="tabcontent">
<h3>Tokyo</h3>
<p>Tokyo is the capital of Japan.</p>
</div>
<!--************************ SCRIPT ****************-->
<script>
function openCity(evt, cityName) {
var i, tabcontent, tablinks;
tabcontent = document.getElementsByClassName("tabcontent");
for (i = 0; i < tabcontent.length; i++) {
tabcontent[i].style.display = "none";
}
tablinks = document.getElementsByClassName("tablinks");
for (i = 0; i < tablinks.length; i++) {
tablinks[i].className = tablinks[i].className.replace(" active", "");
}
document.getElementById(cityName).style.display = "block";
evt.currentTarget.className += " active";
}
</script>
</body>
</html>