smcgateway-sv 0.4.8 → 0.4.9

package/dist/AudioTimeLinePlayer.svelte

@@ -1,9 +1,11 @@
 <script lang="ts">
-	import { onMount, onDestroy } from 'svelte';
+	import { onMount, onDestroy, type Snippet } from 'svelte';
 	import { recording } from './recording.svelte.js';
 	import InputDatetime from './InputDatetime.svelte';
 	import { colors } from './colours.js';
 
+	let { module = '', header }: { module?: string; header?: Snippet } = $props();
+
 	type Segment = {
 		url: string;
 		start: Date;
@@ -47,33 +49,40 @@
 		return segments.findIndex((s) => tMs >= s.start.getTime() && tMs < s.end.getTime());
 	}
 
+	$effect(() => {
+		module;
+		loadSegments();
+	});
+
 	async function loadSegments() {
 		isLoading = true;
 		error = '';
 		try {
 			const ret = await recording.getRecordings(windowStart, windowEnd);
 			// console.log('getRecordings()', ret);
-			segments = ret.map((r) => {
-				let color = deviceColorMap[r.from];
-				if (!color) {
-					color = colors[nextColorIndex];
-					deviceColorMap[r.from] = color;
-					nextColorIndex++;
-				}
-				const startPercent = ((r.start.getTime() - windowStart.getTime()) / WINDOW_MS) * 100;
-				const durPercent = ((r.dur * 1000) / WINDOW_MS) * 100;
-				return {
-					url: `/api/recordings/${r.file}`,
-					start: r.start,
-					end: new Date(r.start.getTime() + r.dur * 1000),
-					from: r.from,
-					to: r.to,
-					startPercent,
-					durPercent,
-					color,
-					style: `left:${startPercent}%; width:${durPercent}%; background-color: ${color}`
-				};
-			});
+			segments = ret
+				.filter((r) => module == '' || r.file.startsWith(module))
+				.map((r) => {
+					let color = deviceColorMap[r.from];
+					if (!color) {
+						color = colors[nextColorIndex];
+						deviceColorMap[r.from] = color;
+						nextColorIndex++;
+					}
+					const startPercent = ((r.start.getTime() - windowStart.getTime()) / WINDOW_MS) * 100;
+					const durPercent = ((r.dur * 1000) / WINDOW_MS) * 100;
+					return {
+						url: `/api/recordings/${r.file}`,
+						start: r.start,
+						end: new Date(r.start.getTime() + r.dur * 1000),
+						from: r.from,
+						to: r.to,
+						startPercent,
+						durPercent,
+						color,
+						style: `left:${startPercent}%; width:${durPercent}%; background-color: ${color}`
+					};
+				});
 		} catch (e) {
 			error = 'Failed to fetch audio segments';
 		} finally {
@@ -189,6 +198,9 @@
 </script>
 
 <div class="player">
+	{#if header}
+		{@render header()}
+	{/if}
 	{@render selector(shiftWindow)}
 	{@render timeline()}
 	{@render callInfo(activeSegment)}
@@ -328,6 +340,7 @@ cursor: {new Date(cursor).toISOString()}<br /> -->
 		bottom: 0;
 		border-radius: 0;
 		border-right: 3px red solid;
+		margin-left: -1px;
 	}
 	.call {
 		position: absolute;

package/dist/AudioTimeLinePlayer.svelte.d.ts

@@ -1,3 +1,8 @@
-declare const AudioTimeLinePlayer: import("svelte").Component<Record<string, never>, {}, "">;
+import { type Snippet } from 'svelte';
+type $$ComponentProps = {
+    module?: string;
+    header?: Snippet;
+};
+declare const AudioTimeLinePlayer: import("svelte").Component<$$ComponentProps, {}, "">;
 type AudioTimeLinePlayer = ReturnType<typeof AudioTimeLinePlayer>;
 export default AudioTimeLinePlayer;

package/dist/SelectChannel.svelte

@@ -0,0 +1,30 @@
+<script lang="ts">
+	import settings from './settings.svelte.js';
+
+	let {
+		module = $bindable(),
+		id = '',
+		class: className = '',
+		allName = 'All channels'
+	}: { module?: string; id?: string; class?: string; allName?: string } = $props();
+
+	let channels = $derived.by(() => {
+		let v = settings.all['channels'];
+		if (v) {
+			return Object.keys(v).map((k) => {
+				return { module: k, name: v[k] };
+			});
+		} else {
+			return [];
+		}
+	});
+</script>
+
+<select {id} class={className} bind:value={module}>
+	{#if allName}
+		<option value="">{allName}</option>
+	{/if}
+	{#each channels as c}
+		<option value={c.module}>{c.name}</option>
+	{/each}
+</select>

package/dist/SelectChannel.svelte.d.ts

@@ -0,0 +1,9 @@
+type $$ComponentProps = {
+    module?: string;
+    id?: string;
+    class?: string;
+    allName?: string;
+};
+declare const SelectChannel: import("svelte").Component<$$ComponentProps, {}, "module">;
+type SelectChannel = ReturnType<typeof SelectChannel>;
+export default SelectChannel;

package/dist/settings.svelte.js

@@ -10,7 +10,7 @@ class Settings {
             .then(resp => {
             if (resp.status === 200) {
                 const regSection = /\[([a-zA-Z0-9]+)\]/;
-                const regKeyVal = /([a-zA-Z]+) *= *(.*)/;
+                const regKeyVal = /([a-zA-Z0-9_-]+) *= *(.*)/;
                 resp.text().then(t => {
                     try {
                         this.all = JSON.parse(t);

package/package.json

@@ -1,6 +1,6 @@
 {
 	"name": "smcgateway-sv",
-	"version": "0.4.8",
+	"version": "0.4.9",
 	"author": "Kevin Golding <kevin.golding@smc-gateway.com> (https://smc-gateway.com)",
 	"license": "MIT",
 	"scripts": {