Show what the camera sees

[TheDinner22]

show what the camera see's

Topic name: front_cam/image_compressed
Topic msg type

what we want

Live camera feed in the browser! Subscribe to the topic and display the video.

1. make this toggle-able since it might take up too much of the screen, or be computationally expensive.
2. Maybe make it so we can specify the topic name in a text box at runtime (there are other camera topics)
3. make the video (probably a canvas element) resize-able
4. the ability to record video from here an download straight from the browser to our computer and/or the Jetson would be legendary

the hard part

the hard part will be converting the ros2 image message to something the browser can actually support/display (I asked gpt and this "from roslibjs i listen to an image topic in the browser, how can i turn this into a video stream" and it knows how to do it :).

making ur life ez (im the best)

I made a branch in mil2 (the sub's repo, not the gui repo) called joe-compressed-webcam

1. checkout this branch
2. run cb front_cam
3. run ros2 run front_cam web_cam
4. your webcam (assuming you have one) is now being published live as compressed and uncompressed image data to two different topics
5. now you can test ur code with real image data

you can use
ros2 topic list to find the topic names
ros2 topic info <some_topic_name> to find the msg types
ros2 run rqt_image_view rqt_image_view to view these image topics live (compare your gui implementation to the ros's)

[N3rfed]

Tested out the branch in the mil2 repo. Next week, I will start to create a simple toggle button for the camera and figure out how to handle streaming (specifically converting from ROS msg to image). The record and download feature will be implemented much later.

[N3rfed]

I've made some progress making a camera branch to use for testing. I pulled from camera-feed-placeholder and main, then successfully added an "Enable/Disable" button to the CameraFeed component. For now, this button isn't hooked up to the ROS subscription yet. My immediate next step is to figure out the best way to handle the ROS-to-web streaming and then connect this button to that logic to make it fully functional.

[N3rfed]

Successfully got the camera to work. In order to test, I made sure that I installed "ros-jazzy-rosbridge-suite" with sudo apt install and set up 3 terminals. I used git checkout to be on the "joe-compressed-webcam" branch and then ran "ros2 run front_cam web_cam" on one terminal. On the second terminal, I ran "ros2 launch rosbridge_server rosbridge_websocket_launch.xml". On the third terminal, I started the react app with "npm start". The changes are pushed to the "camera-branch" branch.

[brockgilman]

Opened a PR for the camera placeholder along with my other commits, but will need to squash and merge with Jaden's working camera since I was doing research on getting the connection running for it. Will need to rebase ensuring none of our work gets lost, and also talk with Jaden on what more we can do with this (edge cases, testing, etc.). :)