Skip to content

aaaaaaaaaaaaaaa #19

New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

Sign up for GitHub

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Open
ryankwan7 wants to merge 1 commit into
base: main
Choose a base branch
from
Open

aaaaaaaaaaaaaaa #19

Show file tree
Hide file tree
Changes from all commits
Commits
Show all changes
1 commit
Select commit
File filter

Filter by extension

Filter by extension
Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
6 changes: 4 additions & 2 deletions index.html → public/index.html
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -327,11 +327,13 @@ <h2>Simon Fraser University / FAS</h2>
<span class="slip-col">Moneyline</span>
</header>

<!-- faculty is hardcoded -->

<div class="event">
<div class="teams">
<div class="team" id="team1"></div>
<!-- <div class="team" id="team1"></div>
<div class="vs">vs</div>
<div class="team" id="team2"></div>
<div class="team" id="team2"></div> -->
</div>

<div class="odds">
Expand Down
290 changes: 145 additions & 145 deletions login.html → public/login.html
View file
Open in desktop
Original file line number Diff line number Diff line change
@@ -1,145 +1,145 @@
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="utf-8" />
<meta name="viewport" content="width=device-width, initial-scale=1" />
<title>Log in • Study-Better</title>
<style>
:root{
/* reuse your header color */
--header-bg: #2F3061; /* same as your main site */
--accent: darkorange; /* for the Log in button hover etc. */
}
/* page colors */
html, body { height: 100%; }
body {
margin: 0;
font: 16px/1.5 system-ui, -apple-system, Segoe UI, Roboto, Arial, sans-serif;
background: #ffffff; /* white background */
color: #111;
display: grid;
grid-template-rows: auto 1fr;
}
/* header */
header{
background: var(--header-bg);
color: #fff;
padding: 12px 16px;
text-align: center;
font-size: large;
}
/* headline centered above the form */
.intro{
text-align: center;
margin: 2rem 0 1.25rem;
font-weight: 600;
font-size: 1.25rem;
}
/* card-like form */
.card{
width: min(520px, 92vw);
margin: 0 auto;
background: #f7f7f9;
border: 1px solid #e5e7eb;
border-radius: 12px;
padding: 1.25rem;
box-shadow: 0 10px 24px rgba(0,0,0,.06);
}
form{ display: grid; gap: 0.9rem; }
label span{
display:block;
margin-bottom: 0.35rem;
font-size: 0.95rem;
color: #333;
font-weight: 600;
}
input[type="text"], input[type="password"]{
width: 100%;
padding: 0.65rem 0.75rem;
border-radius: 10px;
border: 1px solid #d1d5db;
background: #fff;
color: #111;
outline: none;
}
input:focus{
border-color: var(--header-bg);
box-shadow: 0 0 0 3px color-mix(in oklab, var(--header-bg) 20%, transparent);
}
.actions{
display: flex; gap: .75rem; justify-content: center; margin-top: .5rem;
}
.btn{
border: 1px solid #d1d5db;
background: #fff;
padding: .6rem 1rem;
border-radius: 10px;
cursor: pointer;
}
.btn.primary{
background: var(--header-bg);
color: #fff;
border-color: var(--header-bg);
}
.btn.primary:hover{ filter: brightness(1.08); }
.btn:active{ transform: translateY(1px); }
/* tiny footer link back */
.small{
text-align: center;
margin-top: 1rem;
font-size: .9rem;
}
.small a{ color: var(--header-bg); text-decoration: none; }
.small a:hover{ text-decoration: underline; }
</style>
</head>
<body>
<header>
<div class="wrap"><strong>Study-Better</strong></div>
</header>
<main class="wrap">
<div class="intro">Please log in to continue</div>
<div class="card" role="form" aria-labelledby="login-title">
<form id="loginForm" novalidate>
<label>
<span>Username</span>
<input type="text" name="username" autocomplete="username" required />
</label>
<label>
<span>Password</span>
<input type="password" name="password" autocomplete="current-password" required />
</label>
<div class="actions">
<button type="submit" class="btn primary">Log in</button>
<button type="button" class="btn" onclick="history.back()">Cancel</button>
</div>
</form>
<div class="small">Back to <a href="index.html">home</a></div>
</div>
</main>
<script>
// Temporary: client-side guard so you can test without a backend.
const form = document.getElementById('loginForm');
form.addEventListener('submit', (e) => {
e.preventDefault();
const data = Object.fromEntries(new FormData(form).entries());
if(!data.username?.trim() || !data.password?.trim()){
alert('Please fill in both username and password.');
return;
}
// TODO: replace with a real POST to your backend
alert('Login form submitted (stub). You will wire this to a backend later.');
});
</script>
</body>
</html>
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="utf-8" />
<meta name="viewport" content="width=device-width, initial-scale=1" />
<title>Log in • Study-Better</title>
<style>
:root{
/* reuse your header color */
--header-bg: #2F3061; /* same as your main site */
--accent: darkorange; /* for the Log in button hover etc. */
}

/* page colors */
html, body { height: 100%; }
body {
margin: 0;
font: 16px/1.5 system-ui, -apple-system, Segoe UI, Roboto, Arial, sans-serif;
background: #ffffff; /* white background */
color: #111;
display: grid;
grid-template-rows: auto 1fr;
}

