Skip to content

Commit

Permalink
progress on mapping editor controls layout
Browse files Browse the repository at this point in the history
  • Loading branch information
@vsicurella
vsicurella committed Jun 5, 2024
1 parent 7bde0b5 commit 4496658
Show file tree
Hide file tree
Showing 4 changed files with 228 additions and 19 deletions.
84 changes: 69 additions & 15 deletions Source/mapping_editors/KeyEditorControls.cpp
View file
Original file line number Diff line number Diff line change
Expand Up @@ -14,6 +14,10 @@
#include "../colour_view_component.h"
#include "../lumatone_editor_library/palettes/colour_edit_textbox.h"

#include "../ColourPaletteWindow.h"
// #include "../lumatone_editor_library/palettes/palette_selection_panel.h"
#include "../lumatone_editor_library/palettes/colour_picker_panel.h"

KeyEditorControls::KeyEditorControls(const LumatoneEditorState& stateIn)
: LumatoneEditorState(stateIn)
, juce::Component("KeyEditorControls")
Expand All @@ -23,9 +27,6 @@ KeyEditorControls::KeyEditorControls(const LumatoneEditorState& stateIn)
lblKeySettings->setFont(getAppFonts().getFont(LumatoneEditorFont::FranklinGothic));
addAndMakeVisible(lblKeySettings.get());

colourControlTabs = std::make_unique<juce::TabbedComponent>(juce::TabbedButtonBar::Orientation::TabsAtTop);
addAndMakeVisible(colourControlTabs.get());

colourTextEditor = std::make_unique<ColourTextEditor>("colourTextEditor", "000000");
addAndMakeVisible(colourTextEditor.get());

Expand All @@ -35,7 +36,7 @@ KeyEditorControls::KeyEditorControls(const LumatoneEditorState& stateIn)
colourPickerToggle = std::make_unique<juce::TextButton>("Pick");
addAndMakeVisible(colourPickerToggle.get());

keyTypeCombo = std::make_unique<juce::ComboBox>();
keyTypeCombo = std::make_unique<juce::ComboBox>("keyTypeCombo");
keyTypeCombo->setEditableText (false);
keyTypeCombo->setJustificationType (juce::Justification::centredLeft);
keyTypeCombo->setTextWhenNothingSelected (juce::String());
Expand All @@ -46,31 +47,68 @@ KeyEditorControls::KeyEditorControls(const LumatoneEditorState& stateIn)
keyTypeCombo->addItem (juce::translate("Disabled"), 4);
addAndMakeVisible(keyTypeCombo.get());

noteInput = std::make_unique<juce::Slider>();
noteInput = std::make_unique<juce::Slider>("noteInput");
noteInput->setTooltip (juce::translate("MIDI note or MIDI controller no. (for key type \'continuous controller\')"));
noteInput->setRange (0, 127, 1);
noteInput->setSliderStyle (juce::Slider::IncDecButtons);
noteInput->setTextBoxStyle (juce::Slider::TextBoxLeft, false, 56, 20);
// noteInput->addListener (this);
addAndMakeVisible(noteInput.get());

channelInput = std::make_unique<juce::Slider>();
channelInput = std::make_unique<juce::Slider>("channelInput");
channelInput->setRange (1, 16, 1);
channelInput->setSliderStyle (juce::Slider::IncDecButtons);
channelInput->setTextBoxStyle (juce::Slider::TextBoxLeft, false, 56, 20);
addAndMakeVisible(channelInput.get());

lblColour = std::make_unique<juce::Label>("lblColour", "Key Colour: ");
lblColour->setFont(getAppFonts().getFont(LumatoneEditorFont::FranklinGothic));
lblColour->setJustificationType(juce::Justification::centredLeft);
lblColour->setColour(juce::Label::ColourIds::textColourId, getEditorLookAndFeel().findColour(LumatoneEditorColourIDs::DescriptionText));
addAndMakeVisible(lblColour.get());

lblKeyType = std::make_unique<juce::Label>("lblKeyType", "Key Type: ");
lblKeyType->setFont(getAppFonts().getFont(LumatoneEditorFont::FranklinGothic));
lblKeyType->setJustificationType(juce::Justification::centredLeft);
lblKeyType->setColour(juce::Label::ColourIds::textColourId, getEditorLookAndFeel().findColour(LumatoneEditorColourIDs::DescriptionText));
addAndMakeVisible(lblKeyType.get());

