shawn/op-pedal
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

Copy/Paste Plugin

Browse Source
This commit is contained in:
Robin E.R. Davies
2026-05-23 18:48:05 -04:00
parent a9b7ece592
commit aa411574fb
3 changed files with 171 additions and 91 deletions
Download Patch File Download Diff File Expand all files Collapse all files
vite/src/pipedal/MainPage.tsx
+8 -9
View File
@@ -427,7 +427,6 @@ export const MainPage =
let title = "";
let author = "";
let infoPluginUri = "";
let presetsUri = "";
let missing = false;
let canEditTitle = false;
let modGuiButtonVisible = false;
@@ -439,7 +438,6 @@ export const MainPage =
} else if (pedalboardItem.isSyntheticItem()) {
title = pedalboardItem.pluginName ?? "#error";
author = "";
presetsUri = "";
infoPluginUri = "";
}
else {
@@ -456,7 +454,6 @@ export const MainPage =
title = uiPlugin.name;
author = uiPlugin.author_name;
}
presetsUri = uiPlugin.uri;
// if (uiPlugin.description.length > 20) {
// }
infoPluginUri = uiPlugin.uri;
@@ -544,10 +541,6 @@ export const MainPage =
<div style={{ flex: "0 0 auto", verticalAlign: "center" }}>
<PluginInfoDialog plugin_uri={infoPluginUri} />
</div>
<div style={{ flex: "0 0 auto" }}>
<PluginPresetSelector pluginUri={presetsUri} instanceId={pedalboardItem?.instanceId ?? 0}
/>
</div>
{modGuiButtonVisible && (
<div style={{ flex: "0 0 auto" }}>
@@ -634,6 +627,7 @@ export const MainPage =
canShowModUi = this.canShowModUi(pedalboardItem);
canDelete = pedalboard.canDeleteItem(pedalboardItem.instanceId);
instanceId = pedalboardItem.instanceId;
pluginUri = pedalboardItem.uri;
if (pedalboardItem.isEmpty()) {
canInsert = true;
canAppend = true;
@@ -699,7 +693,12 @@ export const MainPage =
</div>
{this.props.enableStructureEditing && (
<div style={{ flex: "0 0 auto", display: "flex", flexFlow: "row nowrap", alignItems: "center" }}>
<div style={{ flex: "0 0 auto", display: (canInsert || canAppend) ? "block" : "none", paddingRight: 8 }}>
<div style={{ flex: "0 0 auto" }}>
<PluginPresetSelector pedalboardItem={pedalboardItem} instanceId={pedalboardItem?.instanceId ?? 0}
/>
</div>
<div style={{ flex: "0 0 auto", display: (canInsert || canAppend) ? "block" : "none" }}>
<IconButtonEx tooltip="Add pedal slot" onClick={(e) => { this.onAddClick(e) }} size="large">
<AddIcon style={{ height: 24, width: 24, fill: this.props.theme.palette.text.primary, opacity: 0.6 }} />
</IconButtonEx>
@@ -718,7 +717,7 @@ export const MainPage =
{canAppend && (<MenuItem onClick={() => this.onAppendSplit(instanceId)}>Append split</MenuItem>)}
</Menu>
</div>
<div style={{ flex: "0 0 auto", display: canDelete ? "block" : "none", paddingRight: 8 }}>
<div style={{ flex: "0 0 auto", display: canDelete ? "block" : "none", }}>
<IconButtonEx tooltip="Delete pedal"
onClick={() => { this.onDeletePedal(pedalboardItem?.instanceId ?? -1) }}
size="large">
vite/src/pipedal/Pedalboard.tsx
+6
View File
@@ -59,6 +59,9 @@ export class ControlValue implements Deserializable<ControlValue> {
}
export class PedalboardItem implements Deserializable<PedalboardItem> {
clone() {
return new PedalboardItem().deserialize(this);
}
deserializePedalboardItem(input: any): PedalboardItem {
this.instanceId = input.instanceId ?? -1;
this.title = input.title ?? "";
@@ -753,11 +756,14 @@ export class Pedalboard implements Deserializable<Pedalboard> {
replaceItem(instanceId: number, newItem: PedalboardItem)
{
newItem.instanceId = ++this.nextInstanceId;
let result = this._replaceItem(this.items,instanceId,newItem);
if (!result)
{
throw new PiPedalArgumentError("instanceId not found.");
}
return newItem.instanceId;
}
private _addItem(items: PedalboardItem[], newItem: PedalboardItem, instanceId: number, append: boolean)
{
vite/src/pipedal/PluginPresetSelector.tsx
+125 -50
View File
@@ -36,16 +36,17 @@ import Divider from "@mui/material/Divider";
import PluginPresetsIcon from "./svg/ic_pluginpreset.svg?react";
import PluginPresetIcon from "./svg/ic_pluginpreset2.svg?react";
import { Pedalboard, PedalboardItem } from './Pedalboard';
interface PluginPresetSelectorProps extends WithStyles<typeof styles> {
pluginUri?: string;
pedalboardItem: PedalboardItem | null;
instanceId: number;
}
interface PluginPresetSelectorState {
presets: PluginUiPresets;
enabled: boolean;
//enabled: boolean;
presetChanged: boolean;
showPresetsDialog: boolean;
showEditPresetsDialog: boolean;
@@ -57,6 +58,10 @@ interface PluginPresetSelectorState {
renameDialogOnOk?: (name: string) => void;
saveAsName: string;
isVisible: boolean;
hasPresets: boolean;
isPastePluginEnabled: boolean;
}
@@ -74,6 +79,8 @@ const styles = (theme: Theme) => createStyles({
});
let pluginClipboardContents: PedalboardItem | null = null;
const PluginPresetSelector =
withStyles(
class extends Component<PluginPresetSelectorProps, PluginPresetSelectorState> {
@@ -85,7 +92,7 @@ const PluginPresetSelector =
this.model = PiPedalModelFactory.getInstance();
this.state = {
presets: new PluginUiPresets(),
enabled: false,
isVisible: this.isVisible(props.pedalboardItem),
presetChanged: false,
showPresetsDialog: false,
showEditPresetsDialog: false,
@@ -94,26 +101,44 @@ const PluginPresetSelector =
renameDialogDefaultName: "",
renameDialogActionName: "",
renameDialogOnOk: undefined,
saveAsName: ""
saveAsName: "",
hasPresets: this.hasPresets(this.props.pedalboardItem),
isPastePluginEnabled: pluginClipboardContents !== null
};
this.handleDialogClose = this.handleDialogClose.bind(this);
this.handlePresetsMenuClose = this.handlePresetsMenuClose.bind(this);
}
handleLoadPluginPreset(instanceId: number)
{
hasPresets(pedalboardItem: PedalboardItem | null): boolean {
if (pedalboardItem === null) return false;
if (!pedalboardItem.uri) return false;
if (pedalboardItem.isStart() || pedalboardItem.isEnd()
|| pedalboardItem.isEmpty() || pedalboardItem.isSplit()) {
return false;
}
return true;
}
isVisible(pedalboardItem: PedalboardItem | null): boolean {
if (pedalboardItem === null) return false;
if (!pedalboardItem.uri) return false;
if (pedalboardItem.isStart() || pedalboardItem.isEnd()
|| pedalboardItem.isSplit()) {
return false;
}
return true;
}
handleLoadPluginPreset(instanceId: number) {
this.handlePresetsMenuClose();
this.model.loadPluginPreset(this.props.instanceId, instanceId);
let presetName = this.getPresetName(instanceId);
this.setState({ saveAsName: presetName });
}
getPresetName(instanceId: number)
{
for (let preset of this.state.presets.presets)
{
if (preset.instanceId === instanceId)
{
getPresetName(instanceId: number) {
for (let preset of this.state.presets.presets) {
if (preset.instanceId === instanceId) {
return preset.label;
}
}
@@ -171,62 +196,64 @@ const PluginPresetSelector =
}
loadPresets(): void {
if (!this.currentUri) return;
let captureUri: string = this.currentUri;
if (this.props.pedalboardItem === null) return;
if (!this.hasPresets(this.props.pedalboardItem)) return;
let captureUri: string = this.props.pedalboardItem.uri;
this.model.getPluginPresets(captureUri)
.then((presets: PluginUiPresets) => {
if (captureUri === this.currentUri)
{
if (captureUri === this.props.pedalboardItem?.uri) {
this.setState({ presets: presets });
}
})
.catch(error => {
if (captureUri === this.currentUri)
{
if (captureUri === this.props.pedalboardItem?.uri) {
this.setState({ presets: new PluginUiPresets() });
}
});
}
onPluginPresetsChanged(pluginUri: string): void {
if (pluginUri === this.props.pluginUri)
{
if (pluginUri === this.props.pedalboardItem?.uri) {
this.loadPresets();
}
}
_pluginPresetsChangedHandle?: PluginPresetsChangedHandle;
componentDidMount()
{
componentDidMount() {
this._pluginPresetsChangedHandle = this.model.addPluginPresetsChangedListener(
(pluginUri: string) => {
this.onPluginPresetsChanged(pluginUri);
}
);
}
componentWillUnmount()
{
if (this._pluginPresetsChangedHandle)
{
componentWillUnmount() {
if (this._pluginPresetsChangedHandle) {
this.model.removePluginPresetsChangedListener(this._pluginPresetsChangedHandle);
this._pluginPresetsChangedHandle = undefined;
}
}
currentUri?: string = "";
componentDidUpdate()
currentPedalboard?: PedalboardItem;
componentDidUpdate(
prevProps: Readonly<PluginPresetSelectorProps>,
prevState: Readonly<PluginPresetSelectorState>,
snapshot?: any): void
{
if (this.currentUri !== this.props.pluginUri)
{
this.currentUri = this.props.pluginUri;
if (!this.props.pluginUri)
if (this.props.pedalboardItem !== prevProps.pedalboardItem) {
this.setState({
isVisible: this.isVisible(this.props.pedalboardItem),
hasPresets: this.hasPresets(this.props.pedalboardItem) });
if (this.props.pedalboardItem) {
if (this.props.pedalboardItem.isEmpty())
{
this.setState({ presets: new PluginUiPresets() });
} else {
} else
{
this.loadPresets();
}
}
}
}
handleRenameDialogClose(): void {
this.setState({
renameDialogOpen: false,
@@ -244,8 +271,38 @@ const PluginPresetSelector =
}
isMenuCopyPluginEnabled(): boolean {
return this.state.hasPresets;
}
handleMenuCopyPlugin(): void {
this.handlePresetsMenuClose();
let pedalboard: Pedalboard = this.model.pedalboard.get();;
handleMenuEditPluginPresets(): void {
let pedalboardItem: PedalboardItem | null = pedalboard.tryGetItem(this.props.instanceId);
if (pedalboardItem === null) {
pluginClipboardContents = null;
this.setState({ isPastePluginEnabled: false });
return;
}
pluginClipboardContents = pedalboardItem.clone();
this.setState({ isPastePluginEnabled: true });
}
private isMenuPastePluginEnabled(): boolean {
return this.state.isPastePluginEnabled;
}
private handleMenuPastePlugin(): void {
this.handlePresetsMenuClose();
if (pluginClipboardContents) {
this.model.replacePedalboarditem(this.props.instanceId, pluginClipboardContents.clone());
}
}
private handleMenuEditPluginPresets(): void {
this.handlePresetsMenuClose();
this.showEditPluginPresetsDialog(true);
}
@@ -282,13 +339,42 @@ const PluginPresetSelector =
//this.model.loadPreset(event.target.value as number);
}
buildMenuItems() {
let result : React.ReactNode[] = [];
if (this.state.hasPresets) {
result.push((<MenuItem key="menuSaveAs" onClick={(e) => this.handlePluginPresetsMenuSaveAs(e)}>Save plugin preset...</MenuItem>));
result.push((<MenuItem key="menuEdit" onClick={(e) => this.handleMenuEditPluginPresets()}>Manage plugin presets...</MenuItem>));
result.push((<Divider key="divider1" />));
}
let hasPresets = false;
for (let preset of this.state.presets.presets) {
result.push((
<MenuItem key={preset.instanceId}
onClick={(e) => this.handleLoadPluginPreset(preset.instanceId)}
>
<PluginPresetIcon className={this.props.classes?.pluginMenuIcon ?? ""} />
{preset.label}</MenuItem>
));
hasPresets = true;
}
if (hasPresets) {
result.push((<Divider key="divider2" />));
}
result.push(
<MenuItem key="menuCopy" disabled={!this.isMenuCopyPluginEnabled()} onClick={(e) => this.handleMenuCopyPlugin()}>Copy plugin</MenuItem>
);
result.push(
<MenuItem key="menuPaste" disabled={!this.isMenuPastePluginEnabled()} style={{ opacity: this.isMenuPastePluginEnabled() ? 1 : 0.4 }} onClick={(e) => this.handleMenuPastePlugin()}>Paste plugin</MenuItem>
);
return result;
}
render() {
const classes = withStyles.getClasses(this.props);
//const classes = withStyles.getClasses(this.props);
//const classes = withStyles.getClasses(this.props);
if ((!this.props.pluginUri))
{
if (!this.state.isVisible) {
return (<div />);
}
return (
@@ -311,29 +397,18 @@ const PluginPresetSelector =
}
>
<MenuItem onClick={(e) => this.handlePluginPresetsMenuSaveAs(e)}>Save plugin preset...</MenuItem>
<MenuItem onClick={(e) => this.handleMenuEditPluginPresets()}>Manage plugin presets...</MenuItem>
{ this.state.presets.presets.length !== 0 &&
(<Divider/>)
}
{
this.state.presets.presets.map((preset) => {
return (<MenuItem key={preset.instanceId}
onClick={(e) => this.handleLoadPluginPreset(preset.instanceId)}
>
<PluginPresetIcon className={classes.pluginMenuIcon}/>
{preset.label}</MenuItem>);
})
this.buildMenuItems()
}
</Menu>
{this.state.hasPresets && this.state.showPresetsDialog && (
<PluginPresetsDialog
instanceId={this.props.instanceId}
presets={this.state.presets}
show={this.state.showPresetsDialog}
isEditDialog={this.state.showEditPresetsDialog}
onDialogClose={() => this.handleDialogClose()} />
)}
<RenameDialog open={this.state.renameDialogOpen}
title="Rename"
defaultName={this.state.renameDialogDefaultName}