Add Controller Buttons

src/ui/Utils.cpp

@@ -59,6 +59,10 @@ namespace utils {
 		return getAppRootDir().getChildFile("./licenses/");
 	}
 
+	const juce::File getIconDir() {
+		return getAppRootDir().getChildFile("./RemixIcon/");
+	}
+
 	const juce::File getConfigDir() {
 		return getDataDir().getChildFile("./config/");
 	}
@@ -75,6 +79,10 @@ namespace utils {
 		return getTransDir().getChildFile("./" + name + "/");
 	}
 
+	const juce::File getIconClassDir(const juce::String& name) {
+		return getIconDir().getChildFile("./" + name + "/");
+	}
+
 	const juce::File getConfigFile(const juce::String& name,
 		const juce::String& type) {
 		return getConfigDir().getChildFile(name + type);
@@ -119,6 +127,12 @@ namespace utils {
 		return getLayoutDir().getChildFile(name + type);
 	}
 
+	const juce::File getIconFile(
+		const juce::String& className, const juce::String& name,
+		const juce::String& type) {
+		return getIconClassDir(className).getChildFile(name + type);
+	}
+
 	const juce::File getPluginBlackListFile(
 		const juce::String& file) {
 		return getAudioDir().getChildFile(file);

src/ui/Utils.h

@@ -15,11 +15,13 @@ namespace utils {
 	const juce::File getTransDir();
 	const juce::File getDataDir();
 	const juce::File getLicenseDir();
+	const juce::File getIconDir();
 
 	const juce::File getConfigDir();
 	const juce::File getAudioDir();
 	const juce::File getThemeRootDir(const juce::String& name);
 	const juce::File getTransRootDir(const juce::String& name);
+	const juce::File getIconClassDir(const juce::String& name);
 
 	const juce::File getConfigFile(const juce::String& name,
 		const juce::String& type = ".json");
@@ -38,6 +40,9 @@ namespace utils {
 		const juce::String& file = "config.json");
 	const juce::File getLayoutFile(const juce::String& name,
 		const juce::String& type = ".json");
+	const juce::File getIconFile(
+		const juce::String& className, const juce::String& name,
+		const juce::String& type = ".svg");
 
 	const juce::File getPluginBlackListFile(
 		const juce::String& file = "blackPlugins.txt");

src/ui/component/ControllerComponent.cpp

@@ -0,0 +1,136 @@
+#include "ControllerComponent.h"
+#include "../lookAndFeel/LookAndFeelFactory.h"
+#include "../Utils.h"
+#include <IconManager.h>
+
+ControllerComponent::ControllerComponent() {
+	/** Look And Feel */
+	this->setLookAndFeel(
+		LookAndFeelFactory::getInstance()->forController());
+
+	/** Icons */
+	this->playIcon = flowUI::IconManager::getSVG(
+		utils::getIconFile("Media", "play-fill").getFullPathName());
+	this->playIcon->replaceColour(juce::Colours::black, juce::Colours::green);
+	this->pauseIcon = flowUI::IconManager::getSVG(
+		utils::getIconFile("Media", "pause-fill").getFullPathName());
+	this->pauseIcon->replaceColour(juce::Colours::black,
+		this->getLookAndFeel().findColour(juce::TextButton::ColourIds::textColourOffId));
+	this->stopIcon = flowUI::IconManager::getSVG(
+		utils::getIconFile("Media", "stop-fill").getFullPathName());
+	this->stopIcon->replaceColour(juce::Colours::black,
+		this->getLookAndFeel().findColour(juce::TextButton::ColourIds::textColourOffId));
+	this->recordIcon = flowUI::IconManager::getSVG(
+		utils::getIconFile("Design", "circle-fill").getFullPathName());
+	this->recordIcon->replaceColour(juce::Colours::black, juce::Colours::darkred);
+	this->recordOnIcon = flowUI::IconManager::getSVG(
+		utils::getIconFile("Design", "circle-fill").getFullPathName());
+	this->recordOnIcon->replaceColour(juce::Colours::black, juce::Colours::red);
+
+	this->rewindIcon = flowUI::IconManager::getSVG(
+		utils::getIconFile("Media", "skip-back-fill").getFullPathName());
+	this->rewindIcon->replaceColour(juce::Colours::black,
+		this->getLookAndFeel().findColour(juce::TextButton::ColourIds::textColourOffId));
+	this->followIcon = flowUI::IconManager::getSVG(
+		utils::getIconFile("Arrows", "arrow-right-fill").getFullPathName());
+	this->followIcon->replaceColour(juce::Colours::black,
+		this->getLookAndFeel().findColour(juce::TextButton::ColourIds::textColourOffId));
+	this->followOnIcon = flowUI::IconManager::getSVG(
+		utils::getIconFile("Arrows", "arrow-right-fill").getFullPathName());
+	this->followOnIcon->replaceColour(juce::Colours::black,
+		this->getLookAndFeel().findColour(juce::TextButton::ColourIds::textColourOnId));
+
+	/** Buttons */
+	this->playButton = std::make_unique<juce::DrawableButton>(
+		TRANS("Play/Pause"), juce::DrawableButton::ButtonStyle::ImageOnButtonBackgroundOriginalSize);
+	this->playButton->setImages(
+		this->playIcon.get(), nullptr, nullptr, nullptr,
+		this->pauseIcon.get(), nullptr, nullptr, nullptr);
+	this->playButton->setWantsKeyboardFocus(false);
+	this->playButton->setMouseCursor(juce::MouseCursor::PointingHandCursor);
+	this->addAndMakeVisible(this->playButton.get());
+
+	this->stopButton = std::make_unique<juce::DrawableButton>(
+		TRANS("Stop"), juce::DrawableButton::ButtonStyle::ImageOnButtonBackgroundOriginalSize);
+	this->stopButton->setImages(this->stopIcon.get());
+	this->stopButton->setWantsKeyboardFocus(false);
+	this->stopButton->setMouseCursor(juce::MouseCursor::PointingHandCursor);
+	this->addAndMakeVisible(this->stopButton.get());
+
+	this->recordButton = std::make_unique<juce::DrawableButton>(
+		TRANS("Record"), juce::DrawableButton::ButtonStyle::ImageOnButtonBackgroundOriginalSize);
+	this->recordButton->setImages(
+		this->recordIcon.get(), nullptr, nullptr, nullptr,
+		this->recordOnIcon.get(), nullptr, nullptr, nullptr);
+	this->recordButton->setWantsKeyboardFocus(false);
+	this->recordButton->setMouseCursor(juce::MouseCursor::PointingHandCursor);
+	this->addAndMakeVisible(this->recordButton.get());
+
+	this->rewindButton = std::make_unique<juce::DrawableButton>(
+		TRANS("Rewind"), juce::DrawableButton::ButtonStyle::ImageOnButtonBackgroundOriginalSize);
+	this->rewindButton->setImages(this->rewindIcon.get());
+	this->rewindButton->setWantsKeyboardFocus(false);
+	this->rewindButton->setMouseCursor(juce::MouseCursor::PointingHandCursor);
+	this->addAndMakeVisible(this->rewindButton.get());
+
+	this->followButton = std::make_unique<juce::DrawableButton>(
+		TRANS("Follow"), juce::DrawableButton::ButtonStyle::ImageOnButtonBackgroundOriginalSize);
+	this->followButton->setImages(
+		this->followIcon.get(), nullptr, nullptr, nullptr,
+		this->followOnIcon.get(), nullptr, nullptr, nullptr);
+	this->followButton->setWantsKeyboardFocus(false);
+	this->followButton->setMouseCursor(juce::MouseCursor::PointingHandCursor);
+	this->addAndMakeVisible(this->followButton.get());
+}
+
+void ControllerComponent::resized() {
+	auto screenSize = utils::getScreenSize(this);
+
+	/** Size */
+	int paddingHeight = this->getHeight() * 0.1;
+	int paddingWidth = this->getHeight() * 0.1;
+	int splitHeight = this->getHeight() * 0.05;
+	int splitWidth = this->getHeight() * 0.05;
+
+	int rightPos = this->getWidth() - paddingWidth;
+	int buttonHeight = this->getHeight() * 0.6;
+
+	/** Record Button */
+	this->recordButton->setBounds(
+		rightPos - buttonHeight, this->getHeight() / 2 - buttonHeight / 2,
+		buttonHeight, buttonHeight);
+	rightPos -= buttonHeight;
+	rightPos -= splitWidth;
+
+	/** Stop Button */
+	this->stopButton->setBounds(
+		rightPos - buttonHeight, this->getHeight() / 2 - buttonHeight / 2,
+		buttonHeight, buttonHeight);
+	rightPos -= buttonHeight;
+	rightPos -= splitWidth;
+
+	/** Play Button */
+	this->playButton->setBounds(
+		rightPos - buttonHeight, this->getHeight() / 2 - buttonHeight / 2,
+		buttonHeight, buttonHeight);
+	rightPos -= buttonHeight;
+	rightPos -= splitWidth;
+
+	/** Rewind Button */
+	this->rewindButton->setBounds(
+		rightPos - buttonHeight, this->getHeight() / 2 - buttonHeight / 2,
+		buttonHeight, buttonHeight);
+	rightPos -= buttonHeight;
+	rightPos -= splitWidth;
+
+	/** Follow Button */
+	this->followButton->setBounds(
+		rightPos - buttonHeight, this->getHeight() / 2 - buttonHeight / 2,
+		buttonHeight, buttonHeight);
+	rightPos -= buttonHeight;
+	rightPos -= splitWidth;
+}
+
+void ControllerComponent::paint(juce::Graphics& g) {
+	/** Nothing To Do */
+}

src/ui/component/ControllerComponent.h

@@ -0,0 +1,31 @@
+#pragma once
+
+#include <JuceHeader.h>
+
+class ControllerComponent final : public juce::Component {
+public:
+	ControllerComponent();
+
+	void resized() override;
+	void paint(juce::Graphics& g) override;
+
+private:
+	std::unique_ptr<juce::DrawableButton> playButton = nullptr;
+	std::unique_ptr<juce::DrawableButton> stopButton = nullptr;
+	std::unique_ptr<juce::DrawableButton> recordButton = nullptr;
+
+	std::unique_ptr<juce::DrawableButton> rewindButton = nullptr;
+	std::unique_ptr<juce::DrawableButton> followButton = nullptr;
+
+	std::unique_ptr<juce::Drawable> playIcon = nullptr;
+	std::unique_ptr<juce::Drawable> pauseIcon = nullptr;
+	std::unique_ptr<juce::Drawable> stopIcon = nullptr;
+	std::unique_ptr<juce::Drawable> recordIcon = nullptr;
+	std::unique_ptr<juce::Drawable> recordOnIcon = nullptr;
+
+	std::unique_ptr<juce::Drawable> rewindIcon = nullptr;
+	std::unique_ptr<juce::Drawable> followIcon = nullptr;
+	std::unique_ptr<juce::Drawable> followOnIcon = nullptr;
+
+	JUCE_DECLARE_NON_COPYABLE_WITH_LEAK_DETECTOR(ControllerComponent)
+};

src/ui/component/ToolBar.cpp

@@ -25,6 +25,10 @@ ToolBar::ToolBar()
 	/** Time */
 	this->time = std::make_unique<TimeComponent>();
 	this->addAndMakeVisible(this->time.get());
+
+	/** Controller */
+	this->controller = std::make_unique<ControllerComponent>();
+	this->addAndMakeVisible(this->controller.get());
 }
 
 ToolBar::~ToolBar() {
@@ -40,13 +44,16 @@ void ToolBar::resized() {
 	/** Size */
 	int splitWidth = this->getHeight() * 0.075;
 	int mainMenuBarHeight = this->getHeight() * 0.4;
-	int sysStatusHideWidth = this->getHeight() * 12;
+	int sysStatusHideWidth = this->getHeight() * 14;
 	int sysStatusWidth = this->getHeight() * 4;
 	int timeHideWidth = this->getHeight() * 7;
 	int timeWidth = this->getHeight() * 2.75;
+	int controllerHideWidth = this->getHeight() * 10;
+	int controllerWidth = this->getHeight() * 3.3;
 
 	bool sysStatusShown = this->getWidth() > sysStatusHideWidth;
 	bool timeShown = this->getWidth() > timeHideWidth;
+	bool controllerShown = this->getWidth() > controllerHideWidth;
 
 	/** Total Area */
 	auto totalArea = this->getLocalBounds();
@@ -73,6 +80,17 @@ void ToolBar::resized() {
 	}
 	this->time->setVisible(timeShown);
 
+	/** Controller */
+	if (controllerShown) {
+		juce::Rectangle<int> controllerRect(
+			totalArea.getRight() - controllerWidth, 0,
+			controllerWidth, this->getHeight());
+		this->controller->setBounds(controllerRect);
+
+		totalArea.removeFromRight(controllerRect.getWidth() + splitWidth);
+	}
+	this->controller->setVisible(controllerShown);
+
 	/** Main Menu Bar */
 	juce::Rectangle<int> mainMenuBarRect(
 		0, 0, totalArea.getRight(), mainMenuBarHeight);

src/ui/component/ToolBar.h

@@ -6,6 +6,7 @@
 #include "MenuBarComponent.h"
 #include "SysStatusComponent.h"
 #include "TimeComponent.h"
+#include "ControllerComponent.h"
 
 class ToolBar final : public flowUI::FlowComponent {
 public:
@@ -20,6 +21,7 @@ class ToolBar final : public flowUI::FlowComponent {
 	std::unique_ptr<MenuBarComponent> mainMenuBar = nullptr;
 	std::unique_ptr<SysStatusComponent> sysStatus = nullptr;
 	std::unique_ptr<TimeComponent> time = nullptr;
+	std::unique_ptr<ControllerComponent> controller = nullptr;
 
 	JUCE_DECLARE_NON_COPYABLE_WITH_LEAK_DETECTOR(ToolBar)
 };

src/ui/lookAndFeel/LookAndFeelFactory.cpp

@@ -88,6 +88,19 @@ void LookAndFeelFactory::initialise() {
 		ColorMap::getInstance()->get("ThemeColorB10"));/**< Value Color */
 	this->timeLAF->setColour(juce::Label::ColourIds::outlineWhenEditingColourId,
 		ColorMap::getInstance()->get("ThemeColorA2"));/**< Curve Color */
+
+	/** Controller */
+	this->controllerLAF = std::make_unique<juce::LookAndFeel_V4>();
+	this->controllerLAF->setColour(juce::TextButton::ColourIds::buttonColourId,
+		ColorMap::getInstance()->get("ThemeColorB2"));
+	this->controllerLAF->setColour(juce::TextButton::ColourIds::buttonOnColourId,
+		ColorMap::getInstance()->get("ThemeColorB1"));
+	this->controllerLAF->setColour(juce::TextButton::ColourIds::textColourOffId,
+		ColorMap::getInstance()->get("ThemeColorB9"));
+	this->controllerLAF->setColour(juce::TextButton::ColourIds::textColourOnId,
+		ColorMap::getInstance()->get("ThemeColorB10"));
+	this->controllerLAF->setColour(juce::ComboBox::ColourIds::outlineColourId,
+		ColorMap::getInstance()->get("ThemeColorB2"));
 }
 
 void LookAndFeelFactory::setDefaultSansSerifTypeface(juce::Typeface::Ptr typeface) {
@@ -111,6 +124,10 @@ juce::LookAndFeel_V4* LookAndFeelFactory::forTime() const {
 	return this->timeLAF.get();
 }
 
+juce::LookAndFeel_V4* LookAndFeelFactory::forController() const {
+	return this->controllerLAF.get();
+}
+
 LookAndFeelFactory* LookAndFeelFactory::getInstance() {
 	return LookAndFeelFactory::instance ? LookAndFeelFactory::instance 
 		: (LookAndFeelFactory::instance = new LookAndFeelFactory{});

src/ui/lookAndFeel/LookAndFeelFactory.h

@@ -13,13 +13,15 @@ class LookAndFeelFactory final : private juce::DeletedAtShutdown {
 	juce::LookAndFeel_V4* forMainMenu() const;
 	juce::LookAndFeel_V4* forSysStatus() const;
 	juce::LookAndFeel_V4* forTime() const;
+	juce::LookAndFeel_V4* forController() const;
 
 private:
 	std::unique_ptr<juce::LookAndFeel> mainLAF = nullptr;
 	std::unique_ptr<juce::LookAndFeel_V4> toolBarLAF = nullptr;
 	std::unique_ptr<juce::LookAndFeel_V4> mainMenuLAF = nullptr;
 	std::unique_ptr<juce::LookAndFeel_V4> sysStatusLAF = nullptr;
 	std::unique_ptr<juce::LookAndFeel_V4> timeLAF = nullptr;
+	std::unique_ptr<juce::LookAndFeel_V4> controllerLAF = nullptr;
 
 public:
 	static LookAndFeelFactory* getInstance();