lblNote = std::make_unique<juce::Label>("lblNote", "MIDI Note: ");
lblNote->setFont(getAppFonts().getFont(LumatoneEditorFont::FranklinGothic));
lblNote->setJustificationType(juce::Justification::centredLeft);
lblNote->setColour(juce::Label::ColourIds::textColourId, getEditorLookAndFeel().findColour(LumatoneEditorColourIDs::DescriptionText));
addAndMakeVisible(lblNote.get());

lblChannel = std::make_unique<juce::Label>("lblChannel", "MIDI Channel: ");
lblChannel->setFont(getAppFonts().getFont(LumatoneEditorFont::FranklinGothic));
lblChannel->setJustificationType(juce::Justification::centredLeft);
lblChannel->setColour(juce::Label::ColourIds::textColourId, getEditorLookAndFeel().findColour(LumatoneEditorColourIDs::DescriptionText));
addAndMakeVisible(lblChannel.get());

colourPalettePanel = std::make_unique<ColourPaletteWindow>(stateIn);
addAndMakeVisible(colourPalettePanel.get());
// colourPickerPanel = std::make_unique<CustomPickerPanel>();

// juce::Colour colourControlBackground = getEditorLookAndFeel().findColour(LumatoneEditorColourIDs::ColourPaletteBackground);
// colourControlTabs = std::make_unique<juce::TabbedComponent>(juce::TabbedButtonBar::Orientation::TabsAtTop);
// colourControlTabs->addTab("Colour Palettes", colourControlBackground, colourPalettePanel.get(), false);
// colourControlTabs->addTab("Custom Picker", colourControlBackground, colourPickerPanel.get(), false);
// addAndMakeVisible(colourControlTabs.get());

}

KeyEditorControls::~KeyEditorControls()
{
colourControlTabs = nullptr;
colourPickerPanel = nullptr;
colourPalettePanel = nullptr;

channelInput = nullptr;
noteInput = nullptr;
keyTypeCombo = nullptr;
colourPickerToggle = nullptr;
colourSubwindow = nullptr;
colourTextEditor = nullptr;
colourControlTabs = nullptr;
lblKeySettings = nullptr;
}

Expand All @@ -88,29 +126,45 @@ void KeyEditorControls::resized()
float w = (float)getWidth();
float h = (float)getHeight();

auto roundedCornerSize = getRoundedRectCornerSize();
// labelMarginWidth = roundToInt(roundedCornerSize * 0.25f);

headerHeight = roundToInt(h * headerH);
headerPath = getConnectedRoundedRectPath(getLocalBounds().withBottom(headerHeight + 1).toFloat(), getRoundedRectCornerSize(), juce::Button::ConnectedEdgeFlags::ConnectedOnBottom);
controlPath = getConnectedRoundedRectPath(getLocalBounds().withTop(headerHeight).toFloat(), getRoundedRectCornerSize(), juce::Button::ConnectedEdgeFlags::ConnectedOnTop);
headerPath = getConnectedRoundedRectPath(getLocalBounds().withBottom(headerHeight + 1).toFloat(), roundedCornerSize, juce::Button::ConnectedEdgeFlags::ConnectedOnBottom);
controlPath = getConnectedRoundedRectPath(getLocalBounds().withTop(headerHeight).toFloat(), roundedCornerSize, juce::Button::ConnectedEdgeFlags::ConnectedOnTop);

contentMarginWidth = roundToInt(w * contentMarginW);
contentMarginWidth = roundToInt(getParentWidth() * contentMarginParentW);
contentMarginHeight = roundToInt(h * controlMarginH);

labelHeight = roundToInt(headerHeight * labelToHeaderH);
lblKeySettings->setTopLeftPosition(contentMarginWidth, 0);
resizeLabelWithHeight(lblKeySettings.get(), headerHeight, labelToHeaderH);

keyControlColumnWidth = roundToInt(w * keyControlColumnW);
keyControlColumnRight = contentMarginWidth + keyControlColumnWidth;

keyControlHeight = roundToInt(h * keyControlH);
keyControlMarginHeight = roundToInt(h * keyControlMarginH);

