[geometry:meshcat] Add UI controls to Meshcat (#15768)

* [geometry:meshcat] Add UI controls to Meshcat

Adds support for buttons and sliders inside the meshcat browser.  This
is also the first instance of a bidirectional communication (the new
direction being browser => c++).  I've been using it for class for a
week or so, and it's been working well under that stress test.

Breaking change: Fixed a spelling error in the MeshcatVisualizerParams
field:
delete_on_intiliazation_event => delete_on_initialization_event.

bindings/pydrake/geometry_py.cc

@@ -1598,7 +1598,24 @@ void DoScalarIndependentDefinitions(py::module m) {
             py::overload_cast<std::string_view, std::string, double>(
                 &Class::SetProperty),
             py::arg("path"), py::arg("property"), py::arg("value"),
-            cls_doc.SetProperty.doc_double);
+            cls_doc.SetProperty.doc_double)
+        .def("AddButton", &Class::AddButton, py::arg("name"),
+            cls_doc.AddButton.doc)
+        .def("GetButtonClicks", &Class::GetButtonClicks, py::arg("name"),
+            cls_doc.GetButtonClicks.doc)
+        .def("DeleteButton", &Class::DeleteButton, py::arg("name"),
+            cls_doc.DeleteButton.doc)
+        .def("AddSlider", &Class::AddSlider, py::arg("name"), py::arg("min"),
+            py::arg("max"), py::arg("step"), py::arg("value"),
+            cls_doc.AddSlider.doc)
+        .def("SetSliderValue", &Class::SetSliderValue, py::arg("name"),
+            py::arg("value"), cls_doc.SetSliderValue.doc)
+        .def("GetSliderValue", &Class::GetSliderValue, py::arg("name"),
+            cls_doc.GetSliderValue.doc)
+        .def("DeleteSlider", &Class::DeleteSlider, py::arg("name"),
+            cls_doc.DeleteSlider.doc)
+        .def("DeleteAddedControls", &Class::DeleteAddedControls,
+            cls_doc.DeleteAddedControls.doc);
     // Note: we intentionally do not bind the advanced methods (HasProperty and
     // GetPacked*) which were intended primarily for testing in C++.
   }
@@ -1618,9 +1635,9 @@ void DoScalarIndependentDefinitions(py::module m) {
             cls_doc.default_color.doc)
         .def_readwrite(
             "prefix", &MeshcatVisualizerParams::prefix, cls_doc.prefix.doc)
-        .def_readwrite("delete_on_intialization_event",
-            &MeshcatVisualizerParams::delete_on_intialization_event,
-            cls_doc.delete_on_intialization_event.doc);
+        .def_readwrite("delete_on_initialization_event",
+            &MeshcatVisualizerParams::delete_on_initialization_event,
+            cls_doc.delete_on_initialization_event.doc);
   }
 }  // NOLINT(readability/fn_size)
 

bindings/pydrake/test/geometry_test.py

@@ -386,6 +386,15 @@ def test_meshcat(self):
         meshcat.Set2dRenderMode(
             X_WC=RigidTransform(), xmin=-1, xmax=1, ymin=-1, ymax=1)
         meshcat.ResetRenderMode()
+        meshcat.AddButton(name="button")
+        self.assertEqual(meshcat.GetButtonClicks(name="button"), 0)
+        meshcat.DeleteButton(name="button")
+        meshcat.AddSlider(name="slider", min=0, max=1, step=0.01, value=0.5)
+        meshcat.SetSliderValue(name="slider", value=0.7)
+        self.assertAlmostEqual(meshcat.GetSliderValue(
+            name="slider"), 0.7, delta=1e-14)
+        meshcat.DeleteSlider(name="slider")
+        meshcat.DeleteAddedControls()
 
     @numpy_compare.check_nonsymbolic_types
     def test_meshcat_visualizer(self, T):
@@ -395,7 +404,7 @@ def test_meshcat_visualizer(self, T):
         params.role = mut.Role.kIllustration
         params.default_color = mut.Rgba(0.5, 0.5, 0.5)
         params.prefix = "py_visualizer"
-        params.delete_on_intialization_event = False
+        params.delete_on_initialization_event = False
         vis = mut.MeshcatVisualizerCpp_[T](meshcat=meshcat, params=params)
         vis.Delete()
         self.assertIsInstance(vis.query_object_input_port(), InputPort_[T])