From 352f6d6b9a3d9aa6f0cd1bc9ab7f942e488849ae Mon Sep 17 00:00:00 2001
From: Daniel Ledda <ledda@cip.ifi.lmu.de>
Date: Sun, 27 Feb 2022 18:50:26 +0100
Subject: [PATCH] fixed webpack and some css, added loop baking

---
 src/Beat.ts                        |  9 +++++++++
 src/BeatGroup.ts                   |  5 +++++
 src/ui/Root/Root.css               |  4 ++++
 src/ui/Widgets/BoolBox/BoolBox.css | 14 ++++++++------
 webpack.config.js                  |  4 ++--
 5 files changed, 28 insertions(+), 8 deletions(-)

diff --git a/src/Beat.ts b/src/Beat.ts
index 0e1d453..3ceea57 100644
--- a/src/Beat.ts
+++ b/src/Beat.ts
@@ -150,4 +150,13 @@ export default class Beat implements IPublisher<BeatEvents>, BeatLike {
     delete(): void {
         this.publisher.notifySubs(BeatEvents.WantsRemoval);
     }
+
+    bakeLoops(): void {
+        if (this.isLooping()) {
+            this.unitRecord.forEach((unit, i) => {
+                unit.setOn(this.getUnitByIndex(i)?.isOn() ?? false);
+            });
+            this.setLooping(false);
+        }
+    }
 }
\ No newline at end of file
diff --git a/src/BeatGroup.ts b/src/BeatGroup.ts
index 467f091..5a10083 100644
--- a/src/BeatGroup.ts
+++ b/src/BeatGroup.ts
@@ -264,4 +264,9 @@ export default class BeatGroup implements IPublisher<BeatGroupEvents | BeatEvent
         this.barSettingsLocked = false;
         this.publisher.notifySubs(BeatGroupEvents.LockingChanged);
     }
+
+    bakeLoops(): void {
+        this.beats.forEach(beat => beat.bakeLoops());
+        this.setIsUsingAutoBeatLength(false);
+    }
 }
diff --git a/src/ui/Root/Root.css b/src/ui/Root/Root.css
index 326c14f..84ba9d5 100644
--- a/src/ui/Root/Root.css
+++ b/src/ui/Root/Root.css
@@ -69,7 +69,9 @@
     width: 2em;
     height: 2em;
     cursor: pointer;
+    -webkit-mask-image: url(./drawing.svg);
     mask-image: url(./drawing.svg);
+    -webkit-mask-size: 2em;
     mask-size: 2em;
     background-color: var(--color-ui-neutral-dark);
 }
@@ -79,7 +81,9 @@
     width: 2em;
     height: 2em;
     cursor: pointer;
+    -webkit-mask-image: url(./rotate.svg);
     mask-image: url(./rotate.svg);
+    -webkit-mask-size: 2em;
     mask-size: 2em;
     background-color: var(--color-ui-neutral-dark);
 }
diff --git a/src/ui/Widgets/BoolBox/BoolBox.css b/src/ui/Widgets/BoolBox/BoolBox.css
index cf134cd..c86ee3b 100644
--- a/src/ui/Widgets/BoolBox/BoolBox.css
+++ b/src/ui/Widgets/BoolBox/BoolBox.css
@@ -1,5 +1,6 @@
 .bool-box {
     height: 1.1em;
+    white-space: nowrap;
     margin: 0.5em;
     line-height: 1em;
     cursor: pointer;
@@ -28,6 +29,7 @@ input.bool-box-checkbox[type="checkbox"] {
 input.bool-box-checkbox[type="checkbox"]::before {
     width: 2em;
     height: 1em;
+    margin: 0.1em;
     border-radius: 1em;
     background-color: var(--color-ui-accent-active);
     display: inline-block;
@@ -42,23 +44,23 @@ input.bool-box-checkbox[type="checkbox"]:checked::before {
 }
 
 input.bool-box-checkbox[type="checkbox"]::after {
+    box-sizing: border-box;
     position: absolute;
-    width: 1.05em;
-    height: 1.05em;
+    width: 1.2em;
+    height: 1.2em;
     border-radius: 1em;
     border-color: var(--color-ui-neutral-dark);
-    border-width: 0.05em;
+    border-width: 0.075em;
     border-style: solid;
     background-color: var(--color-ui-neutral-dark);
     display: block;
     content: "";
-    top: -0.075em;
+    left: -0.05em;
     z-index: 1;
-    left: -0.075em;
     transition: left 200ms, background-color 200ms;
 }
 
 input.bool-box-checkbox[type="checkbox"]:checked::after {
-    left: 0.925em;
+    left: 1.1em;
     background-color: var(--color-ui-neutral-light);
 }
\ No newline at end of file
diff --git a/webpack.config.js b/webpack.config.js
index d0ab77c..b45100e 100644
--- a/webpack.config.js
+++ b/webpack.config.js
@@ -47,8 +47,8 @@ const webpackConfig = {
 
     output: {
         filename: "bundle.js",
-        publicPath: "static/",
-        path: path.resolve(__dirname, "./public/static/"),
+        publicPath: "/static/",
+        path: path.resolve(__dirname, "./public/static"),
     },
 
     devServer: {