Compare commits

...

16 commits

Author SHA1 Message Date
e5b3ce76a1 added homepage link 2024-10-20 18:11:52 +02:00
92c2284e8a updated packages 2024-10-20 18:11:42 +02:00
5161aa23d0 updated deps 2024-09-15 01:19:01 +02:00
610937910c fixed date range 2024-08-27 18:35:58 +02:00
4e94fa0566 updated deps 2024-08-27 18:35:42 +02:00
af799015a7 added analytics tracking 2024-08-18 05:29:33 +02:00
441e3d5dec updated dependencies 2023-12-30 16:38:16 +01:00
b1760b1031 Added page title 2023-12-30 16:37:52 +01:00
Jonas_Jones
6a99c640b8 Updated dependencies 2023-12-15 04:15:15 +01:00
Jonas_Jones
b23050cc85 Fixed name
'type' >> 'types' as it is more suitable
2023-12-15 04:10:41 +01:00
Jonas_Jones
2dd4d557a3 updated dependencies 2023-12-12 16:59:24 +01:00
Jonas_Jones
651028bef6 Fixed release type display 2023-12-02 17:03:31 +01:00
Jonas_Jones
0e4a2e3ed4 Fixed release type dropdown
Fixed duplicates of the release types and improved loading speeds
2023-12-02 16:48:58 +01:00
Jonas_Jones
e1e70bcfdc Fixed bugs
- Added "Loading..." indicator before data loads in
- Added Last Update indicator
- Fixed release types
- Fixed release type filtering
2023-12-01 22:14:18 +01:00
Jonas_Jones
1e1c7bc7c6 updated package dependencies 2023-12-01 20:48:29 +01:00
Jonas_Jones
d5a2e95ee5 Fixed package name and updated deps 2023-11-01 21:36:01 +01:00
3 changed files with 720 additions and 497 deletions

1140
package-lock.json generated

File diff suppressed because it is too large Load diff

View file

@ -1,5 +1,6 @@
<script>
import { onMount } from "svelte";
import { recordRequest } from "./analytics";
let releases = [];
let searchArtist = "";
@ -13,6 +14,8 @@
let releaseTypes = [];
let totalPages = 1;
let pages = [];
let last_update = "Loading...";
let loading = "Loading...";
function sortByColumn(column) {
// Sort releases based on the selected column
@ -36,12 +39,13 @@
.includes(searchTitle.toLowerCase());
const releaseTypeMatch =
selectedRelease === "" ||
(release.releaseType === null
(release.types === null
? "Unknown"
: release.releaseType) === selectedRelease;
: release.types) === selectedRelease ||
release.types.includes(selectedRelease);
const dateMatch =
(!startDate || new Date(release.date) >= startDate) &&
(!endDate || new Date(release.date) <= endDate);
(!startDate || new Date(release.date) >= new Date(startDate)) &&
(!endDate || new Date(release.date) <= new Date(endDate));
return artistMatch && titleMatch && releaseTypeMatch && dateMatch;
});
@ -68,20 +72,33 @@
}
onMount(async () => {
recordRequest();
try {
const response = await fetch('https://cdn.jonasjones.dev/api/kcomebacks/data.json');
const response = await fetch('https://cdn.jonasjones.dev/api/kcomebacks/rkpop_data.json');
//const response = await fetch('/rkpop_data.json')
if (response.ok) {
releases = await response.json();
last_update = releases[0].last_update;
releases.shift();
// Extract unique release types from the releases array
releaseTypes = Array.from(new Set(releases.map(release => {
return release.releaseType === null ? 'Unknown' : release.releaseType;
return release.types === null ? 'Unknown' : release.types;
})));
// releaseTypes should be an array of all elements of all the release.types lists of all releases
releaseTypes = releaseTypes.flat();
// eliminate duplicates
releaseTypes = [...new Set(releaseTypes)];
// Sort releases by date from most recent to least recent
releases.sort((a, b) => new Date(b.date) - new Date(a.date));
filterReleases(); // Initial filtering based on default values
loading = "";
} else {
console.error('Failed to fetch data:', response.status);
}
@ -91,7 +108,10 @@
});
</script>
<title>K-Pop Comebacks</title>
<div class="container">
<a href="https://jonasjones.dev" style="color: white;position:absolute;right:20px;text-decoration:underline" >Homepage -></a>
<div class="title-banner">
<h1 class="title">K-Comebacks</h1>
</div>
@ -194,6 +214,7 @@
</div>
</div>
<p>Click on the column title to filter by them</p>
<p>Last updated: {last_update}</p>
<table>
<thead>
<tr>
@ -201,26 +222,28 @@
<th on:click={() => sortByColumn("date")}>Date</th>
<th on:click={() => sortByColumn("artist")}>Artist</th>
<th on:click={() => sortByColumn("title")}>Title</th>
<th on:click={() => sortByColumn("releaseType")}>Release Type</th>
<th on:click={() => sortByColumn("type")}>Release Types</th>
</tr>
</thead>
<tbody>
{#each filteredReleases as release}
<tr>
<!--calculate the release number-->
<td>{releases.indexOf(release) + 1}</td>
<td>{releases.length - releases.indexOf(release)}</td>
<td>{release.date}</td>
<td>{release.artist}</td>
<td>{release.title}</td>
<td
>{release.releaseType === null
>{release.types === null
? "Unknown"
: release.releaseType}</td
// show the release.types list as a comma separated string
: release.types.join(", ")}</td
>
</tr>
{/each}
</tbody>
</table>
<h1>{loading}</h1>
</div>
<style>

34
src/routes/analytics.js Normal file
View file

@ -0,0 +1,34 @@
// Function to record the request with analytics
export async function recordRequest() {
const analyticsData = {
timestamp: Date.now(),
domain: window.location.hostname,
method: 'GET', // Assuming the request method is GET; adjust as necessary
path: window.location.pathname,
};
console.log('Recording request:', analyticsData);
const ANALYTICS_URL = 'https://analytics.jonasjones.dev/requests/record/ipunknown';
const ANALYTICS_API_KEY = import.meta.env.VITE_ANALYTICS_API_KEY;
try {
const response = await fetch(ANALYTICS_URL, {
method: 'POST',
headers: {
'Content-Type': 'application/json',
'Authorization': ANALYTICS_API_KEY,
},
body: JSON.stringify(analyticsData),
});
if (response.ok) {
console.log('Request recorded successfully');
} else {
console.error('Failed to record request:', response.status, await response.text());
}
} catch (error) {
console.error('Error recording request:', error);
}
}