database params and sockets

schema.sql

@@ -5,6 +5,7 @@ DROP TABLE IF EXISTS instrument_param;
 DROP TABLE IF EXISTS instrument_socket;
 DROP TABLE IF EXISTS patches;
 DROP TABLE IF EXISTS patch_param;
+DROP TABLE IF EXISTS patch_socket;
 DROP TABLE IF EXISTS snippets;
 
 CREATE TABLE instruments (
@@ -25,15 +26,17 @@ CREATE TABLE sockets (
 );
 
 CREATE TABLE instrument_param (
-    instrument_id INTEGER NOT NULL,
+    instrument TEXT NOT NULL,
     param_name TEXT NOT NULL,
-    PRIMARY KEY (instrument_id, param_name)
+    FOREIGN KEY (instrument) REFERENCES instruments(slug),
+    PRIMARY KEY (instrument, param_name)
  );
 
  CREATE TABLE instrument_socket (
-    instrument_id INTEGER NOT NULL,
+    instrument TEXT NOT NULL,
     socket_name TEXT NOT NULL,
-    PRIMARY KEY (instrument_id, socket_name)
+    FOREIGN KEY (instrument) REFERENCES instruments(slug),
+    PRIMARY KEY (instrument, socket_name)
  );
 
 CREATE TABLE patches (
@@ -54,6 +57,13 @@ CREATE TABLE patch_param (
     PRIMARY KEY (patch_id, param_name)
 );
 
+CREATE TABLE patch_socket (
+    patch_id INTEGER NOT NULL,
+    socket_name TEXT NOT NULL,
+    value TEXT NOT NULL,
+    PRIMARY KEY (patch_id, socket_name)
+);
+
 CREATE TABLE snippets (
     filename TEXT NOT NULL,
     instrument TEXT NOT NULL,

static/css/add.css

@@ -1,4 +1,4 @@
-main {
+.grid {
 	display: grid;
 	grid-template-columns: 1fr 1fr 1fr;
 	gap: 16px;
@@ -17,7 +17,7 @@ textarea {
 	font-family: sans-serif;
 }
 
-form > * + * {
+.meta > * + * {
 	margin-top: 16px;
 }
 
@@ -37,6 +37,10 @@ input[type="submit"]:hover {
 	border: 1px solid currentColor;
 }
 
+.meta {
+	grid-column: 1 / span 1;
+}
+
 .preview {
 	position: absolute;
 	top: 8px;

static/css/patch.css

@@ -82,7 +82,7 @@ main {
 
 .meta {
 	display: inline-block;
-	border: 2px solid currentColor;
+	border: 1px solid currentColor;
 	padding: 16px;
 	margin: 32px 0;
 	max-width: 40ch;
@@ -92,3 +92,13 @@ main {
 	margin-top: 8px;
 	opacity: 0.5;
 }
+
+.patch-text {
+	padding: 8px;
+	display: inline-block;
+	white-space: pre-wrap;
+	line-height: 1;
+	font-size: 18px;
+	background-color: rgba(200, 200, 200, 0.5);
+	max-width: 60ch;
+}

static/js/panel.js

@@ -287,6 +287,14 @@ class Panel {
 			if (socket && socket.classList.contains("socket")) {
 				this.cable.end = socket.getAttribute("name");
 
+				let startSocket = document.querySelector(`.socket[name="${this.cable.start}"]`);
+
+				let values = (startSocket.getAttribute("value") || "")
+					.split(",")
+					.map((entry) => entry.trim());
+				values.push(this.cable.end);
+				startSocket.setAttribute("value", values.filter((value) => value != "").join());
+
 				// TODO: log cable
 			} else {
 				this.cable.path.remove();

templates/add_instrument.html

@@ -27,8 +27,8 @@
 			<span class="path-slash"> / </span>
 			<h2 class="title">Add</h2>
 		</header>
-		<main>
+		<main class="grid">
-			<form method="POST" enctype="multipart/form-data">
+			<form class="meta" method="POST" enctype="multipart/form-data">
 				<input type="text" name="name" placeholder="1. Name" />
 				<textarea
 					name="description"

templates/add_patch.html

@@ -31,11 +31,12 @@
 				{{instrument['name']}}
 			</a>
 			<span class="path-slash"> / </span>
-			<h2 class="title">Add</h2>
+			<h2 class="title">Add Patch</h2>
 		</header>
 
 		<main>
-			<form method="POST" enctype="multipart/form-data">
+			<form class="grid" method="POST" enctype="multipart/form-data">
+				<div class="meta">
 					<input type="text" name="name" placeholder="Name" />
 					<textarea
 						name="description"
@@ -52,8 +53,10 @@
 					<input type="text" name="routing" placeholder="Routing" />
 
 					<input type="submit" value="Add" />
-			</form>
+				</div>
+
 				<div id="panel-container">{{panel|safe}}</div>
+			</form>
 		</main>
 	</body>
 </html>

templates/patch.html

@@ -118,6 +118,19 @@
 		{% endfor %}
 	</ul>
 </div>
+
+<pre class="patch-text">
+{{patch['name']}}
+
+{{patch['description']}}
+
+A patch for {{instrument['name']}}
+
+{% for param in params %}{{param['param_name']}}: {{param['value']}} <br>{% endfor %}
+
+{% for socket in sockets %}{{socket['socket_name']}} -> {{socket['value']}}<br>{% endfor %}
+</pre>
+
 </main>
 
 
@@ -127,5 +140,8 @@
 		{% endfor %}
 		></div>
 
+
+
+
 </body>
 </html>

workbook.py

@@ -61,7 +61,7 @@ def create_instrument(name, description, params, sockets, panel):
             "INSERT OR IGNORE INTO params (param_name) VALUES (?)",(param,)
         )
         cur.execute(
-            "INSERT INTO instrument_param (instrument_id, param_name) VALUES (?, ?)", (instrument_id, param )
+            "INSERT INTO instrument_param (instrument, param_name) VALUES (?, ?)", (slug, param )
         )
 
     for socket in sockets:
@@ -70,7 +70,7 @@ def create_instrument(name, description, params, sockets, panel):
         )
 
         cur.execute(
-            "INSERT INTO instrument_socket (instrument_id, socket_name) VALUES (?, ?)", (instrument_id, socket )
+            "INSERT INTO instrument_socket (instrument, socket_name) VALUES (?, ?)", (slug, socket )
         )
 
     connection.commit()
@@ -147,25 +147,39 @@ def add_patch(instrument):
 
         patch_id = cursor.lastrowid
 
-        patch.pop('name','')
+        instrument_params = cursor.execute('SELECT param_name FROM instrument_param WHERE instrument = ?', (instrument,)).fetchall()
-        patch.pop('slug','')
+        instrument_sockets = cursor.execute('SELECT socket_name FROM instrument_socket WHERE instrument = ?', (instrument,)).fetchall()
-        patch.pop('description','')
-        patch.pop('cables','')
         
-        for param, value in patch.items():
+        instrument_params = [row[0] for row in instrument_params]
-            cursor.execute('INSERT INTO patch_param (patch_id, param_name, value) VALUES (?,?,?)',
+        instrument_sockets = [row[0] for row in instrument_sockets]
-            (patch_id, param, value))
+
+        for key, value in patch.items():
+            destination = None
+            if key in instrument_params:
+                destination = 'param'    
+            elif key in instrument_sockets:
+                destination = 'socket'
+
+            if destination is not None:
+                print(f'Insert {key} into {destination}')
+                cursor.execute(f'INSERT INTO patch_{destination} (patch_id, {destination}_name, value) VALUES (?,?,?)',
+                (patch_id, key, value))
     
         connection.commit()
         connection.close()
 
         return redirect(url_for('patches', instrument=instrument))
 
+
+
+
+
     with open(f'static/panels/{instrument}.svg', 'r') as f:
         panel = f.read()
 
     instrument = cursor.execute('SELECT * FROM instruments WHERE slug = ?', (instrument,)).fetchone()
     
+
     connection.close()
     return render_template('add_patch.html', instrument=instrument, panel = panel)
 
@@ -173,8 +187,6 @@ def add_patch(instrument):
 @app.route("/instruments/<instrument>/<name>", methods=['GET', 'POST'])
 def patch(instrument, name):
 
-
-
     if request.method == 'POST':
 
         connection = get_db_connection()
@@ -210,6 +222,9 @@ def patch(instrument, name):
     params = cursor.execute('SELECT * FROM patch_param WHERE patch_id = ?', 
     (patch['id'],)).fetchall()
 
+    sockets = cursor.execute('SELECT * FROM patch_socket WHERE patch_id = ?', 
+    (patch['id'],)).fetchall()
+
     instrument = cursor.execute('SELECT * FROM instruments WHERE slug = ?', 
     (instrument,)).fetchone()
 
@@ -218,7 +233,7 @@ def patch(instrument, name):
 
     connection.close()
 
-    return render_template('patch.html', instrument=instrument, patch=patch, params=params, panel=panel, snippets=snippets)
+    return render_template('patch.html', instrument=instrument, patch=patch, params=params, sockets=sockets, panel=panel, snippets=snippets)