Add new Light graphics. Add TSvgLight class to handle SVG files above light.

include/componentlibrary.hpp

@@ -1,4 +1,6 @@
 #pragma once
+#include <widget/FramebufferWidget.hpp>
+#include <widget/SvgWidget.hpp>
 #include <app/SvgKnob.hpp>
 #include <app/SvgSlider.hpp>
 #include <app/SvgPort.hpp>
@@ -51,7 +53,7 @@ Many of these classes use CRTP (https://en.wikipedia.org/wiki/Curiously_recurrin
 
 To use a red light with its default base class for example, use `RedLight` or `TRedLight<>`. (They are synonymous.)
 
-Use the `TBase` template argument if you want a different base class.
+Use the `Base` template argument if you want a different base class.
 E.g. `RectangleLight<RedLight>`
 
 Although this paradigm might seem confusing at first, it ends up being extremely simple in your plugin code and perfect for "decorating" your classes with appearance traits and behavioral properties.
@@ -60,49 +62,70 @@ For example, need a slider with a green LED? Just use
 	createLightParamCentered<LEDLightSlider<GreenLight>>(...)
 */
 
-template <typename TBase = app::ModuleLightWidget>
-struct TGrayModuleLightWidget : TBase {
+template <typename Base = app::ModuleLightWidget>
+struct TSvgLight : Base {
+	widget::FramebufferWidget* fb;
+	widget::SvgWidget* sw;
+
+	TSvgLight() {
+		fb = new widget::FramebufferWidget;
+		this->addChild(fb);
+
+		sw = new widget::SvgWidget;
+		fb->addChild(sw);
+	}
+
+	void setSvg(std::shared_ptr<Svg> svg) {
+		sw->setSvg(svg);
+		fb->box.size = sw->box.size;
+		this->box.size = sw->box.size;
+	}
+};
+typedef TSvgLight<> SvgLight;
+
+template <typename Base = app::ModuleLightWidget>
+struct TGrayModuleLightWidget : Base {
 	TGrayModuleLightWidget() {
-		this->bgColor = nvgRGB(0x5a, 0x5a, 0x5a);
-		this->borderColor = nvgRGBA(0, 0, 0, 0x60);
+		this->bgColor = nvgRGBA(0xaf, 0xaf, 0xaf, 0xff);
+		this->borderColor = nvgRGBA(0, 0, 0, 53);
 	}
 };
 typedef TGrayModuleLightWidget<> GrayModuleLightWidget;
 
-template <typename TBase = GrayModuleLightWidget>
-struct TRedLight : TBase {
+template <typename Base = GrayModuleLightWidget>
+struct TRedLight : Base {
 	TRedLight() {
 		this->addBaseColor(SCHEME_RED);
 	}
 };
 typedef TRedLight<> RedLight;
 
-template <typename TBase = GrayModuleLightWidget>
-struct TGreenLight : TBase {
+template <typename Base = GrayModuleLightWidget>
+struct TGreenLight : Base {
 	TGreenLight() {
 		this->addBaseColor(SCHEME_GREEN);
 	}
 };
 typedef TGreenLight<> GreenLight;
 
-template <typename TBase = GrayModuleLightWidget>
-struct TYellowLight : TBase {
+template <typename Base = GrayModuleLightWidget>
+struct TYellowLight : Base {
 	TYellowLight() {
 		this->addBaseColor(SCHEME_YELLOW);
 	}
 };
 typedef TYellowLight<> YellowLight;
 
-template <typename TBase = GrayModuleLightWidget>
-struct TBlueLight : TBase {
+template <typename Base = GrayModuleLightWidget>
+struct TBlueLight : Base {
 	TBlueLight() {
 		this->addBaseColor(SCHEME_BLUE);
 	}
 };
 typedef TBlueLight<> BlueLight;
 
-template <typename TBase = GrayModuleLightWidget>
-struct TWhiteLight : TBase {
+template <typename Base = GrayModuleLightWidget>
+struct TWhiteLight : Base {
 	TWhiteLight() {
 		this->addBaseColor(SCHEME_WHITE);
 	}
@@ -110,8 +133,8 @@ struct TWhiteLight : TBase {
 typedef TWhiteLight<> WhiteLight;
 
 /** Reads two adjacent lightIds, so `lightId` and `lightId + 1` must be defined */
-template <typename TBase = GrayModuleLightWidget>
-struct TGreenRedLight : TBase {
+template <typename Base = GrayModuleLightWidget>
+struct TGreenRedLight : Base {
 	TGreenRedLight() {
 		this->addBaseColor(SCHEME_GREEN);
 		this->addBaseColor(SCHEME_RED);
@@ -119,8 +142,8 @@ struct TGreenRedLight : TBase {
 };
 typedef TGreenRedLight<> GreenRedLight;
 
-template <typename TBase = GrayModuleLightWidget>
-struct TRedGreenBlueLight : TBase {
+template <typename Base = GrayModuleLightWidget>
+struct TRedGreenBlueLight : Base {
 	TRedGreenBlueLight() {
 		this->addBaseColor(SCHEME_RED);
 		this->addBaseColor(SCHEME_GREEN);
@@ -130,39 +153,39 @@ struct TRedGreenBlueLight : TBase {
 typedef TRedGreenBlueLight<> RedGreenBlueLight;
 
 /** Based on the size of 5mm LEDs */
-template <typename TBase>
-struct LargeLight : TBase {
+template <typename Base>
+struct LargeLight : TSvgLight<Base> {
 	LargeLight() {
-		this->box.size = mm2px(math::Vec(5.179, 5.179));
+		this->setSvg(Svg::load(asset::system("res/ComponentLibrary/LargeLight.svg")));
 	}
 };
 
 /** Based on the size of 3mm LEDs */
-template <typename TBase>
-struct MediumLight : TBase {
+template <typename Base>
+struct MediumLight : TSvgLight<Base> {
 	MediumLight() {
-		this->box.size = mm2px(math::Vec(3.176, 3.176));
+		this->setSvg(Svg::load(asset::system("res/ComponentLibrary/MediumLight.svg")));
 	}
 };
 
 /** Based on the size of 2mm LEDs */
-template <typename TBase>
-struct SmallLight : TBase {
+template <typename Base>
+struct SmallLight : TSvgLight<Base> {
 	SmallLight() {
-		this->box.size = mm2px(math::Vec(2.176, 2.176));
+		this->setSvg(Svg::load(asset::system("res/ComponentLibrary/SmallLight.svg")));
 	}
 };
 
 /** Based on the size of 1mm LEDs */
-template <typename TBase>
-struct TinyLight : TBase {
+template <typename Base>
+struct TinyLight : TSvgLight<Base> {
 	TinyLight() {
-		this->box.size = mm2px(math::Vec(1.088, 1.088));
+		this->setSvg(Svg::load(asset::system("res/ComponentLibrary/TinyLight.svg")));
 	}
 };
 
-template <typename TBase>
-struct RectangleLight : TBase {
+template <typename Base>
+struct RectangleLight : Base {
 	void drawLight(const widget::Widget::DrawArgs& args) override {
 		nvgBeginPath(args.vg);
 		nvgRect(args.vg, 0, 0, this->box.size.x, this->box.size.y);
@@ -189,8 +212,8 @@ struct RectangleLight : TBase {
 };
 
 /** A light for displaying on top of PB61303. Must add a color by subclassing or templating. */
-template <typename TBase>
-struct LEDBezelLight : TBase {
+template <typename Base>
+struct LEDBezelLight : Base {
 	LEDBezelLight() {
 		this->bgColor = color::BLACK_TRANSPARENT;
 		this->box.size = mm2px(math::Vec(6.0, 6.0));
@@ -200,8 +223,8 @@ struct LEDBezelLight : TBase {
 /** A light to displayed over PB61303. Must add a color by subclassing or templating.
 Don't add this as a child of the PB61303 itself. Instead, just place it over it as a sibling in the scene graph, offset by mm2px(math::Vec(0.5, 0.5)).
 */
-template <typename TBase>
-struct PB61303Light : TBase {
+template <typename Base>
+struct PB61303Light : Base {
 	PB61303Light() {
 		this->bgColor = color::BLACK_TRANSPARENT;
 		this->box.size = mm2px(math::Vec(9.0, 9.0));
@@ -638,8 +661,8 @@ struct LEDSliderHorizontal : app::SvgSlider {
 	}
 };
 
-template <typename TBase, typename TLightBase = RedLight>
-struct LightSlider : TBase {
+template <typename Base, typename TLightBase = RedLight>
+struct LightSlider : Base {
 	app::ModuleLightWidget* light;
 
 	LightSlider() {
@@ -653,11 +676,11 @@ struct LightSlider : TBase {
 	}
 
 	void step() override {
-		TBase::step();
+		Base::step();
 		// Move center of light to center of handle
 		light->box.pos = this->handle->box.pos
-		                 .plus(this->handle->box.size.div(2))
-		                 .minus(light->box.size.div(2));
+				 .plus(this->handle->box.size.div(2))
+				 .minus(light->box.size.div(2));
 	}
 };
 

res/ComponentLibrary/LargeLight.svg

@@ -0,0 +1,98 @@
+<?xml version="1.0" encoding="UTF-8" standalone="no"?>
+<svg
+   xmlns:dc="http://purl.org/dc/elements/1.1/"
+   xmlns:cc="http://creativecommons.org/ns#"
+   xmlns:rdf="http://www.w3.org/1999/02/22-rdf-syntax-ns#"
+   xmlns:svg="http://www.w3.org/2000/svg"
+   xmlns="http://www.w3.org/2000/svg"
+   xmlns:sodipodi="http://sodipodi.sourceforge.net/DTD/sodipodi-0.dtd"
+   xmlns:inkscape="http://www.inkscape.org/namespaces/inkscape"
+   version="1.0"
+   id="svg164153"
+   x="0mm"
+   y="0mm"
+   width="5mm"
+   height="5mm"
+   viewBox="0 0 5 5"
+   enable-background="new 0 0 5 5"
+   xml:space="preserve"
+   sodipodi:docname="LargeLed.svg"
+   inkscape:version="1.0.2 (e86c870879, 2021-01-15, custom)"><metadata
+   id="metadata22"><rdf:RDF><cc:Work
+       rdf:about=""><dc:format>image/svg+xml</dc:format><dc:type
+         rdf:resource="http://purl.org/dc/dcmitype/StillImage" /></cc:Work></rdf:RDF></metadata><defs
+   id="defs20" />
+<sodipodi:namedview
+   bordercolor="#666666"
+   borderopacity="1.0"
+   fit-margin-bottom="0"
+   fit-margin-left="0"
+   fit-margin-right="0"
+   fit-margin-top="0"
+   id="base"
+   inkscape:current-layer="svg164153"
+   inkscape:cx="-50.865388"
+   inkscape:cy="-9.1133715"
+   inkscape:document-units="mm"
+   inkscape:pageopacity="0.0"
+   inkscape:pageshadow="2"
+   inkscape:window-height="882"
+   inkscape:window-maximized="0"
+   inkscape:window-width="1600"
+   inkscape:window-x="0"
+   inkscape:window-y="18"
+   inkscape:zoom="7.9195959"
+   pagecolor="#ffffff"
+   showgrid="false"
+   inkscape:document-rotation="0">
+	</sodipodi:namedview>
+
+<linearGradient
+   id="SVGID_1_"
+   gradientUnits="userSpaceOnUse"
+   x1="2.5"
+   y1="0.45675"
+   x2="2.5"
+   y2="2.29732">
+	<stop
+   offset="0"
+   style="stop-color:#FDFDFF"
+   id="stop5" />
+	<stop
+   offset="1"
+   style="stop-color:#FCFEFF;stop-opacity:0"
+   id="stop7" />
+</linearGradient>
+<ellipse
+   fill="url(#SVGID_1_)"
+   cx="2.5"
+   cy="1.37704"
+   rx="1.51927"
+   ry="0.92029"
+   id="ellipse10" />
+<linearGradient
+   id="SVGID_2_"
+   gradientUnits="userSpaceOnUse"
+   x1="-1250.25732"
+   y1="-1002.16425"
+   x2="-1250.25732"
+   y2="-1000.32367"
+   gradientTransform="matrix(-1 0 0 -1 -1247.75732 -997.58325)">
+	<stop
+   offset="0"
+   style="stop-color:#FDFDFF"
+   id="stop12" />
+	<stop
+   offset="1"
+   style="stop-color:#FCFEFF;stop-opacity:0"
+   id="stop14" />
+</linearGradient>
+<ellipse
+   opacity="0.3"
+   fill="url(#SVGID_2_)"
+   cx="2.5"
+   cy="3.66071"
+   rx="1.51927"
+   ry="0.92029"
+   id="ellipse17" />
+</svg>

res/ComponentLibrary/MediumLight.svg

@@ -0,0 +1,98 @@
+<?xml version="1.0" encoding="UTF-8" standalone="no"?>
+<svg
+   xmlns:dc="http://purl.org/dc/elements/1.1/"
+   xmlns:cc="http://creativecommons.org/ns#"
+   xmlns:rdf="http://www.w3.org/1999/02/22-rdf-syntax-ns#"
+   xmlns:svg="http://www.w3.org/2000/svg"
+   xmlns="http://www.w3.org/2000/svg"
+   xmlns:sodipodi="http://sodipodi.sourceforge.net/DTD/sodipodi-0.dtd"
+   xmlns:inkscape="http://www.inkscape.org/namespaces/inkscape"
+   version="1.0"
+   id="svg164153"
+   x="0mm"
+   y="0mm"
+   width="3mm"
+   height="3mm"
+   viewBox="0 0 3 3"
+   enable-background="new 0 0 3 3"
+   xml:space="preserve"
+   sodipodi:docname="MediumLight.svg"
+   inkscape:version="1.0.2 (e86c870879, 2021-01-15, custom)"><metadata
+   id="metadata22"><rdf:RDF><cc:Work
+       rdf:about=""><dc:format>image/svg+xml</dc:format><dc:type
+         rdf:resource="http://purl.org/dc/dcmitype/StillImage" /></cc:Work></rdf:RDF></metadata><defs
+   id="defs20" />
+<sodipodi:namedview
+   bordercolor="#666666"
+   borderopacity="1.0"
+   fit-margin-bottom="0"
+   fit-margin-left="0"
+   fit-margin-right="0"
+   fit-margin-top="0"
+   id="base"
+   inkscape:current-layer="svg164153"
+   inkscape:cx="10.136396"
+   inkscape:cy="10.750772"
+   inkscape:document-units="mm"
+   inkscape:pageopacity="0.0"
+   inkscape:pageshadow="2"
+   inkscape:window-height="882"
+   inkscape:window-maximized="0"
+   inkscape:window-width="1600"
+   inkscape:window-x="0"
+   inkscape:window-y="18"
+   inkscape:zoom="28.975876"
+   pagecolor="#ffffff"
+   showgrid="false"
+   inkscape:document-rotation="0">
+	</sodipodi:namedview>
+
+<linearGradient
+   id="SVGID_1_"
+   gradientUnits="userSpaceOnUse"
+   x1="1.5"
+   y1="0.27405"
+   x2="1.5"
+   y2="1.37839">
+	<stop
+   offset="0"
+   style="stop-color:#FDFDFF"
+   id="stop5" />
+	<stop
+   offset="1"
+   style="stop-color:#FCFEFF;stop-opacity:0"
+   id="stop7" />
+</linearGradient>
+<ellipse
+   fill="url(#SVGID_1_)"
+   cx="1.5"
+   cy="0.82622"
+   rx="0.91156"
+   ry="0.55217"
+   id="ellipse10" />
+<linearGradient
+   id="SVGID_2_"
+   gradientUnits="userSpaceOnUse"
+   x1="-1249.25732"
+   y1="-1000.33185"
+   x2="-1249.25732"
+   y2="-999.22754"
+   gradientTransform="matrix(-1 0 0 -1 -1247.75732 -997.58325)">
+	<stop
+   offset="0"
+   style="stop-color:#FDFDFF"
+   id="stop12" />
+	<stop
+   offset="1"
+   style="stop-color:#FCFEFF;stop-opacity:0"
+   id="stop14" />
+</linearGradient>
+<ellipse
+   opacity="0.3"
+   fill="url(#SVGID_2_)"
+   cx="1.5"
+   cy="2.19643"
+   rx="0.91156"
+   ry="0.55217"
+   id="ellipse17" />
+</svg>

res/ComponentLibrary/SmallLight.svg

@@ -0,0 +1,98 @@
+<?xml version="1.0" encoding="UTF-8" standalone="no"?>
+<svg
+   xmlns:dc="http://purl.org/dc/elements/1.1/"
+   xmlns:cc="http://creativecommons.org/ns#"
+   xmlns:rdf="http://www.w3.org/1999/02/22-rdf-syntax-ns#"
+   xmlns:svg="http://www.w3.org/2000/svg"
+   xmlns="http://www.w3.org/2000/svg"
+   xmlns:sodipodi="http://sodipodi.sourceforge.net/DTD/sodipodi-0.dtd"
+   xmlns:inkscape="http://www.inkscape.org/namespaces/inkscape"
+   version="1.0"
+   id="svg164153"
+   x="0mm"
+   y="0mm"
+   width="2mm"
+   height="2mm"
+   viewBox="0 0 2 2"
+   enable-background="new 0 0 2 2"
+   xml:space="preserve"
+   sodipodi:docname="SmallLed.svg"
+   inkscape:version="1.0.2 (e86c870879, 2021-01-15, custom)"><metadata
+   id="metadata22"><rdf:RDF><cc:Work
+       rdf:about=""><dc:format>image/svg+xml</dc:format><dc:type
+         rdf:resource="http://purl.org/dc/dcmitype/StillImage" /></cc:Work></rdf:RDF></metadata><defs
+   id="defs20" />
+<sodipodi:namedview
+   bordercolor="#666666"
+   borderopacity="1.0"
+   fit-margin-bottom="0"
+   fit-margin-left="0"
+   fit-margin-right="0"
+   fit-margin-top="0"
+   id="base"
+   inkscape:current-layer="svg164153"
+   inkscape:cx="4.0653199"
+   inkscape:cy="4.1789873"
+   inkscape:document-units="mm"
+   inkscape:pageopacity="0.0"
+   inkscape:pageshadow="2"
+   inkscape:window-height="882"
+   inkscape:window-maximized="0"
+   inkscape:window-width="1600"
+   inkscape:window-x="0"
+   inkscape:window-y="18"
+   inkscape:zoom="61.023759"
+   pagecolor="#ffffff"
+   showgrid="false"
+   inkscape:document-rotation="0">
+	</sodipodi:namedview>
+
+<linearGradient
+   id="SVGID_1_"
+   gradientUnits="userSpaceOnUse"
+   x1="1"
+   y1="0.1827"
+   x2="1"
+   y2="0.91893">
+	<stop
+   offset="0"
+   style="stop-color:#FDFDFF"
+   id="stop5" />
+	<stop
+   offset="1"
+   style="stop-color:#FCFEFF;stop-opacity:0"
+   id="stop7" />
+</linearGradient>
+<ellipse
+   fill="url(#SVGID_1_)"
+   cx="1"
+   cy="0.55081"
+   rx="0.60771"
+   ry="0.36811"
+   id="ellipse10" />
+<linearGradient
+   id="SVGID_2_"
+   gradientUnits="userSpaceOnUse"
+   x1="-1248.75732"
+   y1="-999.41565"
+   x2="-1248.75732"
+   y2="-998.67944"
+   gradientTransform="matrix(-1 0 0 -1 -1247.75732 -997.58325)">
+	<stop
+   offset="0"
+   style="stop-color:#FDFDFF"
+   id="stop12" />
+	<stop
+   offset="1"
+   style="stop-color:#FCFEFF;stop-opacity:0"
+   id="stop14" />
+</linearGradient>
+<ellipse
+   opacity="0.3"
+   fill="url(#SVGID_2_)"
+   cx="1"
+   cy="1.46428"
+   rx="0.60771"
+   ry="0.36811"
+   id="ellipse17" />
+</svg>

res/ComponentLibrary/TinyLight.svg

@@ -0,0 +1,98 @@
+<?xml version="1.0" encoding="UTF-8" standalone="no"?>
+<svg
+   xmlns:dc="http://purl.org/dc/elements/1.1/"
+   xmlns:cc="http://creativecommons.org/ns#"
+   xmlns:rdf="http://www.w3.org/1999/02/22-rdf-syntax-ns#"
+   xmlns:svg="http://www.w3.org/2000/svg"
+   xmlns="http://www.w3.org/2000/svg"
+   xmlns:sodipodi="http://sodipodi.sourceforge.net/DTD/sodipodi-0.dtd"
+   xmlns:inkscape="http://www.inkscape.org/namespaces/inkscape"
+   version="1.0"
+   id="svg164153"
+   x="0mm"
+   y="0mm"
+   width="1mm"
+   height="1mm"
+   viewBox="0 0 1 1"
+   enable-background="new 0 0 1 1"
+   xml:space="preserve"
+   sodipodi:docname="TinyLed.svg"
+   inkscape:version="1.0.2 (e86c870879, 2021-01-15, custom)"><metadata
+   id="metadata22"><rdf:RDF><cc:Work
+       rdf:about=""><dc:format>image/svg+xml</dc:format><dc:type
+         rdf:resource="http://purl.org/dc/dcmitype/StillImage" /></cc:Work></rdf:RDF></metadata><defs
+   id="defs20" />
+<sodipodi:namedview
+   bordercolor="#666666"
+   borderopacity="1.0"
+   fit-margin-bottom="0"
+   fit-margin-left="0"
+   fit-margin-right="0"
+   fit-margin-top="0"
+   id="base"
+   inkscape:current-layer="svg164153"
+   inkscape:cx="-15.084364"
+   inkscape:cy="-0.73704599"
+   inkscape:document-units="mm"
+   inkscape:pageopacity="0.0"
+   inkscape:pageshadow="2"
+   inkscape:window-height="882"
+   inkscape:window-maximized="0"
+   inkscape:window-width="1600"
+   inkscape:window-x="0"
+   inkscape:window-y="18"
+   inkscape:zoom="22.165173"
+   pagecolor="#ffffff"
+   showgrid="false"
+   inkscape:document-rotation="0">
+	</sodipodi:namedview>
+
+<linearGradient
+   id="SVGID_1_"
+   gradientUnits="userSpaceOnUse"
+   x1="0.5"
+   y1="0.09135"
+   x2="0.5"
+   y2="0.45946">
+	<stop
+   offset="0"
+   style="stop-color:#FDFDFF"
+   id="stop5" />
+	<stop
+   offset="1"
+   style="stop-color:#FCFEFF;stop-opacity:0"
+   id="stop7" />
+</linearGradient>
+<ellipse
+   fill="url(#SVGID_1_)"
+   cx="0.5"
+   cy="0.27541"
+   rx="0.30385"
+   ry="0.18406"
+   id="ellipse10" />
+<linearGradient
+   id="SVGID_2_"
+   gradientUnits="userSpaceOnUse"
+   x1="-1248.25732"
+   y1="-998.49945"
+   x2="-1248.25732"
+   y2="-998.13135"
+   gradientTransform="matrix(-1 0 0 -1 -1247.75732 -997.58325)">
+	<stop
+   offset="0"
+   style="stop-color:#FDFDFF"
+   id="stop12" />
+	<stop
+   offset="1"
+   style="stop-color:#FCFEFF;stop-opacity:0"
+   id="stop14" />
+</linearGradient>
+<ellipse
+   opacity="0.3"
+   fill="url(#SVGID_2_)"
+   cx="0.5"
+   cy="0.73214"
+   rx="0.30385"
+   ry="0.18406"
+   id="ellipse17" />
+</svg>

src/app/LightWidget.cpp

@@ -9,6 +9,7 @@ namespace app {
 void LightWidget::draw(const DrawArgs& args) {
 	drawLight(args);
 	drawHalo(args);
+	TransparentWidget::draw(args);
 }
 
 void LightWidget::drawLight(const DrawArgs& args) {

src/app/ModuleLightWidget.cpp

@@ -115,6 +115,8 @@ void ModuleLightWidget::step() {
 	}
 
 	setBrightnesses(brightnesses);
+
+	MultiLightWidget::step();
 }