From 9094ddc7f5050e037ac7f55461310896c53937a6 Mon Sep 17 00:00:00 2001 From: duro Date: Tue, 17 Dec 2024 19:13:45 +0100 Subject: [PATCH 1/9] Updating frontend --- .../react-components/SpecificVisualLoc.js | 42 +++++++++++++++++++ 1 file changed, 42 insertions(+) diff --git a/exercises/static/exercises/marker_visual_loc/react-components/SpecificVisualLoc.js b/exercises/static/exercises/marker_visual_loc/react-components/SpecificVisualLoc.js index 6e5578031..d86f376e3 100644 --- a/exercises/static/exercises/marker_visual_loc/react-components/SpecificVisualLoc.js +++ b/exercises/static/exercises/marker_visual_loc/react-components/SpecificVisualLoc.js @@ -25,12 +25,29 @@ function SpecificVisualLoc(props) { const timeout = 40; + const beacons = [ + { id: "tag_0", x: 518.75, y: 284.325 }, + { id: "tag_1", x: 481.4, y: 825.775 }, + { id: "tag_2", x: 171.39500000000004, y: 339.15 }, + { id: "tag_3", x: 400.89, y: 62.90000000000002 }, + { id: "tag_4", x: 844.9399999999999, y: 712.3 }, + { id: "tag_5", x: 283.03000000000003, y: 499.8 }, + { id: "tag_6", x: 730.4000000000001, y: 342.54999999999995 }, + { id: "tag_7", x: 499.65999999999997, y: 140.24999999999994 }, + ]; + const resizeObserver = new ResizeObserver((entries) => { var img = entries[0].target; //or however you get a handle to the IMG var width = (img.clientWidth / 1012); var height = (img.clientHeight / 1012); + const resizedBeacons = beacons.map(beacon => ({ + id: beacon.id, + x: beacon.x * width, + y: beacon.y * height, + })) + updatePath(realTrail, setRealPath, height, width); updatePath(noisyTrail, setNoisyPath, height, width); updatePath(userTrail, setUserPath, height, width); @@ -195,6 +212,31 @@ function SpecificVisualLoc(props) { /> } + {resizedBeacons.map((beacon, index) => ( +
+ {beacon.id} +
+ ))} ); } From f260653c754978b9d91fcd151d2f9c5cfc0aa681 Mon Sep 17 00:00:00 2001 From: Javier Izquierdo Hernandez Date: Tue, 17 Dec 2024 20:09:16 +0100 Subject: [PATCH 2/9] Fixing beacons --- .../react-components/SpecificVisualLoc.js | 38 +++++++++---------- .../react-components/css/GUICanvas.css | 19 ++++++++++ 2 files changed, 36 insertions(+), 21 deletions(-) diff --git a/exercises/static/exercises/marker_visual_loc/react-components/SpecificVisualLoc.js b/exercises/static/exercises/marker_visual_loc/react-components/SpecificVisualLoc.js index d86f376e3..937775a75 100644 --- a/exercises/static/exercises/marker_visual_loc/react-components/SpecificVisualLoc.js +++ b/exercises/static/exercises/marker_visual_loc/react-components/SpecificVisualLoc.js @@ -15,6 +15,7 @@ function SpecificVisualLoc(props) { const [realPath, setRealPath] = React.useState("") const [noisyPath, setNoisyPath] = React.useState("") const [userPath, setUserPath] = React.useState("") + const [resizedBeacons, setResizedBeacons] = React.useState({}) var realTrail = []; var noisyTrail = []; var userTrail = []; @@ -26,14 +27,14 @@ function SpecificVisualLoc(props) { const timeout = 40; const beacons = [ - { id: "tag_0", x: 518.75, y: 284.325 }, - { id: "tag_1", x: 481.4, y: 825.775 }, - { id: "tag_2", x: 171.39500000000004, y: 339.15 }, - { id: "tag_3", x: 400.89, y: 62.90000000000002 }, - { id: "tag_4", x: 844.9399999999999, y: 712.3 }, - { id: "tag_5", x: 283.03000000000003, y: 499.8 }, - { id: "tag_6", x: 730.4000000000001, y: 342.54999999999995 }, - { id: "tag_7", x: 499.65999999999997, y: 140.24999999999994 }, + { id: "tag_0", x: 518.75, y: 284.325, type: "beacon-vert" }, + { id: "tag_1", x: 481.4, y: 825.775, type: "beacon-vert" }, + { id: "tag_2", x: 171.39500000000004, y: 339.15, type: "beacon-vert" }, + { id: "tag_3", x: 400.89, y: 62.90000000000002, type: "beacon-vert" }, + { id: "tag_4", x: 844.9399999999999, y: 712.3, type: "beacon-vert" }, + { id: "tag_5", x: 283.03000000000003, y: 499.8, type: "beacon-vert" }, + { id: "tag_6", x: 730.4000000000001, y: 342.54999999999995, type: "beacon-vert" }, + { id: "tag_7", x: 499.65999999999997, y: 140.24999999999994, type: "beacon-vert" }, ]; const resizeObserver = new ResizeObserver((entries) => { @@ -42,11 +43,11 @@ function SpecificVisualLoc(props) { var width = (img.clientWidth / 1012); var height = (img.clientHeight / 1012); - const resizedBeacons = beacons.map(beacon => ({ + setResizedBeacons(beacons.map(beacon => ({ id: beacon.id, x: beacon.x * width, y: beacon.y * height, - })) + }))) updatePath(realTrail, setRealPath, height, width); updatePath(noisyTrail, setNoisyPath, height, width); @@ -152,6 +153,11 @@ function SpecificVisualLoc(props) { realTrail=[] noisyTrail=[] userTrail=[] + setResizedBeacons(beacons.map(beacon => ({ + id: beacon.id, + x: beacon.x * width, + y: beacon.y * height, + }))) } catch (error) { } } @@ -212,25 +218,15 @@ function SpecificVisualLoc(props) { /> } - {resizedBeacons.map((beacon, index) => ( + {Object.entries(resizedBeacons).map((index, beacon) => (
diff --git a/exercises/static/exercises/marker_visual_loc/react-components/css/GUICanvas.css b/exercises/static/exercises/marker_visual_loc/react-components/css/GUICanvas.css index 738e7a401..79e3162d5 100644 --- a/exercises/static/exercises/marker_visual_loc/react-components/css/GUICanvas.css +++ b/exercises/static/exercises/marker_visual_loc/react-components/css/GUICanvas.css @@ -38,4 +38,23 @@ height: 20px; border-radius: 10px; transition: left 0.1s ease-out, top 0.1s ease-out +} + +.beacon { + position: absolute; + border: 2px solid black; + cursor: pointer; + z-index: 5; +} + +.beacon-vert { + width: 0px; + height: 20px; + translate: 0 -10px; +} + +.beacon-hor { + width: 20px; + height: 0px; + translate: -10px; } \ No newline at end of file From 12a96aad6587606f668e06abd2d2708cd8f68993 Mon Sep 17 00:00:00 2001 From: Javier Izquierdo Hernandez Date: Tue, 17 Dec 2024 20:14:55 +0100 Subject: [PATCH 3/9] Test mapping --- .../react-components/SpecificVisualLoc.js | 18 +++++++++--------- .../react-components/css/GUICanvas.css | 2 +- 2 files changed, 10 insertions(+), 10 deletions(-) diff --git a/exercises/static/exercises/marker_visual_loc/react-components/SpecificVisualLoc.js b/exercises/static/exercises/marker_visual_loc/react-components/SpecificVisualLoc.js index 937775a75..fc81425fd 100644 --- a/exercises/static/exercises/marker_visual_loc/react-components/SpecificVisualLoc.js +++ b/exercises/static/exercises/marker_visual_loc/react-components/SpecificVisualLoc.js @@ -27,13 +27,13 @@ function SpecificVisualLoc(props) { const timeout = 40; const beacons = [ - { id: "tag_0", x: 518.75, y: 284.325, type: "beacon-vert" }, - { id: "tag_1", x: 481.4, y: 825.775, type: "beacon-vert" }, + { id: "tag_0", x: 518.75, y: 284.325, type: "beacon-hor" }, + { id: "tag_1", x: 481.4, y: 825.775, type: "beacon-hor" }, { id: "tag_2", x: 171.39500000000004, y: 339.15, type: "beacon-vert" }, - { id: "tag_3", x: 400.89, y: 62.90000000000002, type: "beacon-vert" }, + { id: "tag_3", x: 400.89, y: 62.90000000000002, type: "beacon-hor" }, { id: "tag_4", x: 844.9399999999999, y: 712.3, type: "beacon-vert" }, { id: "tag_5", x: 283.03000000000003, y: 499.8, type: "beacon-vert" }, - { id: "tag_6", x: 730.4000000000001, y: 342.54999999999995, type: "beacon-vert" }, + { id: "tag_6", x: 730.4000000000001, y: 342.54999999999995, type: "beacon-hor" }, { id: "tag_7", x: 499.65999999999997, y: 140.24999999999994, type: "beacon-vert" }, ]; @@ -218,13 +218,13 @@ function SpecificVisualLoc(props) { /> } - {Object.entries(resizedBeacons).map((index, beacon) => ( + {Object.entries(resizedBeacons).map((beacon, index) => { + console.log(beacon) + return(
{beacon.id}
- ))} + )})}
); } diff --git a/exercises/static/exercises/marker_visual_loc/react-components/css/GUICanvas.css b/exercises/static/exercises/marker_visual_loc/react-components/css/GUICanvas.css index 79e3162d5..a69d8378c 100644 --- a/exercises/static/exercises/marker_visual_loc/react-components/css/GUICanvas.css +++ b/exercises/static/exercises/marker_visual_loc/react-components/css/GUICanvas.css @@ -42,7 +42,7 @@ .beacon { position: absolute; - border: 2px solid black; + border: 2px solid rgb(255, 255, 255); cursor: pointer; z-index: 5; } From 2a914ef5369ca8ea564b60a802e3ca4815e46660 Mon Sep 17 00:00:00 2001 From: Javier Izquierdo Hernandez Date: Tue, 17 Dec 2024 20:24:18 +0100 Subject: [PATCH 4/9] Try to fix access --- .../react-components/SpecificVisualLoc.js | 16 ++++++++-------- 1 file changed, 8 insertions(+), 8 deletions(-) diff --git a/exercises/static/exercises/marker_visual_loc/react-components/SpecificVisualLoc.js b/exercises/static/exercises/marker_visual_loc/react-components/SpecificVisualLoc.js index fc81425fd..5da3cfd2e 100644 --- a/exercises/static/exercises/marker_visual_loc/react-components/SpecificVisualLoc.js +++ b/exercises/static/exercises/marker_visual_loc/react-components/SpecificVisualLoc.js @@ -218,19 +218,19 @@ function SpecificVisualLoc(props) { /> } - {Object.entries(resizedBeacons).map((beacon, index) => { - console.log(beacon) + {Object.entries(resizedBeacons).map((data, ind) => { + const beacon = data[1]; return(
- {beacon.id} + {beacon["id"]}
)})} From 01185aa7e124057ae0496ed1837ad8b9f9fcb5ea Mon Sep 17 00:00:00 2001 From: Javier Izquierdo Hernandez Date: Tue, 17 Dec 2024 20:49:05 +0100 Subject: [PATCH 5/9] Showing beacons --- .../react-components/SpecificVisualLoc.js | 53 +++++++++---------- 1 file changed, 25 insertions(+), 28 deletions(-) diff --git a/exercises/static/exercises/marker_visual_loc/react-components/SpecificVisualLoc.js b/exercises/static/exercises/marker_visual_loc/react-components/SpecificVisualLoc.js index 5da3cfd2e..4c6fd6b7a 100644 --- a/exercises/static/exercises/marker_visual_loc/react-components/SpecificVisualLoc.js +++ b/exercises/static/exercises/marker_visual_loc/react-components/SpecificVisualLoc.js @@ -7,7 +7,7 @@ import RobotBlue from "../resources/images/robot_blue.svg"; import house from "../resources/images/map.png"; -import "./css/GUICanvas.css" +import "./css/GUICanvas.css"; function SpecificVisualLoc(props) { const [realPose, setRealPose] = React.useState(null) const [noisyPose, setNoisyPose] = React.useState(null) @@ -27,14 +27,14 @@ function SpecificVisualLoc(props) { const timeout = 40; const beacons = [ - { id: "tag_0", x: 518.75, y: 284.325, type: "beacon-hor" }, - { id: "tag_1", x: 481.4, y: 825.775, type: "beacon-hor" }, - { id: "tag_2", x: 171.39500000000004, y: 339.15, type: "beacon-vert" }, - { id: "tag_3", x: 400.89, y: 62.90000000000002, type: "beacon-hor" }, - { id: "tag_4", x: 844.9399999999999, y: 712.3, type: "beacon-vert" }, - { id: "tag_5", x: 283.03000000000003, y: 499.8, type: "beacon-vert" }, - { id: "tag_6", x: 730.4000000000001, y: 342.54999999999995, type: "beacon-hor" }, - { id: "tag_7", x: 499.65999999999997, y: 140.24999999999994, type: "beacon-vert" }, + { id: "tag_0", x: 518.75, y: 284.325, type: "hor" }, + { id: "tag_1", x: 481.4, y: 825.775, type: "hor" }, + { id: "tag_2", x: 171.39500000000004, y: 339.15, type: "vert" }, + { id: "tag_3", x: 400.89, y: 62.90000000000002, type: "hor" }, + { id: "tag_4", x: 844.9399999999999, y: 712.3, type: "vert" }, + { id: "tag_5", x: 283.03000000000003, y: 499.8, type: "vert" }, + { id: "tag_6", x: 730.4000000000001, y: 342.54999999999995, type: "hor" }, + { id: "tag_7", x: 499.65999999999997, y: 140.24999999999994, type: "vert" }, ]; const resizeObserver = new ResizeObserver((entries) => { @@ -47,6 +47,7 @@ function SpecificVisualLoc(props) { id: beacon.id, x: beacon.x * width, y: beacon.y * height, + type: beacon.type, }))) updatePath(realTrail, setRealPath, height, width); @@ -153,11 +154,7 @@ function SpecificVisualLoc(props) { realTrail=[] noisyTrail=[] userTrail=[] - setResizedBeacons(beacons.map(beacon => ({ - id: beacon.id, - x: beacon.x * width, - y: beacon.y * height, - }))) + setResizedBeacons(beacons) } catch (error) { } } @@ -218,27 +215,27 @@ function SpecificVisualLoc(props) { /> } - {Object.entries(resizedBeacons).map((data, ind) => { - const beacon = data[1]; + {Object.values(resizedBeacons).map((beacon) => { return(
- {beacon["id"]} -
+ title={`ID: ${beacon.id}`} + /> )})} ); } -SpecificVisualLoc.propTypes = { - circuit: PropTypes.string, -}; - export default SpecificVisualLoc; \ No newline at end of file From cbe09143e75b3ca75203e46a7a5f37363a554184 Mon Sep 17 00:00:00 2001 From: Javier Izquierdo Hernandez Date: Tue, 17 Dec 2024 20:50:18 +0100 Subject: [PATCH 6/9] Removing useless decimals --- .../react-components/SpecificVisualLoc.js | 12 ++++++------ 1 file changed, 6 insertions(+), 6 deletions(-) diff --git a/exercises/static/exercises/marker_visual_loc/react-components/SpecificVisualLoc.js b/exercises/static/exercises/marker_visual_loc/react-components/SpecificVisualLoc.js index 4c6fd6b7a..db0d67b58 100644 --- a/exercises/static/exercises/marker_visual_loc/react-components/SpecificVisualLoc.js +++ b/exercises/static/exercises/marker_visual_loc/react-components/SpecificVisualLoc.js @@ -29,12 +29,12 @@ function SpecificVisualLoc(props) { const beacons = [ { id: "tag_0", x: 518.75, y: 284.325, type: "hor" }, { id: "tag_1", x: 481.4, y: 825.775, type: "hor" }, - { id: "tag_2", x: 171.39500000000004, y: 339.15, type: "vert" }, - { id: "tag_3", x: 400.89, y: 62.90000000000002, type: "hor" }, - { id: "tag_4", x: 844.9399999999999, y: 712.3, type: "vert" }, - { id: "tag_5", x: 283.03000000000003, y: 499.8, type: "vert" }, - { id: "tag_6", x: 730.4000000000001, y: 342.54999999999995, type: "hor" }, - { id: "tag_7", x: 499.65999999999997, y: 140.24999999999994, type: "vert" }, + { id: "tag_2", x: 171.395, y: 339.15, type: "vert" }, + { id: "tag_3", x: 400.89, y: 62.9, type: "hor" }, + { id: "tag_4", x: 844.94, y: 712.3, type: "vert" }, + { id: "tag_5", x: 283.03, y: 499.8, type: "vert" }, + { id: "tag_6", x: 730.4, y: 342.55, type: "hor" }, + { id: "tag_7", x: 499.66, y: 140.25, type: "vert" }, ]; const resizeObserver = new ResizeObserver((entries) => { From e4b14f1522ddc148f636824c3746ce439f4b5953 Mon Sep 17 00:00:00 2001 From: Javier Izquierdo Hernandez Date: Tue, 17 Dec 2024 20:55:28 +0100 Subject: [PATCH 7/9] Start beacons in the correct pose --- .../react-components/SpecificVisualLoc.js | 14 ++++++++++++-- 1 file changed, 12 insertions(+), 2 deletions(-) diff --git a/exercises/static/exercises/marker_visual_loc/react-components/SpecificVisualLoc.js b/exercises/static/exercises/marker_visual_loc/react-components/SpecificVisualLoc.js index db0d67b58..75beb783c 100644 --- a/exercises/static/exercises/marker_visual_loc/react-components/SpecificVisualLoc.js +++ b/exercises/static/exercises/marker_visual_loc/react-components/SpecificVisualLoc.js @@ -154,7 +154,17 @@ function SpecificVisualLoc(props) { realTrail=[] noisyTrail=[] userTrail=[] - setResizedBeacons(beacons) + + var img = document.getElementById('gui-canvas'); + //or however you get a handle to the IMG + var width = (img.clientWidth / 1012); + var height = (img.clientHeight / 1012); + setResizedBeacons(beacons.map(beacon => ({ + id: beacon.id, + x: beacon.x * width, + y: beacon.y * height, + type: beacon.type, + }))) } catch (error) { } } @@ -229,7 +239,7 @@ function SpecificVisualLoc(props) { zIndex: "5", width: `${(beacon.type == "vert") ? 0 : 20}px`, height: `${(beacon.type == "hor") ? 0 : 20}px`, - translate: `${(beacon.type == "hor") ? -12 : 0}px ${(beacon.type == "vert") ? -12 : 0}px`, + // translate: `${(beacon.type == "hor") ? -12 : 0}px ${(beacon.type == "vert") ? -12 : 0}px`, }} title={`ID: ${beacon.id}`} /> From df6582465a6b4171a9f524481e716b3050dfad3e Mon Sep 17 00:00:00 2001 From: Javier Izquierdo Hernandez Date: Tue, 17 Dec 2024 21:02:30 +0100 Subject: [PATCH 8/9] Tuning beacons pose --- .../react-components/SpecificVisualLoc.js | 13 ++++++------- 1 file changed, 6 insertions(+), 7 deletions(-) diff --git a/exercises/static/exercises/marker_visual_loc/react-components/SpecificVisualLoc.js b/exercises/static/exercises/marker_visual_loc/react-components/SpecificVisualLoc.js index 75beb783c..22f6e6da6 100644 --- a/exercises/static/exercises/marker_visual_loc/react-components/SpecificVisualLoc.js +++ b/exercises/static/exercises/marker_visual_loc/react-components/SpecificVisualLoc.js @@ -27,13 +27,13 @@ function SpecificVisualLoc(props) { const timeout = 40; const beacons = [ - { id: "tag_0", x: 518.75, y: 284.325, type: "hor" }, - { id: "tag_1", x: 481.4, y: 825.775, type: "hor" }, - { id: "tag_2", x: 171.395, y: 339.15, type: "vert" }, - { id: "tag_3", x: 400.89, y: 62.9, type: "hor" }, + { id: "tag_0", x: 518.75, y: 270.325, type: "hor" }, + { id: "tag_1", x: 481.4, y: 810.775, type: "hor" }, + { id: "tag_2", x: 196.395, y: 339.15, type: "vert" }, + { id: "tag_3", x: 400.89, y: 79.9, type: "hor" }, { id: "tag_4", x: 844.94, y: 712.3, type: "vert" }, - { id: "tag_5", x: 283.03, y: 499.8, type: "vert" }, - { id: "tag_6", x: 730.4, y: 342.55, type: "hor" }, + { id: "tag_5", x: 295.03, y: 499.8, type: "vert" }, + { id: "tag_6", x: 730.4, y: 350.55, type: "hor" }, { id: "tag_7", x: 499.66, y: 140.25, type: "vert" }, ]; @@ -239,7 +239,6 @@ function SpecificVisualLoc(props) { zIndex: "5", width: `${(beacon.type == "vert") ? 0 : 20}px`, height: `${(beacon.type == "hor") ? 0 : 20}px`, - // translate: `${(beacon.type == "hor") ? -12 : 0}px ${(beacon.type == "vert") ? -12 : 0}px`, }} title={`ID: ${beacon.id}`} /> From 8d35f8bf57db20fc6d9312fec1b6335e3e2b72be Mon Sep 17 00:00:00 2001 From: Javier Izquierdo Hernandez Date: Fri, 20 Dec 2024 12:15:30 +0100 Subject: [PATCH 9/9] Add laser to Hal --- .../marker_visual_loc/python_template/ros2_humble/HAL.py | 8 ++++++++ 1 file changed, 8 insertions(+) diff --git a/exercises/static/exercises/marker_visual_loc/python_template/ros2_humble/HAL.py b/exercises/static/exercises/marker_visual_loc/python_template/ros2_humble/HAL.py index 2ec725fdd..a8a5c455e 100644 --- a/exercises/static/exercises/marker_visual_loc/python_template/ros2_humble/HAL.py +++ b/exercises/static/exercises/marker_visual_loc/python_template/ros2_humble/HAL.py @@ -24,12 +24,14 @@ def __auto_spin() -> None: motor_node = MotorsNode("/turtlebot3/cmd_vel", 4, 0.3) camera_node = CameraNode("/turtlebot3/camera/image_raw") odometry_node = OdometryNode("/turtlebot3/odom") +laser_node = LaserNode("/turtlebot3/laser/scan") noisy_odometry_node = NoisyOdometryNode("/turtlebot3/odom") # Spin nodes so that subscription callbacks load topic data executor = rclpy.executors.MultiThreadedExecutor() executor.add_node(camera_node) executor.add_node(odometry_node) +executor.add_node(laser_node) executor.add_node(noisy_odometry_node) executor_thread = threading.Thread(target=__auto_spin, daemon=True) @@ -59,6 +61,12 @@ def getImage(): image = camera_node.getImage() return image.data +# Laser +def getLaserData(): + laser_data = laser_node.getLaserData() + while len(laser_data.values) == 0: + laser_data = laser_node.getLaserData() + return laser_data ### SETTERS ###