/* header */
header{
background: var(--header-bg);
color: #fff;
padding: 12px 16px;
text-align: center;
font-size: large;
}

/* headline centered above the form */
.intro{
text-align: center;
margin: 2rem 0 1.25rem;
font-weight: 600;
font-size: 1.25rem;
}

/* card-like form */
.card{
width: min(520px, 92vw);
margin: 0 auto;
background: #f7f7f9;
border: 1px solid #e5e7eb;
border-radius: 12px;
padding: 1.25rem;
box-shadow: 0 10px 24px rgba(0,0,0,.06);
}
form{ display: grid; gap: 0.9rem; }

label span{
display:block;
margin-bottom: 0.35rem;
font-size: 0.95rem;
color: #333;
font-weight: 600;
}
input[type="text"], input[type="password"]{
width: 100%;
padding: 0.65rem 0.75rem;
border-radius: 10px;
border: 1px solid #d1d5db;
background: #fff;
color: #111;
outline: none;
}
input:focus{
border-color: var(--header-bg);
box-shadow: 0 0 0 3px color-mix(in oklab, var(--header-bg) 20%, transparent);
}

.actions{
display: flex; gap: .75rem; justify-content: center; margin-top: .5rem;
}
.btn{
border: 1px solid #d1d5db;
background: #fff;
padding: .6rem 1rem;
border-radius: 10px;
cursor: pointer;
}
.btn.primary{
background: var(--header-bg);
color: #fff;
border-color: var(--header-bg);
}
.btn.primary:hover{ filter: brightness(1.08); }
.btn:active{ transform: translateY(1px); }

/* tiny footer link back */
.small{
text-align: center;
margin-top: 1rem;
font-size: .9rem;
}
.small a{ color: var(--header-bg); text-decoration: none; }
.small a:hover{ text-decoration: underline; }
</style>
</head>
<body>
<header>
<div class="wrap"><strong>Study-Better</strong></div>
</header>

<main class="wrap">
<div class="intro">Please log in to continue</div>

<div class="card" role="form" aria-labelledby="login-title">
<form id="loginForm" novalidate>
<label>
<span>Username</span>
<input type="text" name="username" autocomplete="username" required />
</label>
<label>
<span>Password</span>
<input type="password" name="password" autocomplete="current-password" required />
</label>
<div class="actions">
<button type="submit" class="btn primary">Log in</button>
<button type="button" class="btn" onclick="history.back()">Cancel</button>
</div>
</form>
<div class="small">Back to <a href="index.html">home</a></div>
</div>
</main>

<script>
// Temporary: client-side guard so you can test without a backend.
const form = document.getElementById('loginForm');
form.addEventListener('submit', (e) => {
e.preventDefault();
const data = Object.fromEntries(new FormData(form).entries());
if(!data.username?.trim() || !data.password?.trim()){
alert('Please fill in both username and password.');
return;
}
// TODO: replace with a real POST to your backend
alert('Login form submitted (stub). You will wire this to a backend later.');
});
</script>
</body>
</html>
0 mybets.html → public/mybets.html
View file
Open in desktop
File renamed without changes.
24 changes: 16 additions & 8 deletions script.js → public/script.js
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -135,7 +135,8 @@ function getBetsForCurrentUser() {
return bets.filter((b) => b.betterId === currentUser.id);
}

function fillFromGroup(betsIndex = 0) {
// faculty is a text input
function fillFromGroup(faculty) {
if (!bets.length) {
console.warn("No bets available yet.");
return;
Expand All @@ -144,12 +145,19 @@ function fillFromGroup(betsIndex = 0) {
const container = document.getElementById("teams");
container.innerHTML = ""; // clear old stuff

bets.forEach(bet => {
const s1 = getStudentById(bets.sid1);
const s2 = getStudentById(bets.sid2);
const filteredBets = bets.filter(bet => bet.faculty.toLowerCase() === 'fas'); // hardcoded for now
if (!filteredBets.length) {
container.innerHTML = `<p>No bets available for faculty: ${faculty}</p>`;
return;
}


filteredBets.forEach(bet => {
const s1 = getStudentById(bet.sid1);
const s2 = getStudentById(bet.sid2);

if (!s1 || !s2) {
console.warn("Missing student for group", group.id);
console.warn("Missing student for the bet", bet.id);
return;
}

Expand All @@ -160,11 +168,11 @@ function fillFromGroup(betsIndex = 0) {
<div class="teams">
<div class="team">${s1.first_name} ${s1.last_name} – ${bet.desc1}</div>
<div class="vs">vs</div>
<div class="team">${s2.first_name} ${s2.last_name} – ${group.desc2}</div>
<div class="team">${s2.first_name} ${s2.last_name} – ${bet.desc2}</div>
</div>
<div class="odds">
<button class="odd-btn pos" onclick="placeBet(${group.id}, ${s1.id}, 50)">+300</button>
<button class="odd-btn neg" onclick="placeBet(${group.id}, ${s2.id}, 50)">-200</button>
<button class="odd-btn pos">+300</button>
<button class="odd-btn neg">-200</button>
</div>
`;

Expand Down
Loading