Compare commits
2
Commits
3aae8a0130
...
main
| Author | SHA1 | Date | |
|---|---|---|---|
|
|
163fa6b910 | ||
|
|
3d67b58b03 |
@@ -1,2 +1,3 @@
|
|||||||
STREAM_JSON_LOCATION=/data/streams/json
|
STREAM_JSON_LOCATION=/data/streams/json
|
||||||
STREAM_MEDIA_LOCATION=/data/streams/media
|
STREAM_MEDIA_LOCATION=/data/streams/media
|
||||||
|
PUBLIC_TAG_INTENSITY=true
|
||||||
|
|||||||
@@ -1,17 +1,23 @@
|
|||||||
<script lang="ts">
|
<script lang="ts">
|
||||||
import { TAG_WEIGHT_NAMES } from '$lib/stores.svelte.ts';
|
import { TAG_WEIGHT_NAMES, TAG_INTENSITY_ENABLED } from '$lib/stores.svelte.ts';
|
||||||
import type { TagWeights } from '$lib/types';
|
import type { TagWeights } from '$lib/types';
|
||||||
|
|
||||||
let { tags, highlighted = {} }: { tags: TagWeights; highlighted?: Record<string, number> } =
|
let { tags, highlighted = {} }: { tags: TagWeights; highlighted?: Record<string, number> } =
|
||||||
$props();
|
$props();
|
||||||
|
|
||||||
let sorted = $derived(Object.entries(tags).sort((a, b) => b[1] - a[1]));
|
let sorted = $derived(
|
||||||
|
TAG_INTENSITY_ENABLED
|
||||||
|
? Object.entries(tags).sort((a, b) => b[1] - a[1])
|
||||||
|
: Object.entries(tags)
|
||||||
|
);
|
||||||
</script>
|
</script>
|
||||||
|
|
||||||
{#each sorted as [tag, weight], i}{i ? ', ' : ''}<span
|
{#each sorted as [tag, weight], i}{i ? ', ' : ''}<span
|
||||||
class="weight-{weight}"
|
class="weight-{TAG_INTENSITY_ENABLED ? weight : 1}"
|
||||||
class:highlighted={tag in highlighted}
|
class:highlighted={tag in highlighted}
|
||||||
>{tag}<span class="screen-reader-only"> ({TAG_WEIGHT_NAMES[weight]})</span></span
|
>{tag}{#if TAG_INTENSITY_ENABLED}<span class="screen-reader-only">
|
||||||
|
({TAG_WEIGHT_NAMES[weight]})</span
|
||||||
|
>{/if}</span
|
||||||
>{/each}
|
>{/each}
|
||||||
|
|
||||||
<style>
|
<style>
|
||||||
|
|||||||
@@ -1,4 +1,5 @@
|
|||||||
import { SvelteSet } from 'svelte/reactivity';
|
import { SvelteSet } from 'svelte/reactivity';
|
||||||
|
import { env } from '$env/dynamic/public';
|
||||||
import { readStored, writeStored } from './utils.ts';
|
import { readStored, writeStored } from './utils.ts';
|
||||||
|
|
||||||
export const favoritedStreams = new SvelteSet<string>(readStored('favoritedStreams', []));
|
export const favoritedStreams = new SvelteSet<string>(readStored('favoritedStreams', []));
|
||||||
@@ -10,6 +11,7 @@ $effect.root(() => {
|
|||||||
|
|
||||||
export const MAX_TAG_WEIGHT = 3;
|
export const MAX_TAG_WEIGHT = 3;
|
||||||
export const TAG_WEIGHT_NAMES = ['off', 'light', 'medium', 'heavy'];
|
export const TAG_WEIGHT_NAMES = ['off', 'light', 'medium', 'heavy'];
|
||||||
|
export const TAG_INTENSITY_ENABLED = env.PUBLIC_TAG_INTENSITY !== 'false';
|
||||||
|
|
||||||
export const tagList = [
|
export const tagList = [
|
||||||
'acoustic',
|
'acoustic',
|
||||||
|
|||||||
@@ -1,6 +1,12 @@
|
|||||||
<script lang="ts">
|
<script lang="ts">
|
||||||
|
import { onMount } from 'svelte';
|
||||||
import { goto } from '$app/navigation';
|
import { goto } from '$app/navigation';
|
||||||
import { favoritedStreams, tagList, MAX_TAG_WEIGHT } from '$lib/stores.svelte.ts';
|
import {
|
||||||
|
favoritedStreams,
|
||||||
|
tagList,
|
||||||
|
MAX_TAG_WEIGHT,
|
||||||
|
TAG_INTENSITY_ENABLED
|
||||||
|
} from '$lib/stores.svelte.ts';
|
||||||
import * as streamCache from '$lib/streamCache.svelte.ts';
|
import * as streamCache from '$lib/streamCache.svelte.ts';
|
||||||
import { getStreamContext } from '$lib/streamContext.svelte.ts';
|
import { getStreamContext } from '$lib/streamContext.svelte.ts';
|
||||||
import type { StreamSummary } from '$lib/types';
|
import type { StreamSummary } from '$lib/types';
|
||||||
@@ -39,6 +45,14 @@
|
|||||||
|
|
||||||
let cacheUsage = $derived(streamCache.usage.bytes);
|
let cacheUsage = $derived(streamCache.usage.bytes);
|
||||||
|
|
||||||
|
// autoscroll to center currently active stream on page load
|
||||||
|
onMount(() => {
|
||||||
|
if (!ctx.current) return;
|
||||||
|
document
|
||||||
|
.getElementById(`stream-${ctx.current.id}`)
|
||||||
|
?.scrollIntoView({ block: 'center', behavior: 'instant' });
|
||||||
|
});
|
||||||
|
|
||||||
$effect(() => {
|
$effect(() => {
|
||||||
if (displayedStreams.size == 1) {
|
if (displayedStreams.size == 1) {
|
||||||
listOpen = false;
|
listOpen = false;
|
||||||
@@ -53,13 +67,13 @@
|
|||||||
return new Set(ctx.streams.filter((stream) => matchesFilter(stream, filteredTags)));
|
return new Set(ctx.streams.filter((stream) => matchesFilter(stream, filteredTags)));
|
||||||
}
|
}
|
||||||
|
|
||||||
// how many of these streams have the tag at weight 1+, 2+ and 3+
|
// count streams at each enabled minimum weight
|
||||||
// e.g. dark at weights [1, 3, 3, None] on four streams gives [3, 2, 2]
|
// e.g. dark at weights [1, 3, 3, None] on four streams gives [3, 2, 2]
|
||||||
function weightCounts(streams: Iterable<StreamSummary>, tag: string) {
|
function weightCounts(streams: Iterable<StreamSummary>, tag: string) {
|
||||||
const counts = new Array(MAX_TAG_WEIGHT).fill(0);
|
const counts = new Array(TAG_INTENSITY_ENABLED ? MAX_TAG_WEIGHT : 1).fill(0);
|
||||||
for (const stream of streams) {
|
for (const stream of streams) {
|
||||||
const weight = stream.tags[tag] ?? 0;
|
const weight = stream.tags[tag] ?? 0;
|
||||||
for (let i = 0; i < weight; i++) counts[i]++;
|
for (let i = 0; i < Math.min(weight, counts.length); i++) counts[i]++;
|
||||||
}
|
}
|
||||||
return counts;
|
return counts;
|
||||||
}
|
}
|
||||||
|
|||||||
@@ -1,6 +1,11 @@
|
|||||||
<script lang="ts">
|
<script lang="ts">
|
||||||
import Select from 'svelte-select';
|
import Select from 'svelte-select';
|
||||||
import { tagList, MAX_TAG_WEIGHT, TAG_WEIGHT_NAMES } from '$lib/stores.svelte.ts';
|
import {
|
||||||
|
tagList,
|
||||||
|
MAX_TAG_WEIGHT,
|
||||||
|
TAG_WEIGHT_NAMES,
|
||||||
|
TAG_INTENSITY_ENABLED
|
||||||
|
} from '$lib/stores.svelte.ts';
|
||||||
|
|
||||||
// type not exported in the lib itself
|
// type not exported in the lib itself
|
||||||
type SelectItem = Record<string, unknown>;
|
type SelectItem = Record<string, unknown>;
|
||||||
@@ -109,7 +114,7 @@
|
|||||||
|
|
||||||
{#snippet selection({ selection }: { selection: SelectItem })}
|
{#snippet selection({ selection }: { selection: SelectItem })}
|
||||||
{@const tag = selection.value as string}
|
{@const tag = selection.value as string}
|
||||||
{#if tag in checked}
|
{#if tag in checked && TAG_INTENSITY_ENABLED}
|
||||||
{@const min = checked[tag]}
|
{@const min = checked[tag]}
|
||||||
{@const ceiling = ceilingOf(tag)}
|
{@const ceiling = ceilingOf(tag)}
|
||||||
<button
|
<button
|
||||||
|
|||||||
Reference in New Issue
Block a user