Skip to content

Commit

Permalink
move formatting/looks code + search init
Browse files Browse the repository at this point in the history
  • Loading branch information
BlazerYoo committed Aug 9, 2024
1 parent 324ffa9 commit e4ddd23
Show file tree
Hide file tree
Showing 12 changed files with 307 additions and 205 deletions.
16 changes: 5 additions & 11 deletions chart-gen.js
Original file line number Diff line number Diff line change
@@ -1,9 +1,3 @@
// clear output
function clearStatsOutput() {
const stats = document.getElementById("stats-div");
stats.innerHTML = `<span class="loading loading-infinity loading-lg text-warning"></span>`;
}

// find variable frequencies
function extractFrequency(rooms, category) {
const frequency = rooms.reduce((acc, curr) => {
Expand All @@ -15,7 +9,7 @@ function extractFrequency(rooms, category) {
}

// find sqft bin frequencies
function Frequency(rooms, category) {
function sqftFrequency(rooms, category) {
const frequency = rooms.reduce((acc, curr) => {
acc[curr[category]] = (acc[curr[category]] || 0) + 1;
return acc;
Expand All @@ -27,16 +21,16 @@ function Frequency(rooms, category) {
// generate charts
function stats(rooms) {
document.getElementById("stats-div").innerHTML =
`<div class="chart-container"><p class="text-xl font-semibold chart-title">Colleges</p><canvas id="college-chart"></canvas></div>
`<div class="chart-container"><p class="text-xl font-semibold font-mono text-center">Colleges</p><canvas id="college-chart"></canvas></div>
<br />
<br />
<div class="chart-container"><p class="text-xl font-semibold chart-title">Buildings</p><canvas id="building-chart"></canvas></div>
<div class="chart-container"><p class="text-xl font-semibold font-mono text-center">Buildings</p><canvas id="building-chart"></canvas></div>
<br />
<br />
<div class="chart-container"><p class="text-xl font-semibold chart-title">Room Types</p><canvas id="type-chart"></canvas></div>
<div class="chart-container"><p class="text-xl font-semibold font-mono text-center">Room Types</p><canvas id="type-chart"></canvas></div>
<br />
<br />
<div class="chart-container"><p class="text-xl font-semibold chart-title">Sq. Ft.</p><canvas id="sqft-cjart"></canvas></div>`;
<div class="chart-container"><p class="text-xl font-semibold font-mono text-center">Sq. Ft.</p><canvas id="sqft-cjart"></canvas></div>`;

const collegeFrequency = extractFrequency(rooms, "college");
const buildingFrequency = extractFrequency(rooms, "building");
Expand Down
113 changes: 113 additions & 0 deletions file-parse.js
Original file line number Diff line number Diff line change
@@ -0,0 +1,113 @@
// upload file handler
export function parseFile(event) {
return new Promise((resolve, reject) => {
// set the worker
pdfjsLib.GlobalWorkerOptions.workerSrc =
"https://cdnjs.cloudflare.com/ajax/libs/pdf.js/4.5.136/pdf.worker.min.mjs";

// get file
const file = event.target.files[0];

// verify that file is pdf
if (file.type !== "application/pdf") {
alert("Please upload a PDF file.");
reject("File is not a PDF.");
return;
}

// clear output
clearTableOutput();
clearStatsOutput();

// new file reader
const reader = new FileReader();

// when file successfully read
reader.onload = function (event) {
// store raw binary data of file
const typedarray = new Uint8Array(event.target.result);

// get pdf from raw binary data
pdfjsLib.getDocument(typedarray).promise.then(function (pdf) {
// initializes array to hold promises for each page
const pagesPromises = [];

// extract room + room infos
const rooms = [];
let roomsInfoList = [];

// don't remove if
// not whitespace and not any of following:
// 'College'
// 'Building'
// 'Room'
// 'Type'
// 'Sq. Ft.'
// 'Updated'
function noRemove(item) {
return (
!/^\s*$/.test(item.str) &&
item.str !== "College" &&
item.str !== "Building" &&
item.str !== "Room" &&
item.str !== "Type" &&
item.str !== "Sq. Ft." &&
!item.str.includes("Updated") &&
item.str !== "Dorm" &&
item.str !== "Sq Foot" &&
!item.str.includes("you")
);
}

// iterate through each page
for (let pageNum = 1; pageNum <= pdf.numPages; pageNum++) {
// keep track of promises for each page (when each page gets retrieved)
pagesPromises.push(
pdf.getPage(pageNum).then(function (page) {
// get text content of each page
return page.getTextContent().then(function (textContent) {
// extract relevant room info
const roomsInPage = textContent.items
.filter(noRemove)
.map((item) => item.str)
.filter((item) => item !== "");

// organize room info
let room = {};
for (let i = 0; i < roomsInPage.length; i++) {
if (i % 5 === 0) {
room = {};
rooms.push(room);
room["college"] = roomsInPage[i];
} else if (i % 5 === 1) {
room["building"] = roomsInPage[i];
} else if (i % 5 === 2) {
room["room"] = roomsInPage[i];
} else if (i % 5 === 3) {
room["type"] = roomsInPage[i];
} else {
room["sqft"] = roomsInPage[i];
}
}
roomsInfoList = roomsInfoList.concat(roomsInPage);
});
}),
);
}

// when all pages processed
Promise.all(pagesPromises)
.then(function () {
console.log("All pages processed");
resolve(rooms);
})
.catch((error) => {
reject(error);
});
});
};

// read file to trigger load even when read complete
reader.readAsArrayBuffer(file);
});
}
29 changes: 27 additions & 2 deletions index.html
Original file line number Diff line number Diff line change
Expand Up @@ -14,6 +14,20 @@
</head>

<body class="flex flex-col min-h-screen">
<dialog open>
<p class="font-mono">
Upload the latest Available Room List pdf.
<br />
Then click on the left table column titles to sort.
<br />
Search on the right to filter.
</p>
<br />
<form class="text-center" method="dialog">
<button class="font-mono">Ok</button>
</form>
</dialog>

<header>
<div class="navbar bg-base-100">
<div class="navbar-start"></div>
Expand Down Expand Up @@ -116,8 +130,16 @@
class="flex w-full flex-col border-opacity-50"
>
<div class="card rounded-box grid h-20 place-items-center">
<div class="label">
<span class="label-text">Search to filter</span>
</div>
<label class="input input-bordered flex items-center gap-2">
<input type="text" class="grow" placeholder="Search" />
<input
id="search-query"
type="text"
class="grow"
placeholder="Search"
/>
<svg
xmlns="http://www.w3.org/2000/svg"
viewBox="0 0 16 16"
Expand Down Expand Up @@ -160,9 +182,12 @@
src="https://cdnjs.cloudflare.com/ajax/libs/pdf.js/4.5.136/pdf.min.mjs"
></script>
<script src="https://cdn.jsdelivr.net/npm/chart.js"></script>
<script src="looks.js"></script>
<script type="module" src="file-parse.js"></script>
<script src="table-gen.js"></script>
<script src="sort.js"></script>
<script src="chart-gen.js"></script>
<script src="search.js"></script>
<script type="module" src="search.js"></script>
<script type="module" src="script.js"></script>
</body>
</html>
46 changes: 46 additions & 0 deletions looks.js
Original file line number Diff line number Diff line change
@@ -0,0 +1,46 @@
function dialog() {
// brief instructions
const dialog = document.querySelector("dialog");
const closeButton = document.querySelector("dialog button");

// "Close" button closes the dialog
closeButton.addEventListener("click", () => {
dialog.close();
});

// hide output initially output initially
document.getElementById("output").style.display = "none";
}

// remove site banner
function fadeBanner() {
let banner = document.getElementById("banner");
if (banner) {
banner.classList.add("opacity-0");
setTimeout(function () {
banner.remove();
}, 500);
}
}

// clear output
function clearTableOutput() {
const table = document.getElementById("table-div");
table.innerHTML = `<span class="loading loading-infinity loading-lg text-warning"></span>`;
}

// clear output
function clearStatsOutput() {
const stats = document.getElementById("stats-div");
stats.innerHTML = `<span class="loading loading-infinity loading-lg text-warning"></span>`;
}

// remove space evenly for main justify-evenly
function removeSpacing() {
document.getElementsByTagName("main")[0].classList.remove("justify-evenly");
}

// show table etc
function showOutput() {
document.getElementById("output").style.display = "flex";
}
11 changes: 11 additions & 0 deletions package-lock.json

Some generated files are not rendered by default. Learn more about how customized files appear on GitHub.

3 changes: 3 additions & 0 deletions package.json
Original file line number Diff line number Diff line change
Expand Up @@ -2,5 +2,8 @@
"devDependencies": {
"daisyui": "^4.12.2",
"tailwindcss": "^3.4.3"
},
"dependencies": {
"fuse.js": "^7.0.0"
}
}
Loading

0 comments on commit e4ddd23

Please sign in to comment.