colourTextEditor->setBounds(contentMarginWidth, headerHeight + contentMarginHeight, keyControlColumnWidth, keyControlHeight);
keyTypeCombo->setBounds(contentMarginWidth, colourTextEditor->getBottom() + keyControlMarginHeight, keyControlColumnWidth, keyControlHeight);
noteInput->setBounds(contentMarginWidth, keyTypeCombo->getBottom() + keyControlMarginHeight, keyControlColumnWidth, keyControlHeight);
channelInput->setBounds(contentMarginWidth, noteInput->getBottom() + keyControlMarginHeight, keyControlColumnWidth, keyControlHeight);
lblColour->setTopLeftPosition(contentMarginWidth, headerHeight + contentMarginHeight);
resizeLabelWithHeight(lblColour.get(), keyControlHeight, controlLabelFontScalar);
colourTextEditor->setBounds(lblColour->getRight(), lblColour->getY(), keyControlColumnRight - lblColour->getRight(), keyControlHeight);

lblKeyType->setTopLeftPosition(contentMarginWidth, lblColour->getBottom() + keyControlMarginHeight);
resizeLabelWithHeight(lblKeyType.get(), keyControlHeight, controlLabelFontScalar);
keyTypeCombo->setBounds(lblKeyType->getRight(), lblKeyType->getY(), keyControlColumnRight - lblKeyType->getRight(), keyControlHeight);

lblNote->setTopLeftPosition(contentMarginWidth, keyTypeCombo->getBottom() + keyControlMarginHeight);
resizeLabelWithHeight(lblNote.get(), keyControlHeight, controlLabelFontScalar);
noteInput->setBounds(lblNote->getRight(), lblNote->getY(), keyControlColumnRight - lblNote->getRight(), keyControlHeight);

lblChannel->setTopLeftPosition(contentMarginWidth, noteInput->getBottom() + keyControlMarginHeight);
resizeLabelWithHeight(lblChannel.get(), keyControlHeight, controlLabelFontScalar);
channelInput->setBounds(lblChannel->getRight(), lblChannel->getY(), keyControlColumnRight - lblChannel->getRight(), keyControlHeight);

colourColumnX = contentMarginWidth + keyControlColumnWidth + roundToInt(w * columnMarginW);
colourColumnWidth = w - colourColumnX - contentMarginWidth;
colourColumnHeight = roundToInt(h * colourColumnH);

colourControlTabs->setBounds(colourColumnX, headerHeight + contentMarginHeight, colourColumnWidth, colourColumnHeight);
colourPalettePanel->setBounds(colourColumnX, 0, colourColumnWidth, h - contentMarginHeight);
}
19 changes: 17 additions & 2 deletions Source/mapping_editors/KeyEditorControls.h
View file
Original file line number Diff line number Diff line change
Expand Up @@ -15,6 +15,9 @@

class ColourViewComponent;
class ColourTextEditor;
class ColourPaletteWindow;
class CustomPickerPanel;
class ColourPalettesPanel;

class KeyEditorControls : public LumatoneEditorState
, public juce::Component
Expand Down Expand Up @@ -43,22 +46,34 @@ class KeyEditorControls : public LumatoneEditorState
std::unique_ptr<juce::Slider> noteInput;
std::unique_ptr<juce::Slider> channelInput;

std::unique_ptr<juce::Label> lblColour;
std::unique_ptr<juce::Label> lblKeyType;
std::unique_ptr<juce::Label> lblNote;
std::unique_ptr<juce::Label> lblChannel;

std::unique_ptr<ColourPaletteWindow> colourPalettePanel;
// std::unique_ptr<> colourPalettePanel;
std::unique_ptr<CustomPickerPanel> colourPickerPanel;


const float headerH = 0.19f;
int headerHeight;
juce::Path headerPath;
juce::Path controlPath;

int contentMarginWidth;
const float contentMarginW = 0.0414f;
const float contentMarginParentW = 0.024f;

int contentMarginHeight;
const float controlMarginH = 0.08f;

int labelHeight;
const float labelToHeaderH = 0.5f;
// int labelMarginWidth;
const float labelToHeaderH = 0.5f;
const float controlLabelFontScalar = 0.7f;

int keyControlColumnWidth;
int keyControlColumnRight;
const float keyControlColumnW = 0.3f;

