From 4009309baf8a13f8e98dff4b95f08937c8fb53b9 Mon Sep 17 00:00:00 2001 From: EvilDragon Date: Sun, 14 Nov 2021 02:11:03 +0100 Subject: [PATCH] Finish About screen (#5390) * Finish About screen layout Adjust the look of JUCE icon to match others * sorry * Swap link colors, auto-adjust hyperlink label widths, bit more spacing between the top right icons Co-authored-by: Paul Walker --- resources/classic-skin-svgs/bmp00180.svg | 303 +++++++++--------- .../dark-mode.surge-skin/SVG/bmp00124.svg | 12 - .../dark-mode.surge-skin/SVG/bmp00180.svg | 279 ++++++++-------- src/common/SkinColors.cpp | 2 +- src/surge-xt/gui/overlays/AboutScreen.cpp | 203 +++++++++--- src/surge-xt/gui/overlays/AboutScreen.h | 4 +- 6 files changed, 457 insertions(+), 346 deletions(-) delete mode 100644 resources/data/skins/dark-mode.surge-skin/SVG/bmp00124.svg diff --git a/resources/classic-skin-svgs/bmp00180.svg b/resources/classic-skin-svgs/bmp00180.svg index 5cb283b5631..8dec3b7488a 100644 --- a/resources/classic-skin-svgs/bmp00180.svg +++ b/resources/classic-skin-svgs/bmp00180.svg @@ -1,196 +1,197 @@ - - Created with Lunacy + - + - + + + + + + + + + + + + + + + + + + + + + + + + + - - + + - - + + - - - - - - - - - - - - - - - - - - + + + + + + + + + + + + + + + + + + - - - - - - - - - - - - - - - - - - + + + + + + + + + + + + + + + + + + - - - - - - - - - - - - - - - - - - + + + + + + + + + + + + + + + + + + - - - - - - - - - - - - - - - - - - + + + + + + + + + + + + + + + + + + - + - + - - - - - - - - - - - + + + + + + + + + + + - - - - + + + + - - - - + + + + - - + + - - + + - - - - - - - - - - - + + + + + + + + + + + - - - - + + + + - - - - + + + + - - + + - - - + + + - - - - - - - - - - - - - - - - - - - - - - \ No newline at end of file diff --git a/resources/data/skins/dark-mode.surge-skin/SVG/bmp00124.svg b/resources/data/skins/dark-mode.surge-skin/SVG/bmp00124.svg deleted file mode 100644 index ae834394da7..00000000000 --- a/resources/data/skins/dark-mode.surge-skin/SVG/bmp00124.svg +++ /dev/null @@ -1,12 +0,0 @@ - - - - - - - - - - - - diff --git a/resources/data/skins/dark-mode.surge-skin/SVG/bmp00180.svg b/resources/data/skins/dark-mode.surge-skin/SVG/bmp00180.svg index dd37f369668..8dec3b7488a 100644 --- a/resources/data/skins/dark-mode.surge-skin/SVG/bmp00180.svg +++ b/resources/data/skins/dark-mode.surge-skin/SVG/bmp00180.svg @@ -1,174 +1,197 @@ - - Created with Lunacy + - + + + + + + + + + + + + + + + + + + + + + + + + + - - + + - - + + - - - - - - - - - - - - - - - - - - + + + + + + + + + + + + + + + + + + - - - - - - - - - - - - - - - - - - + + + + + + + + + + + + + + + + + + - - - - - - - - - - - - - - - - - - + + + + + + + + + + + + + + + + + + - - - - - - - - - - - - - - - - - - + + + + + + + + + + + + + + + + + + - + - + - - - - - - - - - - - + + + + + + + + + + + - - - - + + + + - - - - + + + + - - + + - - + + - - - - - - - - - - - + + + + + + + + + + + - - - - + + + + - - - - + + + + - - + + - - - + + + \ No newline at end of file diff --git a/src/common/SkinColors.cpp b/src/common/SkinColors.cpp index 1a7192217ba..4a6fa834f45 100644 --- a/src/common/SkinColors.cpp +++ b/src/common/SkinColors.cpp @@ -6,7 +6,7 @@ namespace AboutPage { const Surge::Skin::Color Text("about.page.text", 0xFFFFFF), ColumnText("about.page.column.text", 0xFF9000), Link("about.page.link", 0x2D86FE), - Linkhover("about.page.hover.link", 0x60C4FF); + LinkHover("about.page.hover.link", 0x60C4FF); } namespace Dialog diff --git a/src/surge-xt/gui/overlays/AboutScreen.cpp b/src/surge-xt/gui/overlays/AboutScreen.cpp index a9ee16f4ebe..f229c31c670 100644 --- a/src/surge-xt/gui/overlays/AboutScreen.cpp +++ b/src/surge-xt/gui/overlays/AboutScreen.cpp @@ -27,11 +27,6 @@ namespace Surge { namespace Overlays { -struct NoUrlHyperlinkButton : public juce::HyperlinkButton -{ - NoUrlHyperlinkButton() : HyperlinkButton("", juce::URL()) {} - void clicked() override {} -}; struct ClickURLImage : public juce::Component { @@ -44,7 +39,9 @@ struct ClickURLImage : public juce::Component { int ys = isHovered ? imgsz : 0; int xs = offset * imgsz; + juce::Graphics::ScopedSaveState gs(g); + auto t = juce::AffineTransform(); t = t.translated(-xs, -ys); @@ -70,10 +67,33 @@ struct ClickURLImage : public juce::Component } bool isHovered{false}; + int offset, imgsz = 36; std::string url; - int offset; SurgeImage *img; - int imgsz = 36; +}; + +struct HyperlinkLabel : public juce::Label, public Surge::GUI::SkinConsumingComponent +{ + HyperlinkLabel(const std::string &URL) : url(URL) {} + + void mouseEnter(const juce::MouseEvent &e) override + { + setColour(juce::Label::textColourId, skin->getColor(Colors::AboutPage::LinkHover)); + repaint(); + } + + void mouseExit(const juce::MouseEvent &e) override + { + setColour(juce::Label::textColourId, skin->getColor(Colors::AboutPage::Link)); + repaint(); + } + + void mouseUp(const juce::MouseEvent &event) override + { + juce::URL(url).launchInDefaultBrowser(); + } + + std::string url; }; AboutScreen::AboutScreen() {} @@ -86,7 +106,8 @@ void AboutScreen::populateData() std::ostringstream oss; oss << Surge::Build::BuildDate << " @ " << Surge::Build::BuildTime << " on '" << Surge::Build::BuildHost << "/" << Surge::Build::BuildLocation << "' with '" - << Surge::Build::BuildCompiler << "' using JUCE " << std::hex << JUCE_VERSION << std::dec; + << Surge::Build::BuildCompiler << "' using JUCE " << JUCE_MAJOR_VERSION << "." + << JUCE_MINOR_VERSION << "." << JUCE_BUILDNUMBER; std::string buildinfo = oss.str(); @@ -105,33 +126,34 @@ void AboutScreen::populateData() platform + " " + bitness + " " + wrapper + " on " + Surge::CPUFeatures::cpuBrand(); lowerLeft.clear(); - lowerLeft.emplace_back("Version", version, ""); - lowerLeft.emplace_back("Build", buildinfo, ""); - lowerLeft.emplace_back("System", system, ""); + lowerLeft.emplace_back("Version:", version, ""); + lowerLeft.emplace_back("Build:", buildinfo, ""); + lowerLeft.emplace_back("System:", system, ""); auto srString = fmt::format("{:.1f} kHz", samplerate / 1000.0); + if (host != "Unknown") { auto hstr = host + " @ " + srString; - lowerLeft.emplace_back("Host", hstr, ""); + lowerLeft.emplace_back("Host:", hstr, ""); } else { - lowerLeft.emplace_back("Sample Rate", srString, ""); + lowerLeft.emplace_back("Sample Rate:", srString, ""); } + lowerLeft.emplace_back("", "", ""); - lowerLeft.emplace_back("Factory Data", storage->datapath.u8string(), + + lowerLeft.emplace_back("Executable:", Paths::appPath().u8string(), + Paths::appPath().parent_path().u8string()); + lowerLeft.emplace_back("Factory Data:", storage->datapath.u8string(), storage->datapath.u8string()); - lowerLeft.emplace_back("User Data", storage->userDataPath.u8string(), + lowerLeft.emplace_back("User Data:", storage->userDataPath.u8string(), storage->userDataPath.u8string()); - lowerLeft.emplace_back("Plugin", Paths::appPath().u8string(), ""); - lowerLeft.emplace_back("Current Skin", skin->displayName, skin->root + skin->name); - lowerLeft.emplace_back("Skin Author", skin->author, skin->authorURL); - for (auto &l : lowerLeft) - { - std::cout << std::get<0>(l) << " - " << std::get<1>(l) << std::endl; - } + lowerRight.clear(); + lowerRight.emplace_back("Current Skin:", skin->displayName, skin->root + skin->name); + lowerRight.emplace_back("Skin Author:", skin->author, skin->authorURL); } void AboutScreen::buttonClicked(juce::Button *button) @@ -139,12 +161,17 @@ void AboutScreen::buttonClicked(juce::Button *button) if (button == copyButton.get()) { std::ostringstream oss; + for (auto l : lowerLeft) { if (std::get<0>(l).empty()) + { break; - oss << std::get<0>(l) << ": " << std::get<1>(l) << "\n"; + } + + oss << std::get<0>(l) << " " << std::get<1>(l) << "\n"; } + juce::SystemClipboard::copyTextToClipboard(oss.str()); } } @@ -153,18 +180,21 @@ void AboutScreen::resized() { if (labels.empty()) { - std::cout << "Building on resize " << getWidth() << " " << getHeight() << std::endl; - int lHeight = 16; - int margin = 5; + int margin = 16; + auto rightSide = getWidth() - margin - 252; auto lls = lowerLeft.size(); + auto lrs = lowerRight.size(); auto h0 = getHeight() - lls * lHeight - margin; + auto h1 = getHeight() - lrs * lHeight - margin; auto colW = 66; + auto font = Surge::GUI::getFontManager()->getLatoAtSize(10); copyButton = std::make_unique(); - copyButton->setButtonText("Copy to Clipboard"); - copyButton->setBounds(margin, h0 - 20 - margin, 100, 20); + copyButton->setButtonText("Copy Version Info"); + copyButton->setBounds(margin + 4, h0 - lHeight - 10, 100, 20); copyButton->addListener(this); + addAndMakeVisible(*copyButton); for (auto l : lowerLeft) @@ -173,21 +203,81 @@ void AboutScreen::resized() lb->setInterceptsMouseClicks(false, true); lb->setText(std::get<0>(l), juce::NotificationType::dontSendNotification); lb->setBounds(margin, h0, colW, lHeight); - lb->setFont(Surge::GUI::getFontManager()->getLatoAtSize(10)); + lb->setFont(font); lb->setColour(juce::Label::textColourId, skin->getColor(Colors::AboutPage::ColumnText)); addAndMakeVisible(*lb); labels.push_back(std::move(lb)); - lb = std::make_unique(); + if (std::get<2>(l).empty()) + { + auto lb = std::make_unique(); + lb->setInterceptsMouseClicks(false, true); + lb->setFont(font); + lb->setColour(juce::Label::textColourId, skin->getColor(Colors::AboutPage::Text)); + lb->setText(std::get<1>(l), juce::NotificationType::dontSendNotification); + lb->setBounds(margin + colW, h0, getWidth() - margin - colW, lHeight); + + addAndMakeVisible(*lb); + labels.push_back(std::move(lb)); + } + else + { + auto lb = std::make_unique(std::get<2>(l)); + lb->setSkin(skin, associatedBitmapStore); + lb->setFont(font); + lb->setColour(juce::Label::textColourId, skin->getColor(Colors::AboutPage::Link)); + lb->setText(std::get<1>(l), juce::NotificationType::dontSendNotification); + + auto strw = font.getStringWidth(std::get<1>(l)) + 8; + lb->setBounds(margin + colW, h0, strw, lHeight); + + addAndMakeVisible(*lb); + labels.push_back(std::move(lb)); + } + + h0 += lHeight; + } + + for (auto l : lowerRight) + { + auto lb = std::make_unique(); + lb->setInterceptsMouseClicks(false, true); - lb->setText(std::get<1>(l), juce::NotificationType::dontSendNotification); - lb->setBounds(margin + colW, h0, getWidth() - margin - colW, lHeight); - lb->setFont(Surge::GUI::getFontManager()->getLatoAtSize(10)); - lb->setColour(juce::Label::textColourId, skin->getColor(Colors::AboutPage::Text)); + lb->setText(std::get<0>(l), juce::NotificationType::dontSendNotification); + lb->setBounds(rightSide, h1, colW, lHeight); + lb->setFont(font); + lb->setColour(juce::Label::textColourId, skin->getColor(Colors::AboutPage::ColumnText)); addAndMakeVisible(*lb); labels.push_back(std::move(lb)); - h0 += lHeight; + if (std::get<2>(l).empty()) + { + auto lb = std::make_unique(); + lb->setInterceptsMouseClicks(false, true); + lb->setFont(font); + lb->setColour(juce::Label::textColourId, skin->getColor(Colors::AboutPage::Text)); + lb->setText(std::get<1>(l), juce::NotificationType::dontSendNotification); + lb->setBounds(rightSide + colW, h1, getWidth() - margin - colW, lHeight); + + addAndMakeVisible(*lb); + labels.push_back(std::move(lb)); + } + else + { + auto lb = std::make_unique(std::get<2>(l)); + lb->setSkin(skin, associatedBitmapStore); + lb->setFont(font); + lb->setColour(juce::Label::textColourId, skin->getColor(Colors::AboutPage::Link)); + lb->setText(std::get<1>(l), juce::NotificationType::dontSendNotification); + + auto strw = font.getStringWidth(std::get<1>(l)) + 8; + lb->setBounds(rightSide + colW, h1, strw, lHeight); + + addAndMakeVisible(*lb); + labels.push_back(std::move(lb)); + } + + h1 += lHeight; } auto xp = margin; @@ -211,8 +301,6 @@ void AboutScreen::resized() "under the GNU GPL v3 license", 600); yp += lblvs; - addLabel("Built using the JUCE framework.", 600); - yp += lblvs; addLabel("VST is a trademark of Steinberg Media Technologies GmbH;Audio Units is a " "trademark of Apple Inc.", 600); @@ -243,31 +331,27 @@ void AboutScreen::resized() 600); auto img = associatedBitmapStore->getImage(IDB_ABOUT_LOGOS); + auto idxes = {0, 4, 3, 1, 2, 5}; - // so 'github / discord / gpl3' - // th 'juce / au / vst3' - auto idxes = {0, 4, 3, 5, 1, 2}; std::vector urls = { - // icon order so gh, vst, au, gpl, discord, juce "https://github.com/surge-synthesizer/surge/", + "https://discord.gg/aFQDdMV", + "https://www.gnu.org/licenses/gpl-3.0-standalone.html", "https://www.steinberg.net/en/company/technologies/vst3.html", "https://developer.apple.com/documentation/audiounit", - "https://www.gnu.org/licenses/gpl-3.0-standalone.html", - "https://discord.gg/aFQDdMV", "https://juce.com"}; - int xi = 0, yi = 0; + + int x = 0; + for (auto idx : idxes) { auto bt = std::make_unique(img, idx, urls[idx]); - bt->setBounds(getWidth() - 40 * 3 + xi * 40, 10 + yi * 40, 36, 36); + + bt->setBounds(rightSide + (x * 42), margin, 36, 36); addAndMakeVisible(*bt); icons.push_back(std::move(bt)); - xi++; - if (xi == 3) - { - xi = 0; - yi++; - } + + x++; } } } @@ -286,10 +370,25 @@ void AboutScreen::paint(juce::Graphics &g) void AboutScreen::mouseUp(const juce::MouseEvent &e) { if (editor) + { editor->hideAboutScreen(); + } } -void AboutScreen::onSkinChanged() { logo = associatedBitmapStore->getImage(IDB_ABOUT_BG); } +void AboutScreen::onSkinChanged() +{ + logo = associatedBitmapStore->getImage(IDB_ABOUT_BG); + + for (const auto &l : labels) + { + auto skc = dynamic_cast(l.get()); + + if (skc) + { + skc->setSkin(skin, associatedBitmapStore); + } + } +} } // namespace Overlays } // namespace Surge diff --git a/src/surge-xt/gui/overlays/AboutScreen.h b/src/surge-xt/gui/overlays/AboutScreen.h index ca0a4ef63b8..d37a7a3c067 100644 --- a/src/surge-xt/gui/overlays/AboutScreen.h +++ b/src/surge-xt/gui/overlays/AboutScreen.h @@ -58,7 +58,7 @@ struct AboutScreen : public juce::Component, int logoW{555}, logoH{179}; // label, value, url - std::vector> lowerLeft; + std::vector> lowerLeft, lowerRight; std::vector> labels; std::vector> buttons; @@ -66,7 +66,7 @@ struct AboutScreen : public juce::Component, std::unique_ptr copyButton; - juce::Colour fillColour{juce::Colour(0, 0, 0).withAlpha(0.8f)}; + juce::Colour fillColour{juce::Colour(0, 0, 0).withAlpha(0.85f)}; JUCE_DECLARE_NON_COPYABLE_WITH_LEAK_DETECTOR(AboutScreen); };