Voicemeeter-remote-frontend/src/app/page.tsx
2024-07-22 01:41:17 +02:00

50 lines
1.3 KiB
TypeScript

"use client";
import React from "react";
import { Strip, StripEvent } from "./component/Strip";
import { Button, Container, Divider, Stack } from "@mui/material";
function random(min: number, max: number, floor: boolean = true) {
const value = Math.random() * (max - min + 1) + min;
return floor ? Math.floor(value) : value;
}
export default function Home() {
function onStripEvent(event: StripEvent) {
console.log(event);
}
const physicalBuses = 5;
const virtualBuses = 3;
const strips = physicalBuses + virtualBuses;
return (
<Container fixed maxWidth="xl" sx={{ height: "100%" }}>
<Stack direction={"row"}>
{[...Array(strips)].map((_v, i) => (
<React.Fragment
key={`${i < physicalBuses ? "a" : "b"}${
i < physicalBuses ? i : i - physicalBuses
}`}
>
{i === physicalBuses ? (
<Divider
orientation="vertical"
variant="middle"
sx={{ margin: "5px" }}
/>
) : (
""
)}
<Strip
onChange={(ev) => onStripEvent(ev)}
physicalBuses={physicalBuses}
virtualBuses={virtualBuses}
/>
</React.Fragment>
))}
</Stack>
<Button></Button>
</Container>
);
}