int keyControlHeight;
Expand Down
103 changes: 101 additions & 2 deletions Source/mapping_editors/MultiSelectControls.cpp
View file
Original file line number Diff line number Diff line change
Expand Up @@ -15,11 +15,68 @@ MultiSelectControls::MultiSelectControls(const LumatoneEditorState& stateIn)
: LumatoneEditorState(stateIn)
, juce::Component("MultiSelectControls")
{
lblMultiSelect = std::make_unique<juce::Label>("lblMultiSelect", "Multi-Select");
lblMultiSelect->setColour(juce::Label::ColourIds::textColourId, getEditorLookAndFeel().findColour(LumatoneEditorColourIDs::LabelBlue));
lblMultiSelect->setFont(getAppFonts().getFont(LumatoneEditorFont::FranklinGothic));
addAndMakeVisible(lblMultiSelect.get());

keyTypeCombo = std::make_unique<juce::ComboBox>("keyTypeCombo");
keyTypeCombo->setEditableText (false);
keyTypeCombo->setJustificationType (juce::Justification::centredLeft);
keyTypeCombo->setTextWhenNothingSelected (juce::String());
keyTypeCombo->setTextWhenNoChoicesAvailable (juce::translate("(no choices)"));
keyTypeCombo->addItem (juce::translate("Note on/Note off"), 1);
keyTypeCombo->addItem (juce::translate("Continuous controller"), 2);
keyTypeCombo->addItem (juce::translate("Lumatouch"), 3);
keyTypeCombo->addItem (juce::translate("Disabled"), 4);
addAndMakeVisible(keyTypeCombo.get());

noteInput = std::make_unique<juce::Slider>("noteInput");
noteInput->setTooltip (juce::translate("MIDI note or MIDI controller no. (for key type \'continuous controller\')"));
noteInput->setRange (0, 127, 1);
noteInput->setSliderStyle (juce::Slider::IncDecButtons);
// noteInput->setTextBoxStyle (juce::Slider::TextBoxLeft, false, 56, 20);
// noteInput->addListener (this);
addAndMakeVisible(noteInput.get());

channelInput = std::make_unique<juce::Slider>("channelInput");
channelInput->setRange (1, 16, 1);
channelInput->setSliderStyle (juce::Slider::IncDecButtons);
// channelInput->setTextBoxStyle (juce::Slider::TextBoxLeft, false, 56, 20);
addAndMakeVisible(channelInput.get());

lblColour = std::make_unique<juce::Label>("lblColour", "Colour");
lblColour->setFont(getAppFonts().getFont(LumatoneEditorFont::FranklinGothic));
lblColour->setJustificationType(juce::Justification::centredLeft);
addAndMakeVisible(lblColour.get());

lblKeyType = std::make_unique<juce::Label>("lblKeyType", "Key Type");
lblKeyType->setFont(getAppFonts().getFont(LumatoneEditorFont::FranklinGothic));
lblKeyType->setJustificationType(juce::Justification::centredLeft);
addAndMakeVisible(lblKeyType.get());

lblNote = std::make_unique<juce::Label>("lblNote", "Note #");
lblNote->setFont(getAppFonts().getFont(LumatoneEditorFont::FranklinGothic));
lblNote->setJustificationType(juce::Justification::centredLeft);
addAndMakeVisible(lblNote.get());

lblChannel = std::make_unique<juce::Label>("lblChannel", "Channel #");
lblChannel->setFont(getAppFonts().getFont(LumatoneEditorFont::FranklinGothic));
lblChannel->setJustificationType(juce::Justification::centredLeft);
addAndMakeVisible(lblChannel.get());

}

MultiSelectControls::~MultiSelectControls()
{
lblChannel = nullptr;
lblNote = nullptr;
lblKeyType = nullptr;
lblColour = nullptr;

channelInput = nullptr;
noteInput = nullptr;
keyTypeCombo = nullptr;

}

Expand All @@ -34,9 +91,51 @@ void MultiSelectControls::paint(juce::Graphics& g)

