feat: new UI and build process

src/main.ts

@@ -1,5 +1,6 @@
-import App from "./ui/App.svelte";
-import Store from "./Store";
+import "./main.css";
+import BeatGroup from "./BeatGroup";
+import RootView from "./ui/Root/RootView";
 
 const defaultSettings = {
     bars: 10,
@@ -9,30 +10,33 @@ const defaultSettings = {
     },
 };
 
-const store = new Store({
-    beats: [
-        {
-            name: "LF",
-            ...defaultSettings,
-        },
-        {
-            name: "LH",
-            ...defaultSettings,
-        },
-        {
-            name: "RH",
-            ...defaultSettings,
-        },
-        {
-            name: "RF",
-            ...defaultSettings,
-        }
-    ]
+const mainBeatGroup = new BeatGroup();
+mainBeatGroup.addBeat({
+    name: "LF"
+});
+mainBeatGroup.addBeat({
+    name: "LH"
+});
+mainBeatGroup.addBeat({
+    name: "RH"
+});
+mainBeatGroup.addBeat({
+    name: "RF"
 });
 
-const app = new App({
-    target: document.body,
-    props: {store},
-});
+const appNode = document.querySelector("#app");
 
-export default app;
+
+if (appNode) {
+    const appRoot = new RootView({
+        parent: appNode as HTMLDivElement,
+        title: "Drum Slayer",
+        mainBeatGroup: mainBeatGroup,
+    });
+    //@ts-ignore
+    window.appRoot = appRoot;
+    appRoot.render();
+    console.log("OK!");
+} else {
+    console.error("FUCK!");
+}