Skip to content

Commit

Permalink
add frequency list pages
Browse files Browse the repository at this point in the history
  • Loading branch information
geoffrey-wu committed Dec 25, 2023
1 parent d0a50d7 commit fe61c76
Show file tree
Hide file tree
Showing 6 changed files with 250 additions and 0 deletions.
119 changes: 119 additions & 0 deletions client/frequency-list/index.html
Original file line number Diff line number Diff line change
@@ -0,0 +1,119 @@
<!doctype html>
<html lang="en">

<head>
<title>QB Reader</title>
<meta charset="utf-8">
<meta name="viewport" content="width=device-width, initial-scale=1">
<meta name="description" content="Frequency lists generated on qbreader.">

<link href="/images/apple-touch-icon.png" rel="apple-touch-icon">
<link href="/images/apple-touch-icon-precomposed.png" rel="apple-touch-icon-precomposed">
<link type="image/x-icon" href="/favicon.ico" rel="icon">

<link href="/bootstrap/light.css" rel="stylesheet">
<link href="/bootstrap/dark.css" rel="stylesheet" id="custom-css">
<script src="/apply-theme.js"></script>
</head>

<body>
<nav class="navbar navbar-light navbar-expand-lg bg-custom" id="navbar" style="z-index: 10">
<div class="container-fluid">
<a class="navbar-brand ms-1 py-0" id="logo" href="/">
<span class="logo-prefix">QB</span><span class="logo-suffix">Reader</span>
</a>
<button class="navbar-toggler" data-bs-target="#navbarSupportedContent" data-bs-toggle="collapse" type="button"
aria-controls="navbarSupportedContent" aria-expanded="false" aria-label="Toggle navigation">
<span class="navbar-toggler-icon"></span>
</button>
<div class="collapse navbar-collapse" id="navbarSupportedContent">
<ul class="navbar-nav me-auto mb-2 mb-lg-0">
<li class="nav-item">
<a class="nav-link" href="/singleplayer">Singleplayer</a>
</li>
<li class="nav-item">
<a class="nav-link" href="/multiplayer">Multiplayer</a>
</li>
<li class="nav-item">
<a class="nav-link" href="/db">Database</a>
</li>
<li class="nav-item">
<a class="nav-link" href="/geoword">Geoword</a>
</li>
<li class="nav-item">
<a class="nav-link" href="/api-docs">API</a>
</li>
<li class="nav-item">
<a class="nav-link" href="/about">About</a>
</li>
<li class="nav-item">
<a class="nav-link" href="/settings">Settings</a>
</li>
</ul>
<div class="d-flex">
<ul class="navbar-nav mb-2 mb-lg-0">
<li class="nav-item">
<a class="nav-link" href="/user/login" id="login-link">Log in</a>
</li>
</ul>
</div>
</div>
</div>
</nav>

<div class="container-xl mt-3 mb-5 pb-5">
<p class="lead" id="numbering-info">
Choose a link below to view frequency lists for that subcategory:
</p>
<ul>
<li>Literature:</li>
<ul>
<li><a href="/frequency-list/american-literature">American Literature</a></li>
<li><a href="/frequency-list/british-literature">British Literature</a></li>
<li><a href="/frequency-list/classical-literature">Classical Literature</a></li>
<li><a href="/frequency-list/european-literature">European Literature</a></li>
<li><a href="/frequency-list/world-literature">World Literature</a></li>
<li><a href="/frequency-list/other-literature">Other Literature</a></li>
</ul>
<li>History:</li>
<ul>
<li><a href="/frequency-list/american-history">American History</a></li>
<li><a href="/frequency-list/ancient-history">Ancient History</a></li>
<li><a href="/frequency-list/european-history">European History</a></li>
<li><a href="/frequency-list/world-history">World History</a></li>
<li><a href="/frequency-list/other-history">Other History</a></li>
</ul>
<li>Science:</li>
<ul>
<li><a href="/frequency-list/biology">Biology</a></li>
<li><a href="/frequency-list/chemistry">Chemistry</a></li>
<li><a href="/frequency-list/physics">Physics</a></li>
<li><a href="/frequency-list/other-science">Other Science</a></li>
</ul>
<li>Fine Arts:</li>
<ul>
<li><a href="/frequency-list/visual-fine-arts">Visual Fine Arts</a></li>
<li><a href="/frequency-list/auditory-fine-arts">Auditory Fine Arts</a></li>
<li><a href="/frequency-list/other-fine-arts">Other Fine Arts</a></li>
</ul>
<li>RMPSS:</li>
<ul>
<li><a href="/frequency-list/religion">Religion</a></li>
<li><a href="/frequency-list/mythology">Mythology</a></li>
<li><a href="/frequency-list/philosophy">Philosophy</a></li>
<li><a href="/frequency-list/social-science">Social Science</a></li>
</ul>
<li>Other:</li>
<ul>
<li><a href="/frequency-list/geography">Geography</a></li>
<li><a href="/frequency-list/current-events">Current Events</a></li>
<li><a href="/frequency-list/other-academic">Other Academic</a></li>
<li><a href="/frequency-list/trash">Trash (Pop Culture)</a></li>
</ul>
</div>

<script src="/bootstrap/bootstrap.bundle.min.js"></script>
<script src="/script.js"></script>
</body>

</html>
91 changes: 91 additions & 0 deletions client/frequency-list/subcategory.html
Original file line number Diff line number Diff line change
@@ -0,0 +1,91 @@
<!doctype html>
<html lang="en">

<head>
<title>QB Reader</title>
<meta charset="utf-8">
<meta name="viewport" content="width=device-width, initial-scale=1">
<meta name="description" content="Frequency lists generated on qbreader.">