void MultiSelectControls::resized()
{
float w = (float)getWidth();
float h = (float)getHeight();

auto roundedCornerSize = getRoundedRectCornerSize();
labelMarginWidth = roundToInt(roundedCornerSize * 0.5f);

headerHeight = roundToInt(h * headerH);
headerPath = getConnectedRoundedRectPath(getLocalBounds().withBottom(headerHeight + 1).toFloat(), getRoundedRectCornerSize(), juce::Button::ConnectedEdgeFlags::ConnectedOnBottom);
controlPath = getConnectedRoundedRectPath(getLocalBounds().withTop(headerHeight).toFloat(), getRoundedRectCornerSize(), juce::Button::ConnectedEdgeFlags::ConnectedOnTop);
headerPath = getConnectedRoundedRectPath(getLocalBounds().withBottom(headerHeight + 1).toFloat(), roundedCornerSize, juce::Button::ConnectedEdgeFlags::ConnectedOnBottom);
controlPath = getConnectedRoundedRectPath(getLocalBounds().withTop(headerHeight).toFloat(), roundedCornerSize, juce::Button::ConnectedEdgeFlags::ConnectedOnTop);

contentMarginWidth = roundToInt(getParentWidth() * contentMarginParentW);
contentMarginHeight = roundToInt(h * controlMarginH);

labelHeight = roundToInt(headerHeight * labelToHeaderH);
lblMultiSelect->setTopLeftPosition(contentMarginWidth, 0);
resizeLabelWithHeight(lblMultiSelect.get(), headerHeight, labelToHeaderH);

controlLabelHeight = roundToInt(h * controlLabelH);

controlMarginHeight = roundToInt(h * controlMarginH);
controlHeight = roundToInt(h * controlH);

colourTypeColumnWidth = roundToInt(w * colourTypeColumnW);

lblColour->setTopLeftPosition(contentMarginWidth + labelMarginWidth, headerHeight + contentMarginHeight);
resizeLabelWithHeight(lblColour.get(), labelHeight, controlLabelFontScalar);

// fix with colour component
lblKeyType->setTopLeftPosition(contentMarginWidth + labelMarginWidth, lblColour->getBottom() + controlHeight + controlMarginHeight);
resizeLabelWithHeight(lblKeyType.get(), labelHeight, controlLabelFontScalar);

keyTypeCombo->setBounds(contentMarginWidth, lblKeyType->getBottom(), colourTypeColumnWidth, controlHeight);

noteChannelColumnWidth = roundToInt(w * noteChannelColumnW);
noteChannelColumnX = (int)w - noteChannelColumnWidth - roundToInt(contentMarginWidth * 0.5f);

lblNote->setTopLeftPosition(noteChannelColumnX + labelMarginWidth, headerHeight + contentMarginHeight);
resizeLabelWithHeight(lblNote.get(), labelHeight, controlLabelFontScalar);

noteInput->setBounds(noteChannelColumnX, lblNote->getBottom(), noteChannelColumnWidth, controlHeight);
noteInput->setTextBoxStyle(juce::Slider::TextBoxLeft, false, roundToInt(noteInput->getWidth() * 0.75f), roundToInt(noteInput->getHeight() * 0.8f));

lblChannel->setTopLeftPosition(noteChannelColumnX + labelMarginWidth, noteInput->getBottom() + controlMarginHeight);
resizeLabelWithHeight(lblChannel.get(), labelHeight, controlLabelFontScalar);

channelInput->setBounds(noteChannelColumnX, lblChannel->getBottom(), noteChannelColumnWidth, controlHeight);
channelInput->setTextBoxStyle(juce::Slider::TextBoxLeft, false, roundToInt(channelInput->getWidth() * 0.6f), roundToInt(channelInput->getHeight() * 0.8f));
}
41 changes: 41 additions & 0 deletions Source/mapping_editors/MultiSelectControls.h
View file
Original file line number Diff line number Diff line change
Expand Up @@ -25,11 +25,52 @@ class MultiSelectControls : public LumatoneEditorState
void resized() override;

private:

std::unique_ptr<juce::Label> lblMultiSelect;

// colourinput
std::unique_ptr<juce::ComboBox> keyTypeCombo;
std::unique_ptr<juce::Slider> noteInput;
std::unique_ptr<juce::Slider> channelInput;

std::unique_ptr<juce::Label> lblColour;
std::unique_ptr<juce::Label> lblKeyType;
std::unique_ptr<juce::Label> lblNote;
std::unique_ptr<juce::Label> lblChannel;


const float headerH = 0.19f;
int headerHeight;
juce::Path headerPath;
juce::Path controlPath;

int contentMarginWidth;
const float contentMarginParentW = 0.024f;

int contentMarginHeight;
const float controlMarginH = 0.08f;

int labelHeight;
int labelMarginWidth;
const float labelToHeaderH = 0.5f;


int controlHeight;
const float controlH = 0.13f;

int controlLabelHeight;
const float controlLabelH = 0.12f;
const float controlLabelFontScalar = 0.66f;

int controlMarginHeight;
// const float controlMarginH = 0.08f;

int colourTypeColumnWidth;
const float colourTypeColumnW = 0.43f;

int noteChannelColumnX;
int noteChannelColumnWidth;
const float noteChannelColumnW = 0.27f;
};

#endif // LUMATONE_EDITOR_MULTI_SELECT_CONTROLS_H

0 comments on commit 4496658

Please sign in to comment.