Initial tablet POC: project restructure + WebSocket/HTTP server + JS client
- Restructured project into /app, /server, /client with run.py entry point - WSServer (QWebSocketServer) with log_signal, start/stop, client tracking - HTTP server serves /client on port 8080 - Vanilla JS client: faders, toggles, transport, drag-to-arrange, lock/save layout - Start Tablet button + floating Tablet log window in app UI - Preset broadcast on load/switch, DAW state relay, hardware sync via widget_update - Widget colors synced from app palette, toggle state fixed (sends 0/127 correctly) - Layout saved per preset UUID back to presets.json Co-Authored-By: Claude Sonnet 4.6 <noreply@anthropic.com>
This commit is contained in:
Paul Lipscomb
@@ -0,0 +1,474 @@
|
||||
import uuid
|
||||
|
||||
from PyQt6.QtWidgets import (
|
||||
QWidget, QVBoxLayout, QHBoxLayout, QSlider,
|
||||
QLabel, QSpinBox, QLineEdit, QFrame, QSizePolicy,
|
||||
QPushButton, QCheckBox
|
||||
)
|
||||
from PyQt6.QtCore import Qt, QEvent, QTimer
|
||||
|
||||
from palette import (
|
||||
PALETTE_NAMES,
|
||||
PALETTE_HEX,
|
||||
PALETTE_VIVID,
|
||||
lighten_hex,
|
||||
darken_hex,
|
||||
)
|
||||
from styles import FADER_STYLE, TITLE_STYLE
|
||||
from zonebutton import ZoneButton
|
||||
from colorswatchpopup import ColorSwatchPopup
|
||||
from midi_sender import send_cc
|
||||
|
||||
|
||||
class FaderWidget(QWidget):
|
||||
def __init__(self, label, default_cc):
|
||||
|
||||
super().__init__()
|
||||
|
||||
self.setSizePolicy(QSizePolicy.Policy.Fixed, QSizePolicy.Policy.Maximum)
|
||||
self.setFixedWidth(115)
|
||||
self.current_color = PALETTE_HEX.get("Gray", "#263238")
|
||||
|
||||
self.uid = str(uuid.uuid4())
|
||||
|
||||
# Pickup mode state
|
||||
self.pickup_mode = False
|
||||
self.last_sent = 64
|
||||
self.prev_position = 64
|
||||
self.hunting = False
|
||||
|
||||
outer = QVBoxLayout(self)
|
||||
outer.setContentsMargins(0, 0, 0, 0)
|
||||
outer.setSpacing(2)
|
||||
|
||||
self.container = QFrame()
|
||||
self.container.setFrameShape(QFrame.Shape.StyledPanel)
|
||||
self.apply_color(self.current_color)
|
||||
|
||||
inner = QVBoxLayout(self.container)
|
||||
inner.setContentsMargins(4, 6, 4, 6)
|
||||
inner.setSpacing(4)
|
||||
inner.setAlignment(Qt.AlignmentFlag.AlignHCenter)
|
||||
|
||||
# Learn / CC / CH group
|
||||
self.hw_cc = None
|
||||
self.hw_channel = None
|
||||
self.is_learning = False
|
||||
|
||||
_grp_style = "QFrame { border: 1px solid rgba(255,255,255,0.2); border-radius: 4px; }"
|
||||
|
||||
# Group 1: Learn + input readout (border always visible; learn_btn hideable)
|
||||
self.grp_learn = QFrame()
|
||||
self.grp_learn.setStyleSheet(_grp_style)
|
||||
_grp1_layout = QVBoxLayout(self.grp_learn)
|
||||
_grp1_layout.setContentsMargins(4, 4, 4, 4)
|
||||
_grp1_layout.setSpacing(3)
|
||||
|
||||
self.learn_btn = QPushButton("Learn")
|
||||
self.learn_btn.setFixedHeight(20)
|
||||
self.learn_btn.setStyleSheet("border: none;")
|
||||
self.learn_btn.setContextMenuPolicy(Qt.ContextMenuPolicy.CustomContextMenu)
|
||||
self.learn_btn.customContextMenuRequested.connect(self.on_learn_context_menu)
|
||||
_grp1_layout.addWidget(self.learn_btn)
|
||||
|
||||
self.cc_input_lbl = QLabel("")
|
||||
self.cc_input_lbl.setAlignment(Qt.AlignmentFlag.AlignHCenter)
|
||||
self.cc_input_lbl.setStyleSheet("background-color: #000000; color: #888888; font-size: 10px; padding: 1px; border: none;")
|
||||
self.cc_input_lbl.setFixedHeight(16)
|
||||
_grp1_layout.addWidget(self.cc_input_lbl)
|
||||
|
||||
inner.addWidget(self.grp_learn)
|
||||
|
||||
_arrow_lbl = QLabel("▼")
|
||||
_arrow_lbl.setAlignment(Qt.AlignmentFlag.AlignHCenter)
|
||||
_arrow_lbl.setStyleSheet("color: rgba(255,255,255,0.3); font-size: 9px; background: transparent;")
|
||||
_arrow_lbl.setFixedHeight(12)
|
||||
inner.addWidget(_arrow_lbl)
|
||||
|
||||
# Group 2: CC spin + CH spin + output readout (border always visible; spins hideable)
|
||||
self.grp_cc = QFrame()
|
||||
self.grp_cc.setStyleSheet(_grp_style)
|
||||
_grp2_layout = QVBoxLayout(self.grp_cc)
|
||||
_grp2_layout.setContentsMargins(4, 4, 4, 4)
|
||||
_grp2_layout.setSpacing(3)
|
||||
|
||||
self.cc_spin = QSpinBox()
|
||||
self.cc_spin.setMinimum(0)
|
||||
self.cc_spin.setMaximum(127)
|
||||
self.cc_spin.setValue(default_cc)
|
||||
self.cc_spin.setFixedWidth(55)
|
||||
_cc_lbl = QLabel("CC")
|
||||
_cc_lbl.setStyleSheet("color: #fff; font-size: 10px; border: none;")
|
||||
self.cc_spin_row = QWidget()
|
||||
_hbox_cc = QHBoxLayout(self.cc_spin_row)
|
||||
_hbox_cc.setContentsMargins(0, 0, 0, 0)
|
||||
_hbox_cc.setSpacing(4)
|
||||
_hbox_cc.addWidget(_cc_lbl)
|
||||
_hbox_cc.addWidget(self.cc_spin)
|
||||
_grp2_layout.addWidget(self.cc_spin_row)
|
||||
|
||||
self.ch_spin = QSpinBox()
|
||||
self.ch_spin.setMinimum(1)
|
||||
self.ch_spin.setMaximum(16)
|
||||
self.ch_spin.setValue(1)
|
||||
self.ch_spin.setFixedWidth(55)
|
||||
_ch_lbl = QLabel("CH")
|
||||
_ch_lbl.setStyleSheet("color: #fff; font-size: 10px; border: none;")
|
||||
self.ch_spin_row = QWidget()
|
||||
_hbox_ch = QHBoxLayout(self.ch_spin_row)
|
||||
_hbox_ch.setContentsMargins(0, 0, 0, 0)
|
||||
_hbox_ch.setSpacing(4)
|
||||
_hbox_ch.addWidget(_ch_lbl)
|
||||
_hbox_ch.addWidget(self.ch_spin)
|
||||
_grp2_layout.addWidget(self.ch_spin_row)
|
||||
|
||||
self.cc_output_lbl = QLabel(f"CC{default_cc} [--]")
|
||||
self.cc_output_lbl.setAlignment(Qt.AlignmentFlag.AlignHCenter)
|
||||
self.cc_output_lbl.setStyleSheet("background-color: #000000; color: #00e676; font-size: 10px; padding: 1px; border: none;")
|
||||
self.cc_output_lbl.setFixedHeight(16)
|
||||
_grp2_layout.addWidget(self.cc_output_lbl)
|
||||
|
||||
inner.addWidget(self.grp_cc)
|
||||
|
||||
|
||||
|
||||
# Fader
|
||||
self.fader = QSlider(Qt.Orientation.Vertical)
|
||||
self.fader.setMinimum(0)
|
||||
self.fader.setMaximum(127)
|
||||
self.fader.setValue(64)
|
||||
self.fader.setMinimumHeight(200)
|
||||
self.fader.setFixedWidth(40)
|
||||
self.fader.setSizePolicy(QSizePolicy.Policy.Fixed, QSizePolicy.Policy.Expanding)
|
||||
self.fader.setStyleSheet(FADER_STYLE)
|
||||
inner.addWidget(self.fader, alignment=Qt.AlignmentFlag.AlignHCenter)
|
||||
|
||||
# Readout
|
||||
# readout kept for pickup blink logic but not shown
|
||||
self.readout = QLabel(f"CC {default_cc} → {self.fader.value()}")
|
||||
self.readout.setAlignment(Qt.AlignmentFlag.AlignHCenter)
|
||||
self.readout.setVisible(False)
|
||||
|
||||
# Pickup checkbox
|
||||
self.pickup_checkbox = QCheckBox("Pickup")
|
||||
self.pickup_checkbox.setChecked(False)
|
||||
self.pickup_checkbox.stateChanged.connect(self.on_pickup_changed)
|
||||
inner.addWidget(self.pickup_checkbox, alignment=Qt.AlignmentFlag.AlignHCenter)
|
||||
|
||||
# Scribble strip
|
||||
self.title_edit = QLineEdit(label)
|
||||
self.title_edit.setAlignment(Qt.AlignmentFlag.AlignHCenter)
|
||||
self.title_edit.setStyleSheet(TITLE_STYLE)
|
||||
inner.addWidget(self.title_edit)
|
||||
|
||||
# Color swatch button
|
||||
self.color_name = "Gray"
|
||||
self.color_swatch_btn = QPushButton()
|
||||
self.color_swatch_btn.setFixedHeight(10)
|
||||
self.color_swatch_btn.setSizePolicy(QSizePolicy.Policy.Expanding, QSizePolicy.Policy.Fixed)
|
||||
self.color_swatch_btn.setStyleSheet(f"background-color: {PALETTE_VIVID['Gray']}; border-radius: 2px; border: none;")
|
||||
self.color_swatch_btn.clicked.connect(self.show_color_popup)
|
||||
inner.addWidget(self.color_swatch_btn)
|
||||
|
||||
# + / - buttons
|
||||
btn_row = QHBoxLayout()
|
||||
btn_row.setContentsMargins(0, 0, 0, 0)
|
||||
btn_row.setSpacing(2)
|
||||
self.minus_btn = QPushButton("-")
|
||||
self.minus_btn.setFixedSize(30, 20)
|
||||
self.plus_btn = QPushButton("+")
|
||||
self.plus_btn.setFixedSize(30, 20)
|
||||
btn_row.addWidget(self.minus_btn)
|
||||
btn_row.addStretch()
|
||||
btn_row.addWidget(self.plus_btn)
|
||||
inner.addLayout(btn_row)
|
||||
|
||||
# Zone button
|
||||
self.zone_btn = ZoneButton()
|
||||
self.zone_btn.left_callback = lambda active: self.on_zone_checked("left", active)
|
||||
self.zone_btn.right_callback = lambda active: self.on_zone_checked("right", active)
|
||||
inner.addWidget(self.zone_btn)
|
||||
|
||||
# Separator before ID label
|
||||
id_sep = QWidget()
|
||||
id_sep.setFixedHeight(1)
|
||||
id_sep.setStyleSheet("background-color: #3a3a3a;")
|
||||
inner.addWidget(id_sep)
|
||||
|
||||
# Channel ID label
|
||||
self.id_label = QLabel("")
|
||||
self.id_label.setAlignment(Qt.AlignmentFlag.AlignHCenter)
|
||||
self.id_label.setStyleSheet("color: #ffffff; font-size: 13px; font-weight: bold; background: transparent;")
|
||||
inner.addWidget(self.id_label)
|
||||
|
||||
outer.addWidget(self.container)
|
||||
|
||||
self.fader.valueChanged.connect(self.on_fader_moved)
|
||||
self.cc_spin.valueChanged.connect(self.on_cc_changed)
|
||||
self.on_select_callback = None
|
||||
self.on_context_menu_callback = None
|
||||
self.hw_cc = None # bound hardware CC number
|
||||
self.is_learning = False
|
||||
self.zone = None # None, "left", or "right"
|
||||
self.center_index = None # saved position in center row before zoning
|
||||
self.zone_index = None # position within zone slot
|
||||
self.on_zone_change_callback = None
|
||||
|
||||
# Install event filter on all children to forward clicks to select
|
||||
for child in self.findChildren(QWidget):
|
||||
child.installEventFilter(self)
|
||||
|
||||
def eventFilter(self, obj, event):
|
||||
if event.type() == QEvent.Type.MouseButtonPress:
|
||||
if event.button() != Qt.MouseButton.RightButton:
|
||||
if self.on_select_callback:
|
||||
self.on_select_callback(self)
|
||||
elif event.type() == QEvent.Type.ContextMenu:
|
||||
if self.on_context_menu_callback:
|
||||
self.on_context_menu_callback(self, event.globalPos())
|
||||
return True
|
||||
return False
|
||||
|
||||
def mousePressEvent(self, event):
|
||||
if event.button() != Qt.MouseButton.RightButton:
|
||||
if self.on_select_callback:
|
||||
self.on_select_callback(self)
|
||||
super().mousePressEvent(event)
|
||||
|
||||
def contextMenuEvent(self, event):
|
||||
if self.on_context_menu_callback:
|
||||
self.on_context_menu_callback(self, event.globalPos())
|
||||
|
||||
def on_pickup_changed(self, state):
|
||||
self.pickup_mode = bool(state)
|
||||
if self.pickup_mode:
|
||||
self.hunting = True
|
||||
self.prev_position = self.fader.value()
|
||||
self.pickup_checkbox.setStyleSheet("color: orange; font-weight: bold;")
|
||||
self._start_blink()
|
||||
else:
|
||||
self.hunting = False
|
||||
self.pickup_checkbox.setStyleSheet("color: black;")
|
||||
self._stop_blink()
|
||||
self._set_readout_style("normal")
|
||||
|
||||
def _set_readout_style(self, mode):
|
||||
if mode == "normal":
|
||||
self.cc_output_lbl.setStyleSheet("background-color: #000000; color: #00e676; font-size: 10px; padding: 1px;")
|
||||
self.pickup_checkbox.setStyleSheet("color: black;") if not self.pickup_mode else None
|
||||
elif mode == "orange":
|
||||
self.cc_output_lbl.setStyleSheet("background-color: #000000; color: orange; font-size: 10px; font-weight: bold; padding: 1px;")
|
||||
elif mode == "clear":
|
||||
self.cc_output_lbl.setStyleSheet("background-color: #000000; color: transparent; font-size: 10px; padding: 1px;")
|
||||
|
||||
def _start_blink(self):
|
||||
if not hasattr(self, '_blink_timer'):
|
||||
self._blink_timer = QTimer()
|
||||
self._blink_timer.timeout.connect(self._do_blink)
|
||||
self._blink_state = False
|
||||
self._blink_timer.start(400)
|
||||
|
||||
def _stop_blink(self):
|
||||
if hasattr(self, '_blink_timer'):
|
||||
self._blink_timer.stop()
|
||||
self._set_readout_style("normal")
|
||||
|
||||
def _do_blink(self):
|
||||
self._blink_state = not self._blink_state
|
||||
if self._blink_state:
|
||||
self._set_readout_style("orange")
|
||||
else:
|
||||
self._set_readout_style("clear")
|
||||
|
||||
def on_fader_moved(self, value):
|
||||
cc_num = self.cc_spin.value()
|
||||
self.cc_output_lbl.setText(self._cc_output_label(value))
|
||||
if self.pickup_mode and self.hunting:
|
||||
crossed = (
|
||||
(self.prev_position < self.last_sent <= value) or
|
||||
(self.prev_position > self.last_sent >= value)
|
||||
)
|
||||
self.prev_position = value
|
||||
if crossed:
|
||||
self.hunting = False
|
||||
self._stop_blink()
|
||||
self._set_readout_style("orange")
|
||||
self.last_sent = value
|
||||
send_cc(cc_num, value, channel=self.ch_spin.value())
|
||||
else:
|
||||
self.readout.setText(f"CC {cc_num} → {value}")
|
||||
return
|
||||
else:
|
||||
self.last_sent = value
|
||||
self.prev_position = value
|
||||
send_cc(cc_num, value, channel=self.ch_spin.value())
|
||||
self.readout.setText(f"CC {cc_num} → {value}")
|
||||
|
||||
def on_cc_changed(self):
|
||||
cc_num = self.cc_spin.value()
|
||||
value = self.fader.value()
|
||||
self.readout.setText(f"CC {cc_num} → {value}")
|
||||
self.cc_output_lbl.setText(self._cc_output_label(value))
|
||||
if self.pickup_mode:
|
||||
self.hunting = True
|
||||
self._start_blink()
|
||||
|
||||
def apply_color(self, hex_color, selected=False):
|
||||
self.current_color = hex_color
|
||||
border = "#00ff88" if selected else "rgba(0,0,0,0.3)"
|
||||
border_width = "3px" if selected else "2px"
|
||||
self.container.setObjectName("stripContainer")
|
||||
self.container.setStyleSheet(f"""
|
||||
QFrame#stripContainer {{
|
||||
background-color: {hex_color};
|
||||
border-radius: 6px;
|
||||
border: {border_width} solid {border};
|
||||
}}
|
||||
""")
|
||||
|
||||
def set_selected(self, selected):
|
||||
self.apply_color(self.current_color, selected=selected)
|
||||
|
||||
def update_id_label(self, zone, index):
|
||||
if zone == "left":
|
||||
self.id_label.setText(f"L{index + 1}")
|
||||
elif zone == "right":
|
||||
self.id_label.setText(f"R{index + 1}")
|
||||
else:
|
||||
self.id_label.setText(f"{index + 1}")
|
||||
|
||||
def on_zone_checked(self, zone, active):
|
||||
if active:
|
||||
self.zone = zone
|
||||
else:
|
||||
self.zone = None
|
||||
if self.on_zone_change_callback:
|
||||
self.on_zone_change_callback(self)
|
||||
|
||||
def show_color_popup(self):
|
||||
popup = ColorSwatchPopup(self.on_color_change, self)
|
||||
btn_pos = self.color_swatch_btn.mapToGlobal(self.color_swatch_btn.rect().bottomLeft())
|
||||
popup.move(btn_pos)
|
||||
popup.show()
|
||||
|
||||
def on_color_change(self, name, hex_color=None):
|
||||
if hex_color is None:
|
||||
hex_color = PALETTE_HEX.get(name, self.current_color)
|
||||
self.color_name = name
|
||||
self.color_swatch_btn.setStyleSheet(f"background-color: {PALETTE_VIVID.get(self.color_name, hex_color)}; border-radius: 2px; border: none;")
|
||||
self.apply_color(hex_color)
|
||||
|
||||
def on_zone_checked(self, zone, active):
|
||||
if active:
|
||||
self.zone = zone
|
||||
else:
|
||||
self.zone = None
|
||||
if self.on_zone_change_callback:
|
||||
self.on_zone_change_callback(self)
|
||||
|
||||
def on_learn_context_menu(self, pos):
|
||||
from PyQt6.QtWidgets import QMenu
|
||||
if self.hw_cc is None:
|
||||
return
|
||||
menu = QMenu(self)
|
||||
clear_action = menu.addAction("Clear Input Assignment")
|
||||
action = menu.exec(self.learn_btn.mapToGlobal(pos))
|
||||
if action == clear_action:
|
||||
self.hw_cc = None
|
||||
self.hw_channel = None
|
||||
self.is_learning = False
|
||||
self.learn_btn.setText("Learn")
|
||||
self.learn_btn.setStyleSheet("")
|
||||
self.cc_input_lbl.setText("")
|
||||
self.cc_input_lbl.setStyleSheet("background-color: #000000; color: #888888; font-size: 10px; padding: 1px;")
|
||||
|
||||
def update_id_label(self, zone, index):
|
||||
if zone == "left":
|
||||
self.id_label.setText(f"L{index + 1}")
|
||||
elif zone == "right":
|
||||
self.id_label.setText(f"R{index + 1}")
|
||||
else:
|
||||
self.id_label.setText(f"{index + 1}")
|
||||
|
||||
def start_learn(self):
|
||||
self.is_learning = True
|
||||
self.learn_btn.setText("Listening...")
|
||||
self.learn_btn.setStyleSheet("color: orange; font-weight: bold;")
|
||||
|
||||
def _cc_input_label(self, vel="--"):
|
||||
if self.hw_cc is None:
|
||||
return ""
|
||||
ch = f" CH{self.hw_channel}" if self.hw_channel is not None else ""
|
||||
return f"CC{self.hw_cc}{ch} [{vel}]"
|
||||
|
||||
def _cc_output_label(self, vel="--"):
|
||||
out_cc = self.cc_spin.value()
|
||||
out_ch = self.ch_spin.value()
|
||||
return f"CC{out_cc} CH{out_ch} [{vel}]"
|
||||
|
||||
def stop_learn(self):
|
||||
self.is_learning = False
|
||||
self.learn_btn.setStyleSheet("")
|
||||
if self.hw_cc is not None:
|
||||
self.learn_btn.setText(f"HW: CC{self.hw_cc}")
|
||||
self.cc_input_lbl.setText(self._cc_input_label())
|
||||
self.cc_input_lbl.setStyleSheet("background-color: #000000; color: #00e676; font-size: 10px; padding: 1px;")
|
||||
else:
|
||||
self.learn_btn.setText("Learn")
|
||||
self.cc_input_lbl.setText("")
|
||||
self.cc_input_lbl.setStyleSheet("background-color: #000000; color: #888888; font-size: 10px; padding: 1px;")
|
||||
|
||||
def bind_hw_cc(self, cc_number, channel=None):
|
||||
self.hw_cc = cc_number
|
||||
self.hw_channel = channel
|
||||
self.stop_learn()
|
||||
|
||||
def get_state(self):
|
||||
return {
|
||||
"uid": self.uid,
|
||||
"label": self.title_edit.text(),
|
||||
"cc": self.cc_spin.value(),
|
||||
"ch": self.ch_spin.value(),
|
||||
"value": self.fader.value(),
|
||||
"color": self.color_name,
|
||||
"pickup": self.pickup_checkbox.isChecked(),
|
||||
"last_sent": self.last_sent,
|
||||
"hw_cc": self.hw_cc,
|
||||
"hw_channel": self.hw_channel,
|
||||
"zone": self.zone,
|
||||
"center_index": self.center_index,
|
||||
"zone_index": self.zone_index
|
||||
}
|
||||
|
||||
def set_state(self, state):
|
||||
if "uid" in state:
|
||||
self.uid = state["uid"]
|
||||
self.title_edit.setText(state.get("label", ""))
|
||||
self.cc_spin.setValue(state.get("cc", 1))
|
||||
self.ch_spin.setValue(state.get("ch", 1))
|
||||
self.last_sent = state.get("last_sent", 64)
|
||||
self.fader.setValue(state.get("value", 64))
|
||||
color_name = state.get("color", "Gray")
|
||||
hex_color = PALETTE_HEX.get(color_name, "transparent")
|
||||
self.color_name = color_name
|
||||
self.color_swatch_btn.setStyleSheet(f"background-color: {PALETTE_VIVID.get(self.color_name, hex_color)}; border-radius: 2px; border: none;")
|
||||
self.apply_color(hex_color)
|
||||
pickup = state.get("pickup", False)
|
||||
self.pickup_checkbox.setChecked(pickup)
|
||||
if pickup:
|
||||
self.hunting = True
|
||||
self._start_blink()
|
||||
self.zone = state.get("zone", None)
|
||||
self.center_index = state.get("center_index", None)
|
||||
self.zone_index = state.get("zone_index", None)
|
||||
self.zone_btn.set_state(self.zone == "left", self.zone == "right")
|
||||
self.hw_cc = state.get("hw_cc", None)
|
||||
self.hw_channel = state.get("hw_channel", None)
|
||||
if self.hw_cc is not None:
|
||||
self.learn_btn.setText(f"HW: CC{self.hw_cc}")
|
||||
self.cc_input_lbl.setText(self._cc_input_label())
|
||||
self.cc_input_lbl.setStyleSheet("background-color: #000000; color: #00e676; font-size: 10px; padding: 1px;")
|
||||
else:
|
||||
self.learn_btn.setText("Learn")
|
||||
self.cc_input_lbl.setText("")
|
||||
self.cc_input_lbl.setStyleSheet("background-color: #000000; color: #888888; font-size: 10px; padding: 1px;")
|
||||
Reference in New Issue
Block a user