3dtours/SonicForgeStudio
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

fix: lỗi ghi note midi vào track

Browse Source
This commit is contained in:
3dtours
2026-07-23 16:07:40 +07:00
parent 92877d02b7
commit b460d40824
4 changed files with 483 additions and 426 deletions
Download Patch File Download Diff File Expand all files Collapse all files
app/static/js/app.jsx
+312 -314
View File
File diff suppressed because it is too large Load Diff
app/static/js/app.precompiled.js
+25 -24
View File
File diff suppressed because one or more lines are too long
app/storage/sonicforge.db
BIN
View File
Binary file not shown.
app/templates/index.html
+79 -21
View File
@@ -1,5 +1,6 @@
<!DOCTYPE html> <!DOCTYPE html>
<html lang="vi"> <html lang="vi">
<head> <head>
<meta charset="UTF-8"> <meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0"> <meta name="viewport" content="width=device-width, initial-scale=1.0">
@@ -14,7 +15,7 @@
<script src="/static/js/services/storage.js"></script> <script src="/static/js/services/storage.js"></script>
<script src="/static/js/services/aiGateway.js"></script> <script src="/static/js/services/aiGateway.js"></script>
<script src="/static/js/services/dawCommandDispatcher.js"></script> <script src="/static/js/services/dawCommandDispatcher.js"></script>
<script src="/static/js/app.precompiled.js?v=20260723" defer></script> <script src="/static/js/app.precompiled.js?v=202607231122" defer></script>
<style> <style>
:root { :root {
--right-sidebar-width: 320px; --right-sidebar-width: 320px;
@@ -31,26 +32,71 @@
overflow: hidden; overflow: hidden;
user-select: none; user-select: none;
} }
.daw-bg { background-color: #1e1e1e; }
.daw-panel { background-color: #262626; } .daw-bg {
.daw-header { background-color: #2e2e2e; } background-color: #1e1e1e;
.daw-border { border-color: #181818; } }
.daw-track-active { background-color: #333333; }
::-webkit-scrollbar { width: 10px; height: 10px; } .daw-panel {
::-webkit-scrollbar-track { background: #141414; } background-color: #262626;
::-webkit-scrollbar-thumb { background: #3a3a3a; border: 2px solid #141414; border-radius: 4px; } }
::-webkit-scrollbar-thumb:hover { background: #4a4a4a; }
.knob-container { position: relative; width: 28px; height: 28px; } .daw-header {
.knob-dial { transform-origin: center; transition: transform 0.1s ease; } background-color: #2e2e2e;
}
.daw-border {
border-color: #181818;
}
.daw-track-active {
background-color: #333333;
}
::-webkit-scrollbar {
width: 10px;
height: 10px;
}
::-webkit-scrollbar-track {
background: #141414;
}
::-webkit-scrollbar-thumb {
background: #3a3a3a;
border: 2px solid #141414;
border-radius: 4px;
}
::-webkit-scrollbar-thumb:hover {
background: #4a4a4a;
}
.knob-container {
position: relative;
width: 28px;
height: 28px;
}
.knob-dial {
transform-origin: center;
transition: transform 0.1s ease;
}
.selection-interactive-box { .selection-interactive-box {
min-width: 4px; min-width: 4px;
} }
.no-scrollbar { .no-scrollbar {
scrollbar-width: none; /* Firefox */ scrollbar-width: none;
-ms-overflow-style: none; /* IE 10+ */ /* Firefox */
-ms-overflow-style: none;
/* IE 10+ */
} }
.no-scrollbar::-webkit-scrollbar { .no-scrollbar::-webkit-scrollbar {
display: none; /* Safari and Chrome */ display: none;
/* Safari and Chrome */
} }
/* Fullscreen Fixed App Shell */ /* Fullscreen Fixed App Shell */
@@ -101,12 +147,14 @@
} }
#panel-media-explorer { #panel-media-explorer {
height: 50%; /* Default 50/50 split */ height: 50%;
/* Default 50/50 split */
min-height: 100px; min-height: 100px;
} }
#panel-ai { #panel-ai {
flex: 1; /* Fills remaining height */ flex: 1;
/* Fills remaining height */
min-height: 100px; min-height: 100px;
} }
@@ -118,7 +166,8 @@
align-items: center; align-items: center;
gap: 10px; gap: 10px;
padding: 8px; padding: 8px;
overflow-x: auto; /* Enables horizontal scroll when panels overflow */ overflow-x: auto;
/* Enables horizontal scroll when panels overflow */
overflow-y: hidden; overflow-y: hidden;
background-color: #161616; background-color: #161616;
border-top: 1px solid var(--panel-border-color); border-top: 1px solid var(--panel-border-color);
@@ -129,17 +178,20 @@
.daw-bottom-strip::-webkit-scrollbar { .daw-bottom-strip::-webkit-scrollbar {
height: 8px; height: 8px;
} }
.daw-bottom-strip::-webkit-scrollbar-thumb { .daw-bottom-strip::-webkit-scrollbar-thumb {
background: #3a3a3a; background: #3a3a3a;
border-radius: 4px; border-radius: 4px;
} }
.daw-bottom-strip::-webkit-scrollbar-thumb:hover { .daw-bottom-strip::-webkit-scrollbar-thumb:hover {
background: #00ffcc; background: #00ffcc;
} }
/* Sub-panels inside the bottom strip */ /* Sub-panels inside the bottom strip */
.bottom-panel { .bottom-panel {
flex: 0 0 auto; /* Prevents shrinking, locks content dimensions */ flex: 0 0 auto;
/* Prevents shrinking, locks content dimensions */
width: 320px; width: 320px;
height: 100%; height: 100%;
background-color: #222; background-color: #222;
@@ -151,11 +203,13 @@
/* RESIZER HANDLES */ /* RESIZER HANDLES */
.resizer-col-handle { .resizer-col-handle {
width: 5px; width: 5px;
cursor: ew-resize; /* Horizontal resize cursor */ cursor: ew-resize;
/* Horizontal resize cursor */
background: transparent; background: transparent;
transition: background 0.2s; transition: background 0.2s;
z-index: 10; z-index: 10;
} }
.resizer-col-handle:hover, .resizer-col-handle:hover,
.resizer-col-handle:active { .resizer-col-handle:active {
background: #00ffcc; background: #00ffcc;
@@ -163,18 +217,22 @@
.resizer-row-handle { .resizer-row-handle {
height: 5px; height: 5px;
cursor: ns-resize; /* Vertical resize cursor */ cursor: ns-resize;
/* Vertical resize cursor */
background: transparent; background: transparent;
transition: background 0.2s; transition: background 0.2s;
z-index: 10; z-index: 10;
} }
.resizer-row-handle:hover, .resizer-row-handle:hover,
.resizer-row-handle:active { .resizer-row-handle:active {
background: #00ffcc; background: #00ffcc;
} }
</style> </style>
</head> </head>
<body class="h-screen w-screen flex flex-col"> <body class="h-screen w-screen flex flex-col">
<div id="root" class="h-full w-full flex flex-col"></div> <div id="root" class="h-full w-full flex flex-col"></div>
</body> </body>
</html> </html>