<link href="/images/apple-touch-icon.png" rel="apple-touch-icon">
<link href="/images/apple-touch-icon-precomposed.png" rel="apple-touch-icon-precomposed">
<link type="image/x-icon" href="/favicon.ico" rel="icon">

<link href="/bootstrap/light.css" rel="stylesheet">
<link href="/bootstrap/dark.css" rel="stylesheet" id="custom-css">
<script src="/apply-theme.js"></script>
</head>

<body>
<nav class="navbar navbar-light navbar-expand-lg bg-custom" id="navbar" style="z-index: 10">
<div class="container-fluid">
<a class="navbar-brand ms-1 py-0" id="logo" href="/">
<span class="logo-prefix">QB</span><span class="logo-suffix">Reader</span>
</a>
<button class="navbar-toggler" data-bs-target="#navbarSupportedContent" data-bs-toggle="collapse" type="button"
aria-controls="navbarSupportedContent" aria-expanded="false" aria-label="Toggle navigation">
<span class="navbar-toggler-icon"></span>
</button>
<div class="collapse navbar-collapse" id="navbarSupportedContent">
<ul class="navbar-nav me-auto mb-2 mb-lg-0">
<li class="nav-item">
<a class="nav-link" href="/singleplayer">Singleplayer</a>
</li>
<li class="nav-item">
<a class="nav-link" href="/multiplayer">Multiplayer</a>
</li>
<li class="nav-item">
<a class="nav-link" href="/db">Database</a>
</li>
<li class="nav-item">
<a class="nav-link" href="/geoword">Geoword</a>
</li>
<li class="nav-item">
<a class="nav-link" href="/api-docs">API</a>
</li>
<li class="nav-item">
<a class="nav-link" href="/about">About</a>
</li>
<li class="nav-item">
<a class="nav-link" href="/settings">Settings</a>
</li>
</ul>
<div class="d-flex">
<ul class="navbar-nav mb-2 mb-lg-0">
<li class="nav-item">
<a class="nav-link" href="/user/login" id="login-link">Log in</a>
</li>
</ul>
</div>
</div>
</div>
</nav>

<div class="container-xl mt-3 mb-5 pb-5">
<p class="">
<span class="lead" id="numbering-info">
The 100 most frequent answers in <span id="subcategory-name"></span> questions:
</span>
<span class="float-end" id="numbering-info">
<a href="/frequency-list">Back to all frequency lists</a>
</span>
</p>
<table class="table table-hover">
<thead>
<tr>
<th scope="col">#</th>
<th scope="col">Answer</th>
<th scope="col">Frequency</th>
</tr>
</thead>
<tbody class="table-group-divider" id="frequency-list"></tbody>
</table>
<div class="d-block mx-auto mt-3 spinner-border" role="status"><span class="d-none">Loading...</span></div>
</div>

<script src="/bootstrap/bootstrap.bundle.min.js"></script>
<script src="/frequency-list/subcategory.js"></script>
<script src="/script.js"></script>
</body>

</html>
23 changes: 23 additions & 0 deletions client/frequency-list/subcategory.js
Original file line number Diff line number Diff line change
@@ -0,0 +1,23 @@
function titleCase(name) {
return name.replace(/-/g, ' ').replace(/\b\w/g, l => l.toUpperCase());
}

const subcategory = titleCase(window.location.pathname.split('/').at(-1));
document.getElementById('subcategory-name').textContent = subcategory;

fetch(`/api/frequency-list?subcategory=${subcategory}`)
.then(response => response.json())
.then(response => {
const { frequencyList } = response;
const table = document.getElementById('frequency-list');

for (const index in frequencyList) {
const { answer, count } = frequencyList[index];
const row = table.insertRow();
row.insertCell().textContent = parseInt(index) + 1;
row.insertCell().textContent = answer;
row.insertCell().textContent = count;
}

document.getElementsByClassName('spinner-border')[0].remove();
});
3 changes: 3 additions & 0 deletions client/index.html
Original file line number Diff line number Diff line change
Expand Up @@ -113,6 +113,9 @@ <h3>Feature of the Day:</h3>
<p>
Check out your <a href="/geoword">geoword</a> category stats by going to the stats page for a packet!
</p>
<p>
Check out <b>frequency lists</b> for the qbreader database <a href="/frequency-list">here</a>!
</p>
</blockquote>
</div>

Expand Down
12 changes: 12 additions & 0 deletions routes/frequency-list.js
Original file line number Diff line number Diff line change
@@ -0,0 +1,12 @@
import { Router } from 'express';
const router = Router();

router.get('/', (req, res) => {
res.sendFile('index.html', { root: './client/frequency-list' });
});

router.get('/:subcategory', (req, res) => {
res.sendFile('subcategory.html', { root: './client/frequency-list' });
});

export default router;
2 changes: 2 additions & 0 deletions routes/index.js
Original file line number Diff line number Diff line change
Expand Up @@ -5,6 +5,7 @@ import apiDocsRouter from './api-docs.js';
import authRouter from './auth/index.js';
import backupsRouter from './backups.js';
import databaseRouter from './database.js';
import frequencyListRouter from './frequency-list.js';
import geowordRouter from './geoword/index.js';
import multiplayerRouter from './multiplayer.js';
import settingsRouter from './settings.js';
Expand Down Expand Up @@ -97,6 +98,7 @@ router.use('/api-docs', apiDocsRouter);
router.use('/auth', authRouter);
router.use('/backups', backupsRouter);
router.use('/db', databaseRouter);
router.use('/frequency-list', frequencyListRouter);
router.use('/geoword', geowordRouter);
router.use('/multiplayer', multiplayerRouter);
router.use('/settings', settingsRouter);
Expand Down

0 comments on commit fe61c76

Please sign in to comment.