music video renderer web app
deftoku.digi.rip
audio
visualizer
webapp
visualizers/index: moved visualizer indexing to dedicated file
+92
-85
+6
-85
src/controller.ts
+6
-85
src/controller.ts
···
2
2
import { render } from "./render.ts";
3
3
import { audioBuffer } from "./import.ts";
4
4
import {
5
+
VisualizerDef,
6
+
VisualizerName,
7
+
VisualizerOptions,
8
+
visualizers,
9
+
} from "./visualizers/index.ts";
10
+
import {
5
11
Quality,
6
12
QUALITY_HIGH,
7
13
QUALITY_LOW,
···
9
15
QUALITY_VERY_LOW,
10
16
} from "mediabunny";
11
17
12
-
// visualizers
13
-
import {
14
-
category as asciiBarsCategory,
15
-
draw as asciiBars,
16
-
params as asciiBarsParams,
17
-
preview as asciiBarsPreview,
18
-
} from "./visualizers/ascii/bars.ts";
19
-
import {
20
-
category as barsCategory,
21
-
draw as bars,
22
-
params as barsParams,
23
-
preview as barsPreview,
24
-
} from "./visualizers/classic/bars.ts";
25
-
import {
26
-
category as cdbottomCategory,
27
-
draw as cdbottom,
28
-
params as cdbottomParams,
29
-
preview as cdbottomPreview,
30
-
} from "./visualizers/media/cd-bottom.ts";
31
-
import {
32
-
category as cdtopCategory,
33
-
draw as cdtop,
34
-
params as cdtopParams,
35
-
preview as cdtopPreview,
36
-
} from "./visualizers/media/cd-top.ts";
37
-
type VisualizerName = keyof typeof visualizers;
38
-
39
-
// visualizer opts registry, bundles draw & params
40
-
type VisualizerOptions = Record<string, string | number | HTMLImageElement>;
41
-
42
18
const imageCache = new Map<string, HTMLImageElement>();
43
-
44
-
type VisualizerDef = {
45
-
draw: (
46
-
canvas: HTMLCanvasElement,
47
-
freq: Uint8Array,
48
-
options: VisualizerOptions,
49
-
dt?: number,
50
-
) => void;
51
-
preview: (
52
-
canvas: HTMLCanvasElement,
53
-
freq: Uint8Array,
54
-
getOptions: () => VisualizerOptions,
55
-
fps: number,
56
-
) => () => void;
57
-
params: Array<{
58
-
key: string;
59
-
type: string;
60
-
default: string | number;
61
-
min?: number;
62
-
max?: number;
63
-
step?: number;
64
-
label: string;
65
-
inputStyle?: Partial<CSSStyleDeclaration>;
66
-
}>;
67
-
category: string;
68
-
default?: boolean;
69
-
};
70
-
71
-
const visualizers: Record<string, VisualizerDef> = {
72
-
asciiBars: {
73
-
draw: asciiBars,
74
-
params: asciiBarsParams,
75
-
preview: asciiBarsPreview,
76
-
category: asciiBarsCategory,
77
-
},
78
-
bars: {
79
-
draw: bars,
80
-
params: barsParams,
81
-
preview: barsPreview,
82
-
category: barsCategory,
83
-
},
84
-
cdbottom: {
85
-
draw: cdbottom,
86
-
params: cdbottomParams,
87
-
preview: cdbottomPreview,
88
-
category: cdbottomCategory,
89
-
},
90
-
cdtop: {
91
-
draw: cdtop,
92
-
params: cdtopParams,
93
-
preview: cdtopPreview,
94
-
category: cdtopCategory,
95
-
default: true,
96
-
},
97
-
};
98
19
99
20
const qualityMap: Record<string, Quality> = {
100
21
"verylow": QUALITY_VERY_LOW,
+86
src/visualizers/index.ts
+86
src/visualizers/index.ts
···
1
+
import {
2
+
category as asciiBarsCategory,
3
+
draw as asciiBars,
4
+
params as asciiBarsParams,
5
+
preview as asciiBarsPreview,
6
+
} from "./ascii/bars.ts";
7
+
import {
8
+
category as barsCategory,
9
+
draw as bars,
10
+
params as barsParams,
11
+
preview as barsPreview,
12
+
} from "./classic/bars.ts";
13
+
import {
14
+
category as cdbottomCategory,
15
+
draw as cdbottom,
16
+
params as cdbottomParams,
17
+
preview as cdbottomPreview,
18
+
} from "./media/cd-bottom.ts";
19
+
import {
20
+
category as cdtopCategory,
21
+
draw as cdtop,
22
+
params as cdtopParams,
23
+
preview as cdtopPreview,
24
+
} from "./media/cd-top.ts";
25
+
export type VisualizerName = keyof typeof visualizers;
26
+
27
+
// visualizer opts registry, bundles draw & params
28
+
export type VisualizerOptions = Record<
29
+
string,
30
+
string | number | HTMLImageElement
31
+
>;
32
+
33
+
export type VisualizerDef = {
34
+
draw: (
35
+
canvas: HTMLCanvasElement,
36
+
freq: Uint8Array,
37
+
options: VisualizerOptions,
38
+
dt?: number,
39
+
) => void;
40
+
preview: (
41
+
canvas: HTMLCanvasElement,
42
+
freq: Uint8Array,
43
+
getOptions: () => VisualizerOptions,
44
+
fps: number,
45
+
) => () => void;
46
+
params: Array<{
47
+
key: string;
48
+
type: string;
49
+
default: string | number;
50
+
min?: number;
51
+
max?: number;
52
+
step?: number;
53
+
label: string;
54
+
inputStyle?: Partial<CSSStyleDeclaration>;
55
+
}>;
56
+
category: string;
57
+
default?: boolean;
58
+
};
59
+
60
+
export const visualizers: Record<string, VisualizerDef> = {
61
+
asciiBars: {
62
+
draw: asciiBars,
63
+
params: asciiBarsParams,
64
+
preview: asciiBarsPreview,
65
+
category: asciiBarsCategory,
66
+
},
67
+
bars: {
68
+
draw: bars,
69
+
params: barsParams,
70
+
preview: barsPreview,
71
+
category: barsCategory,
72
+
},
73
+
cdbottom: {
74
+
draw: cdbottom,
75
+
params: cdbottomParams,
76
+
preview: cdbottomPreview,
77
+
category: cdbottomCategory,
78
+
},
79
+
cdtop: {
80
+
draw: cdtop,
81
+
params: cdtopParams,
82
+
preview: cdtopPreview,
83
+
category: cdtopCategory,
84
+
default: true,
85
+
},
86
+
};