Custom plugin display name. Rename dialog cosmetics.

This commit is contained in:
Robin E. R. Davies
2025-06-24 16:27:53 -04:00
parent 98ee16bb82
commit 2974033128
12 changed files with 631 additions and 545 deletions
+1
View File
@@ -1031,6 +1031,7 @@ export
<RenameDialog
open={this.state.renameBankDialogOpen || this.state.saveBankAsDialogOpen}
defaultName={this.model_.banks.get().getSelectedEntryName()}
title="Bank Name"
acceptActionName={this.state.renameBankDialogOpen ? "Rename" : "Save as"}
onClose={() => {
this.setState({
+2 -1
View File
@@ -458,7 +458,7 @@ const BankDialog = withStyles(
<div style={{ flex: "0 0 auto", display: "flex", flexFlow: "row nowrap", alignItems: "center" }}>
<Button color="inherit" onClick={(e) => this.handleCopy()}>
Copy
Save as
</Button>
<Button color="inherit" onClick={() => this.handleRenameClick()}>
Rename
@@ -466,6 +466,7 @@ const BankDialog = withStyles(
<RenameDialog
open={this.state.filenameDialogOpen}
defaultName={this.getSelectedName()}
title={this.state.filenameSaveAs ? "Save Bank As" : "Bank Name"}
acceptActionName={this.state.filenameSaveAs ? "SAVE AS" : "RENAME"}
onClose={() => { this.setState({ filenameDialogOpen: false }) }}
onOk={(text: string) => {
+2
View File
@@ -1599,6 +1599,7 @@ export default withStyles(
<RenameDialog open={this.state.newFolderDialogOpen} defaultName=""
onOk={(newName) => { this.setState({ newFolderDialogOpen: false }); this.onExecuteNewFolder(newName) }}
onClose={() => { this.setState({ newFolderDialogOpen: false }); }}
title="New folder"
acceptActionName="OK"
/>
)
@@ -1606,6 +1607,7 @@ export default withStyles(
{
this.state.renameDialogOpen && (
<RenameDialog open={this.state.renameDialogOpen} defaultName={this.renameDefaultName()}
title="Rename"
onOk={(newName) => { this.setState({ renameDialogOpen: false }); this.onExecuteRename(newName) }}
onClose={() => { this.setState({ renameDialogOpen: false }); }}
acceptActionName="OK"
File diff suppressed because it is too large Load Diff
+2
View File
@@ -61,6 +61,7 @@ export class ControlValue implements Deserializable<ControlValue> {
export class PedalboardItem implements Deserializable<PedalboardItem> {
deserializePedalboardItem(input: any): PedalboardItem {
this.instanceId = input.instanceId ?? -1;
this.title = input.title ?? "";
this.uri = input.uri;
this.pluginName = input.pluginName;
this.isEnabled = input.isEnabled;
@@ -199,6 +200,7 @@ export class PedalboardItem implements Deserializable<PedalboardItem> {
static EmptyArray: PedalboardItem[] = [];
instanceId: number = -1;
title: string = "";
isEnabled: boolean = false;
uri: string = "";
pluginName?: string;
+3
View File
@@ -329,6 +329,9 @@ class PedalLayout {
this.pluginType = uiPlugin.plugin_type;
this.iconUrl = SelectIconUri(uiPlugin.plugin_type);
this.name = uiPlugin.label;
if (pedalItem.title !== "") {
this.name = pedalItem.title;
}
this.numberOfInputs = Math.min(uiPlugin.audio_inputs, 2);
this.numberOfOutputs = Math.min(uiPlugin.audio_outputs, 2);
} else {
+16 -1
View File
@@ -3153,7 +3153,22 @@ export class PiPedalModel //implements PiPedalModel
30 * 1000);
}
setPedalboardItemTitle(instanceId: number, title: string): void {
let pedalboard = this.pedalboard.get();
if (!pedalboard) {
throw new PiPedalStateError("Pedalboard not loaded.");
}
let newPedalboard = pedalboard.clone();
this.updateVst3State(newPedalboard);
let item = newPedalboard.getItem(instanceId);
if (item.title === title) {
return;
}
item.title = title;
this.pedalboard.set(newPedalboard);
// notify the server.
// xxx;
}
};
let instance: PiPedalModel | undefined = undefined;
@@ -335,6 +335,7 @@ const PluginPresetSelector =
isEditDialog={this.state.showEditPresetsDialog}
onDialogClose={() => this.handleDialogClose()} />
<RenameDialog open={this.state.renameDialogOpen}
title="Rename"
defaultName={this.state.renameDialogDefaultName}
acceptActionName={this.state.renameDialogActionName}
onClose={() => this.handleRenameDialogClose()}
+1
View File
@@ -413,6 +413,7 @@ const PluginPresetsDialog = withStyles(
Rename
</Button>
<RenameDialog
title="Rename"
open={this.state.renameOpen}
defaultName={this.getSelectedName()}
acceptActionName={"Rename"}
+1
View File
@@ -395,6 +395,7 @@ const PresetDialog = withStyles(
Rename
</Button>
<RenameDialog
title="Rename"
open={this.state.renameOpen}
defaultName={this.getSelectedName()}
acceptActionName={"Rename"}
+7 -3
View File
@@ -50,6 +50,7 @@ interface PresetSelectorState {
presetsMenuAnchorRef: HTMLElement | null;
renameDialogOpen: boolean;
renameDialogTitle: string;
renameDialogDefaultName: string;
renameDialogActionName: string;
renameDialogOnOk?: (name: string) => void;
@@ -95,6 +96,7 @@ const PresetSelector =
showEditPresetsDialog: false,
presetsMenuAnchorRef: null,
renameDialogOpen: false,
renameDialogTitle: "",
renameDialogDefaultName: "",
renameDialogActionName: "",
renameDialogOnOk: undefined,
@@ -144,7 +146,7 @@ const PresetSelector =
if (item == null) return;
let name = item.name;
this.renameDialogOpen(name, "Save As")
this.renameDialogOpen(name, "Save Preset As", "OK")
.then((newName) => {
return this.model.saveCurrentPresetAs(newName);
})
@@ -167,7 +169,7 @@ const PresetSelector =
if (item == null) return;
let name = item.name;
this.renameDialogOpen(name, "Rename")
this.renameDialogOpen(name, "Rename Preset", "OK")
.then((newName) => {
if (newName === name) return;
return this.model.renamePresetItem(this.model.presets.get().selectedInstanceId, newName);
@@ -196,12 +198,13 @@ const PresetSelector =
showError(error: string) {
this.model.showAlert(error);
}
renameDialogOpen(defaultText: string, acceptButtonText: string): Promise<string> {
renameDialogOpen(defaultText: string, title: string,acceptButtonText: string): Promise<string> {
let result = new Promise<string>(
(resolve, reject) => {
this.setState(
{
renameDialogOpen: true,
renameDialogTitle: title,
renameDialogDefaultName: defaultText,
renameDialogActionName: acceptButtonText,
renameDialogOnOk: (name) => {
@@ -365,6 +368,7 @@ const PresetSelector =
</div>
<PresetDialog show={this.state.showPresetsDialog} isEditDialog={this.state.showEditPresetsDialog} onDialogClose={() => this.handleDialogClose()} />
<RenameDialog open={this.state.renameDialogOpen}
title={this.state.renameDialogTitle}
defaultName={this.state.renameDialogDefaultName}
acceptActionName={this.state.renameDialogActionName}
onClose={() => this.handleRenameDialogClose()}
+12 -5
View File
@@ -20,6 +20,7 @@
import React from 'react';
import Button from '@mui/material/Button';
import DialogEx from './DialogEx';
import DialogTitle from '@mui/material/DialogTitle';
import DialogActions from '@mui/material/DialogActions';
import DialogContent from '@mui/material/DialogContent';
import { nullCast } from './Utility';
@@ -33,6 +34,9 @@ export interface RenameDialogProps {
open: boolean,
defaultName: string,
acceptActionName: string,
title: string,
allowEmpty?: boolean,
label?: string,
onOk: (text: string) => void,
onClose: () => void
};
@@ -102,7 +106,7 @@ export default class RenameDialog extends ResizeResponsiveComponent<RenameDialog
model.showAlert(e.toString());
return;
}
if (text.length === 0) return;
if (text.length === 0 && props.allowEmpty !== true) return;
onOk(text);
}
const handleKeyDown = (event: React.KeyboardEvent<HTMLDivElement>): void => {
@@ -119,20 +123,23 @@ export default class RenameDialog extends ResizeResponsiveComponent<RenameDialog
style={{userSelect: "none"}}
onEnterKey={()=>{}}
>
<DialogContent style={{minHeight: 96}}>
<DialogTitle>
{props.title ?? "Rename"}
</DialogTitle>
<DialogContent >
<TextField
onKeyDown={handleKeyDown}
margin="dense"
variant="outlined"
variant="standard"
slotProps={{
input: {
style: { scrollMargin: 24 }
}
}}
id="name"
label="Name"
type="text"
label={props.label ?? "Name"}
fullWidth
defaultValue={defaultName}
inputRef={this.refText}