diff --git a/sass/css/_shop.scss b/sass/css/_shop.scss
index 97c475b..9a02dea 100644
--- a/sass/css/_shop.scss
+++ b/sass/css/_shop.scss
@@ -273,7 +273,6 @@ button {
position: absolute;
display: flex;
align-items: start;
- justify-content: center;
text-align: left;
background-color: white;
color: black;
@@ -496,7 +495,6 @@ button {
position: absolute;
display: flex;
align-items: start;
- justify-content: center;
text-align: left;
background-color: white;
color: black;
diff --git a/static/js/shop_components.jsx b/static/js/shop_components.jsx
index c0d1224..b074edc 100644
--- a/static/js/shop_components.jsx
+++ b/static/js/shop_components.jsx
@@ -322,10 +322,15 @@ export function ProcessOptions({options, data, target, id}) {
} else if (options_t === "object") {
if (
trueTypeOf(options.type) === "string" &&
- trueTypeOf(options.args) === "object"
+ (trueTypeOf(options.args) === "object" || trueTypeOf(options.items) === "array")
) {
if (options.type in componentsList) {
return componentsList[options.type](target, id + options.type, data, options.args);
+ } else if (options.type === "Group") {
+ return (
+
+ { ProcessOptions({options: jsonLogic.apply(options.items, data), data: data, target: target, id: id}) }
+
);
} else {
return componentsList["Default"](options.type, id + "missing");
}
@@ -371,16 +376,18 @@ export function OptionsSummaryPopup({id, data}) {
const [size, setSize] = useState({w: 0, h: 0});
const close = () => {
setShow(false);
- document.removeEventListener("scroll", close, true);
+ document.removeEventListener("scroll", reposition, true);
}
const ref = useClickAway(close);
const reposition = () => {
+ console.trace("reposition")
let popup_button = document.getElementById(id + "img");
let rect = popup_button.getBoundingClientRect()
let pos_x = (rect.left + rect.right) / 2;
let pos_y = (rect.top + rect.bottom) / 2;
+ console.trace("reposition", pos_x, pos_y)
if (pos_x + size.w > window.innerWidth) {
setPosition({x: pos_x - size.w - 20, y: pos_y - size.h / 2});
} else {
@@ -408,7 +415,7 @@ export function OptionsSummaryPopup({id, data}) {
const handleClick = (event) => {
setShow(!show);
if (!show) {
- document.addEventListener("scroll", close, true);
+ document.addEventListener("scroll", reposition, true);
}
};
diff --git a/static/js/shop_data.js b/static/js/shop_data.js
index 0e4c44e..eebe791 100644
--- a/static/js/shop_data.js
+++ b/static/js/shop_data.js
@@ -79,7 +79,7 @@ const shop_data = {
{type: "Line", args: {title: "IPv4", outvar: "ipv4", fallback: "192.168.1.75/24", tip: "Set up IPv4 address used by core device"}},
{type: "SwitchLine", args: {title: "IPv6", outvar: "ipv6"}},
{type: "SwitchLine", args: {title: "Ext CLK", outvar: "ext_clk", fallback: {text: "125 MHz", checked: false}, tip: "Use external clock reference: 10, 80 (beta), 100 or 125 MHz. Other variants may be provided if needed."}},
- {type: "Switch", args: {title: "Email device_db", outvar: "out", icon: "/shop/icon-leaf.svg", tip: "Send the device_db.py file by email instead of USB-drive"}},
+ {type: "Switch", args: {title: "Email device_db", outvar: "email_ddb", icon: "/shop/icon-leaf.svg", tip: "Send the device_db.py file by email instead of USB-drive"}},
],
[
{type: "Switch", args: {title: "Optic fiber", outvar: "optics", tip: "Use optic fiber instead of direct attach copper cable"}}
@@ -163,7 +163,7 @@ const shop_data = {
{type: "Line", args: {title: "IPv4", outvar: "ipv4", fallback: "192.168.1.75/24", tip: "Set up IPv4 address used by core device"}},
{type: "SwitchLine", args: {title: "IPv6", outvar: "ipv6"}},
{type: "SwitchLine", args: {title: "Ext CLK", outvar: "ext_clk", fallback: {text: "125 MHz", checked: false}, tip: "Use external clock reference: 10, 80 (beta), 100 or 125 MHz. Other variants may be provided if needed."}},
- {type: "Switch", args: {title: "Email device_db", outvar: "out", icon: "/shop/icon-leaf.svg", tip: "Send the device_db.py file by email instead of USB-drive"}},
+ {type: "Switch", args: {title: "Email device_db", outvar: "email_ddb", icon: "/shop/icon-leaf.svg", tip: "Send the device_db.py file by email instead of USB-drive"}},
],
[
{type: "Switch", args: {title: "Optic fiber", outvar: "optics", tip: "Use optic fiber instead of direct attach copper cable"}}
@@ -298,7 +298,31 @@ const shop_data = {
]
]
},
- {type: "Switch", args: {title: "Output second group", outvar: "out_second_group", fallback: true, tip: "Switch connectors 4-7 to output"}}
+ {
+ "if": [
+ {"!": {"var": "out_first_group"}},
+ {type: "Group", items: [
+ {type: "Switch", args: {title: "Termination #0", fallback: true, outvar: "term_0", tip: "Enable termination on channel #0"}},
+ {type: "Switch", args: {title: "Termination #1", fallback: true, outvar: "term_1", tip: "Enable termination on channel #1"}},
+ {type: "Switch", args: {title: "Termination #2", fallback: true, outvar: "term_2", tip: "Enable termination on channel #2"}},
+ {type: "Switch", args: {title: "Termination #3", fallback: true, outvar: "term_3", tip: "Enable termination on channel #3"}},
+ ]},
+ null
+ ]
+ },
+ {type: "Switch", args: {title: "Output second group", outvar: "out_second_group", fallback: true, tip: "Switch connectors 4-7 to output"}},
+ {
+ "if": [
+ {"!": {"var": "out_second_group"}},
+ {type: "Group", items: [
+ {type: "Switch", args: {title: "Termination #4", fallback: true, outvar: "term_4", tip: "Enable termination on channel #4"}},
+ {type: "Switch", args: {title: "Termination #5", fallback: true, outvar: "term_5", tip: "Enable termination on channel #5"}},
+ {type: "Switch", args: {title: "Termination #6", fallback: true, outvar: "term_6", tip: "Enable termination on channel #6"}},
+ {type: "Switch", args: {title: "Termination #7", fallback: true, outvar: "term_7", tip: "Enable termination on channel #7"}},
+ ]},
+ null
+ ]
+ }
],
rules: {
resources: {
@@ -333,7 +357,31 @@ const shop_data = {
]
]
},
- {type: "Switch", args: {title: "Output second group", outvar: "out_second_group", fallback: true, tip: "Switch connectors 4-7 to output"}}
+ {
+ "if": [
+ {"!": {"var": "out_first_group"}},
+ {type: "Group", items: [
+ {type: "Switch", args: {title: "Termination #0", fallback: true, outvar: "term_0", tip: "Enable termination on channel #0"}},
+ {type: "Switch", args: {title: "Termination #1", fallback: true, outvar: "term_1", tip: "Enable termination on channel #1"}},
+ {type: "Switch", args: {title: "Termination #2", fallback: true, outvar: "term_2", tip: "Enable termination on channel #2"}},
+ {type: "Switch", args: {title: "Termination #3", fallback: true, outvar: "term_3", tip: "Enable termination on channel #3"}},
+ ]},
+ null
+ ]
+ },
+ {type: "Switch", args: {title: "Output second group", outvar: "out_second_group", fallback: true, tip: "Switch connectors 4-7 to output"}},
+ {
+ "if": [
+ {"!": {"var": "out_second_group"}},
+ {type: "Group", items: [
+ {type: "Switch", args: {title: "Termination #4", fallback: true, outvar: "term_4", tip: "Enable termination on channel #4"}},
+ {type: "Switch", args: {title: "Termination #5", fallback: true, outvar: "term_5", tip: "Enable termination on channel #5"}},
+ {type: "Switch", args: {title: "Termination #6", fallback: true, outvar: "term_6", tip: "Enable termination on channel #6"}},
+ {type: "Switch", args: {title: "Termination #7", fallback: true, outvar: "term_7", tip: "Enable termination on channel #7"}},
+ ]},
+ null
+ ]
+ }
],
size: 'small',
type: null,
@@ -380,9 +428,57 @@ const shop_data = {
]
]
},
+ {
+ "if": [
+ {"!": {"var": "out_first_group"}},
+ {type: "Group", items: [
+ {type: "Switch", args: {title: "Termination #0", fallback: true, outvar: "term_0", tip: "Enable termination on channel #0"}},
+ {type: "Switch", args: {title: "Termination #1", fallback: true, outvar: "term_1", tip: "Enable termination on channel #1"}},
+ {type: "Switch", args: {title: "Termination #2", fallback: true, outvar: "term_2", tip: "Enable termination on channel #2"}},
+ {type: "Switch", args: {title: "Termination #3", fallback: true, outvar: "term_3", tip: "Enable termination on channel #3"}},
+ ]},
+ null
+ ]
+ },
{type: "Switch", args: {title: "Output second group", outvar: "out_second_group", fallback: true, tip: "Switch connectors 4-7 to output"}},
+ {
+ "if": [
+ {"!": {"var": "out_second_group"}},
+ {type: "Group", items: [
+ {type: "Switch", args: {title: "Termination #4", fallback: true, outvar: "term_4", tip: "Enable termination on channel #4"}},
+ {type: "Switch", args: {title: "Termination #5", fallback: true, outvar: "term_5", tip: "Enable termination on channel #5"}},
+ {type: "Switch", args: {title: "Termination #6", fallback: true, outvar: "term_6", tip: "Enable termination on channel #6"}},
+ {type: "Switch", args: {title: "Termination #7", fallback: true, outvar: "term_7", tip: "Enable termination on channel #7"}},
+ ]},
+ null
+ ]
+ },
{type: "Switch", args: {title: "Output third group", outvar: "out_third_group", fallback: true, tip: "Switch connectors 8-11 to output"}},
- {type: "Switch", args: {title: "Output fourth group", outvar: "out_fourth_group", fallback: true, tip: "Switch connectors 12-15 to output"}}
+ {
+ "if": [
+ {"!": {"var": "out_third_group"}},
+ {type: "Group", items: [
+ {type: "Switch", args: {title: "Termination #8", fallback: true, outvar: "term_8", tip: "Enable termination on channel #8"}},
+ {type: "Switch", args: {title: "Termination #9", fallback: true, outvar: "term_9", tip: "Enable termination on channel #9"}},
+ {type: "Switch", args: {title: "Termination #10", fallback: true, outvar: "term_10", tip: "Enable termination on channel #10"}},
+ {type: "Switch", args: {title: "Termination #11", fallback: true, outvar: "term_11", tip: "Enable termination on channel #11"}},
+ ]},
+ null
+ ]
+ },
+ {type: "Switch", args: {title: "Output fourth group", outvar: "out_fourth_group", fallback: true, tip: "Switch connectors 12-15 to output"}},
+ {
+ "if": [
+ {"!": {"var": "out_fourth_group"}},
+ {type: "Group", items: [
+ {type: "Switch", args: {title: "Termination #12", fallback: true, outvar: "term_12", tip: "Enable termination on channel #12"}},
+ {type: "Switch", args: {title: "Termination #13", fallback: true, outvar: "term_13", tip: "Enable termination on channel #13"}},
+ {type: "Switch", args: {title: "Termination #14", fallback: true, outvar: "term_14", tip: "Enable termination on channel #14"}},
+ {type: "Switch", args: {title: "Termination #15", fallback: true, outvar: "term_15", tip: "Enable termination on channel #15"}},
+ ]},
+ null
+ ]
+ }
],
size: 'small',
type: null,