preset knobs

2 years ago · ef1ceab64a
parent 368952c35a
commit ef1ceab64a
5 changed files with 30 additions and 7 deletions
--- a/static/css/patch.css
+++ b/static/css/patch.css
@ -63,10 +63,10 @@
 	display: inline-block;
 }

-svg #params,
+/* svg #params,
 svg #sockets {
 	display: none;
-}
+} */

 .instrument .cables {
 	position: absolute;
--- a/static/js/panel.js
+++ b/static/js/panel.js
@ -93,15 +93,17 @@ class Panel {
 	model = {};
 	params = [];
 	sockets = [];
+	preset = {};

 	cable = null;
 	cables = null;

-	constructor(svg, container, debug = false) {
+	constructor(svg, container, preset = {}, debug = false) {
 		this.svg = this.htmlToElement(svg);
 		this.container = container;
 		this.container.style.position = "relative";
 		this.containerRect = container.getBoundingClientRect();
+		this.preset = { ...preset };
 		this.debug = debug;

 		while (container.firstChild) {
@ -111,6 +113,7 @@ class Panel {

 		this.setSize();
 		this.createParams();
+
 		this.createSockets();
 		this.createCables();

@ -155,6 +158,10 @@ class Panel {

 			control.setAttribute("name", param.id);

+			if (this.preset.hasOwnProperty(param.id)) {
+				control.value = this.preset[param.id];
+			}
+
 			this.container.appendChild(control);

 			this.model.params.push(param.id);
--- a/static/js/patch.js
+++ b/static/js/patch.js
@ -1,4 +1,8 @@
 const container = document.querySelector("#panel-container");
+const preset = { ...document.querySelector("#data-params").dataset };
+
 const svg = container.querySelector("svg").outerHTML;

-let panel = new Panel(svg, container);
+let panel = new Panel(svg, container, preset);
+
+// there is something about ... but is not that
--- a/templates/patch.html
+++ b/templates/patch.html
@ -13,7 +13,7 @@
 		<script src="{{ url_for('static', filename='js/input-knobs.js') }}" defer></script>
 		<script src="{{ url_for('static', filename='js/panel.js') }}" defer></script>

-		<!-- <script src="{{ url_for('static', filename='js/patch.js') }}" defer></script> -->
+		<script src="{{ url_for('static', filename='js/patch.js') }}" defer></script>
 	</head>
 	<body>
 		<header>
@ -27,7 +27,7 @@
 			<span class="path-slash"> / </span>
 			<h2 class="title">{{patch['name']}}</h2>

-			<button class="print">
+			<button class="print" onclick="print()">
 				<svg
 					width="54"
 					height="54"
@ -55,6 +55,10 @@
 				{% endif %}
 			</div>

+
+			
+			
+			
 			<form method="POST" enctype="multipart/form-data">
 				<input type="text" class="description" name="description" />
 				<input type="file" name="snippet" accept="audio/*" />
@ -102,5 +106,13 @@
 				{% endfor %}
 			</ul>
 		</div>
+
+
+			<div id="data-params"
+				{% for param in params %} 
+					data-{{param['param_name']}}="{{param['value']}}" 
+				{% endfor %}
+			></div>
+
 	</body>
 </html>
--- a/workbook.py
+++ b/workbook.py
@ -216,7 +216,7 @@ def patch(instrument, name):

    connection.close()

-    return render_template('patch.html', instrument=instrument, patch=patch, panel=panel, snippets=snippets)
+    return render_template('patch.html', instrument=instrument, patch=patch, params=params, panel=panel, snippets=snippets)