Files
jacuzzi/frontend/js/hottubBackup.js
Simon d4ed9dce5d Browse favorites like a listing, sorted, and page them as you scroll
Favorites now carry `favoriteDate`. Ones saved before this had no way of
knowing when they were saved, so they are all stamped with the moment the
client first reads them -- they sort together as one batch, at the point
favorites learned to keep dates. An import brings the date the other client
recorded instead, so a restored library keeps its history.

The bar used to build a card per favorite, which an import of several
hundred made an expensive way to open the app. It now renders a screenful
and appends more as the strip is scrolled.

"Browse all" turns the whole grid into favorites: the same cards, the same
virtualized masonry, the same infinite scroll and reels mode as a channel
listing -- App.videos.loadVideos simply pages out of localStorage instead of
the server while that view is open. Sort applies to the bar and the grid
together: recently added (default), oldest, title, longest, shortest, and a
shuffle for rediscovering a long list.

Tests (scratchpad): dates backfilled onto undated favorites, the bar paging
as it scrolls rather than building every card, the grid paging to the full
list with zero server calls, each sort order reordering it, and the way back
to the channel listing. Also measured: 515 imported favorites load with the
page responsive and 24 bar cards built.

Co-Authored-By: Claude Opus 5 <noreply@anthropic.com>
Claude-Session: https://claude.ai/code/session_01QBDkEXP4htyXTCZUwMLphd
2026-09-06 10:46:47 +00:00

80 lines
3.6 KiB
JavaScript

window.App = window.App || {};
App.hottubBackup = App.hottubBackup || {};
// Reads a Hot Tub app backup (an exported SQLite database) and turns the videos
// it has flagged as favorites into this client's favorites.
//
// The app and this client don't agree on identity: the app keys a video by a
// hash it computes locally, while the server -- and so this client -- keys it by
// something like "reddit-1rdudss". So an imported favorite is matched to an
// existing one by URL, and carries no id of its own; see App.favorites.mergeImported.
(function() {
// The app stores a comma-separated set here ("favorite", "recent", ...).
// It also keeps a `favoriteDate` on rows it no longer flags -- a leftover
// from unfavoriting -- so the flag, not the date, is what counts.
const FAVORITE_FLAG = 'favorite';
// Only what a favorite needs. Skipping the rest matters: `allFormats` alone
// is kilobytes of resolved-format JSON per row, and it is exactly the kind
// of thing this client must not store -- those URLs are signed and expire
// (see App.favorites.normalize).
const COLUMNS = ['url', 'title', 'thumb', 'duration', 'uploader', 'flags', 'favoriteDate'];
// The app writes a local-time stamp with no zone ("2025-04-25T20:26:02.144").
// Read it as local time (which is what it was) and keep it as an instant, so
// imported favorites sort against ones saved here. Unparseable or missing
// dates fall back to now rather than to 1970, which would bury them.
const toIsoDate = function(value) {
const parsed = Date.parse(value || '');
return isNaN(parsed) ? new Date().toISOString() : new Date(parsed).toISOString();
};
const hasFavoriteFlag = function(flags) {
if (!flags) return false;
return String(flags).split(',').some((flag) => flag.trim().toLowerCase() === FAVORITE_FLAG);
};
// Newest first, matching how favorites are ordered when added by hand.
const byNewest = function(a, b) {
return String(b.favoriteDate || '').localeCompare(String(a.favoriteDate || ''));
};
App.hottubBackup.readFavorites = function(buffer) {
const db = App.sqlite.open(buffer);
if (db.tableNames().indexOf('video_details') < 0) {
throw new Error('This database has no video_details table -- is it a Hot Tub backup?');
}
const rows = db.readTable('video_details', { columns: COLUMNS });
return rows
.filter((row) => row.url && hasFavoriteFlag(row.flags))
.sort(byNewest)
.map((row) => ({
// No id: the app's own is meaningless to this client, and the
// URL is what both sides agree on.
key: row.url,
id: null,
url: row.url,
title: row.title || '',
thumb: row.thumb || '',
channel: '',
uploader: row.uploader || '',
duration: Number(row.duration) || 0,
isLive: false,
favoriteDate: toIsoDate(row.favoriteDate)
}));
};
App.hottubBackup.readFile = function(file) {
return file.arrayBuffer().then((buffer) => App.hottubBackup.readFavorites(buffer));
};
// Reads the file and merges what it finds. Resolves to the merge summary
// ({found, added, skipped, total}) so the caller can report it.
App.hottubBackup.importFile = function(file) {
return App.hottubBackup.readFile(file).then((entries) => {
const result = App.favorites.mergeImported(entries);
return Object.assign({ found: entries.length }, result);
});
};
})();