Added django templates and dynamic pages
This commit is contained in:
Allen
117
frontend/templates/buy.html
Normal file
117
frontend/templates/buy.html
Normal 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>
|
||||
<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>© 2023 SeatStock V. All rights reserved. </p>
|
||||
</footer>
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
</body>
|
||||
</html>
|
||||
128
frontend/templates/index.html
Normal file
128
frontend/templates/index.html
Normal 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>
|
||||
|
||||
134
frontend/templates/sell.html
Normal file
134
frontend/templates/sell.html
Normal 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>© 2023 SeatStock V. All rights reserved. </p>
|
||||
</footer>
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
</body>
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
</html>
|
||||
75
frontend/templates/signin.html.old
Normal file
75
frontend/templates/signin.html.old
Normal 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>© 2023 SeatStock V. All rights reserved. </p>
|
||||
</footer>
|
||||
</body>
|
||||
|
||||
|
||||
</html>
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
70
frontend/templates/signup.html.old
Normal file
70
frontend/templates/signup.html.old
Normal 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>© 2023 SeatStock V. All rights reserved. </p>
|
||||
</footer>
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
</body>
|
||||
</html>
|
||||
113
frontend/templates/tickets.html
Normal file
113
frontend/templates/tickets.html
Normal 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>
|
||||
Reference in New Issue
Block a user