From c392a83589bd226e62b48c36298feb2b649fb958 Mon Sep 17 00:00:00 2001
From: Russ Tedrake <russt@mit.edu>
Date: Fri, 27 Aug 2021 04:50:40 -0400
Subject: [PATCH] [geometry] Install meshcat data files

Without this, Meshcat worked fine in the source tree, but was unable to locate it's resources in the installation directory.
---
 BUILD.bazel                                   |  2 +
 doc/BUILD.bazel                               | 16 ++++++++
 geometry/BUILD.bazel                          | 22 ++++++++++-
 geometry/meshcat.cc                           |  3 +-
 geometry/meshcat.html                         | 38 +++++++++++++++++++
 .../generate_installed_files_manifest.bzl     |  4 ++
 tools/workspace/meshcat/package.BUILD.bazel   | 12 +++++-
 7 files changed, 93 insertions(+), 4 deletions(-)
 create mode 100644 geometry/meshcat.html

diff --git a/BUILD.bazel b/BUILD.bazel
index 21b42e7382fb..7f543969e64c 100644
--- a/BUILD.bazel
+++ b/BUILD.bazel
@@ -47,7 +47,9 @@ install(
     deps = [
         "//bindings/pydrake:install",
         "//common:install",
+        "//doc:install",
         "//examples:install",
+        "//geometry:install",
         "//lcmtypes:install",
         "//manipulation/models:install_data",
         "//setup:install",
diff --git a/doc/BUILD.bazel b/doc/BUILD.bazel
index 07b43d6de436..0c634f05de50 100644
--- a/doc/BUILD.bazel
+++ b/doc/BUILD.bazel
@@ -12,6 +12,7 @@ load(
     "DEFAULT_TEST_TAGS",
     "enumerate_filegroup",
 )
+load("@drake//tools/install:install.bzl", "install", "install_files")
 load("//tools/lint:lint.bzl", "add_lint_tests")
 
 drake_py_library(
@@ -82,6 +83,13 @@ filegroup(
     ],
 )
 
+# favicon.ico is used by //geometry:meshcat.
+install_files(
+    name = "install_favicon",
+    dest = "share/drake/doc",
+    files = ["favicon.ico"],
+)
+
 enumerate_filegroup(
     name = "pages_input.txt",
     data = [":pages_input"],
@@ -143,4 +151,12 @@ test_suite(
     ],
 )
 
+install(
+    name = "install",
+    visibility = ["//visibility:public"],
+    deps = [
+        ":install_favicon",
+    ],
+)
+
 add_lint_tests()
diff --git a/geometry/BUILD.bazel b/geometry/BUILD.bazel
index e29ec4d6e48d..07da85a38962 100644
--- a/geometry/BUILD.bazel
+++ b/geometry/BUILD.bazel
@@ -11,6 +11,7 @@ load(
     "@drake//tools/skylark:drake_py.bzl",
     "drake_py_binary",
 )
+load("@drake//tools/install:install.bzl", "install", "install_files")
 load("//tools/lint:lint.bzl", "add_lint_tests")
 
 package(default_visibility = ["//visibility:public"])
@@ -360,8 +361,8 @@ drake_cc_library(
     srcs = ["meshcat.cc"],
     hdrs = ["meshcat.h"],
     data = [
+        "meshcat.html",
         "//doc:favicon",
-        "@meshcat//:dist/index.html",
         "@meshcat//:dist/main.min.js",
     ],
     deps = [
@@ -378,6 +379,17 @@ drake_cc_library(
     ],
 )
 
+exports_files(
+    ["meshcat.html"],
+    visibility = ["//visibility:public"],
+)
+
+install_files(
+    name = "install_meshcat_html",
+    dest = "share/drake/geometry",
+    files = ["meshcat.html"],
+)
+
 drake_cc_binary(
     name = "meshcat_manual_test",
     testonly = True,
@@ -652,4 +664,12 @@ drake_cc_googletest(
     ],
 )
 
+install(
+    name = "install",
+    visibility = ["//visibility:public"],
+    deps = [
+        ":install_meshcat_html",
+    ],
+)
+
 add_lint_tests()
diff --git a/geometry/meshcat.cc b/geometry/meshcat.cc
index 2335dd7587b5..2644aa861308 100644
--- a/geometry/meshcat.cc
+++ b/geometry/meshcat.cc
@@ -40,9 +40,8 @@ const std::string& GetUrlContent(std::string_view url_path) {
       LoadResource("drake/external/meshcat/dist/main.min.js"));
   static const drake::never_destroyed<std::string> favicon_ico(
       LoadResource("drake/doc/favicon.ico"));
-  // TODO(russt): Set the different default background color for Drake.
   static const drake::never_destroyed<std::string> index_html(
-      LoadResource("drake/external/meshcat/dist/index.html"));
+      LoadResource("drake/geometry/meshcat.html"));
   if (url_path == "/main.min.js") {
     return main_min_js.access();
   }
diff --git a/geometry/meshcat.html b/geometry/meshcat.html
new file mode 100644
index 000000000000..278d582be887
--- /dev/null
+++ b/geometry/meshcat.html
@@ -0,0 +1,38 @@
+<!DOCTYPE html>
+<html>
+	<head>
+		<meta charset=utf-8>
+		<title>Drake MeshCat</title>
+	</head>
+	<body>
+        <div id="meshcat-pane">
+        </div>
+
+        <script type="text/javascript" src="main.min.js"></script>
+        <script>
+            var viewer = new MeshCat.Viewer(document.getElementById("meshcat-pane"));
+            // Set background to match Drake Visualizer.
+            viewer.set_property(['Background'],'top_color', [242, 242, 255])
+            viewer.set_property(['Background'], "bottom_color", [77, 77, 89])
+            try {
+                viewer.connect();
+            } catch (e) {
+                console.info("Not connected to MeshCat websocket server: ", e);
+            }
+        </script>
+
+
+         <style>
+            body {
+                margin: 0;
+            }
+
+            #meshcat-pane {
+                width: 100vw;
+                height: 100vh;
+                overflow: hidden;
+            }
+        </style>
+        <script id="embedded-json"></script>
+	</body>
+</html>
diff --git a/tools/install/bazel/generate_installed_files_manifest.bzl b/tools/install/bazel/generate_installed_files_manifest.bzl
index 1d724a3c78b2..85e5c9c04423 100644
--- a/tools/install/bazel/generate_installed_files_manifest.bzl
+++ b/tools/install/bazel/generate_installed_files_manifest.bzl
@@ -8,6 +8,10 @@ def _impl(ctx):
     known_non_runfiles = [
         # These are installed in share/drake, but are not runfiles (at least,
         # not with these paths).
+        "doc/favicon.ico",
+        "external/meshcat/dist/index.html",
+        "external/meshcat/dist/main.min.js",
+        "geometry/meshcat.html",
         "setup/Brewfile",
         "setup/install_prereqs",
         "setup/packages-bionic.txt",
diff --git a/tools/workspace/meshcat/package.BUILD.bazel b/tools/workspace/meshcat/package.BUILD.bazel
index aa529fb2f8b0..aacb803db7bb 100644
--- a/tools/workspace/meshcat/package.BUILD.bazel
+++ b/tools/workspace/meshcat/package.BUILD.bazel
@@ -20,9 +20,19 @@ install_files(
     files = VIEWER_FILES,
 )
 
+# main.min.js is used by //geometry:meshcat.
+install_files(
+    name = "install_viewer_to_share",
+    dest = "share/drake/external/meshcat",
+    files = VIEWER_FILES,
+)
+
 install(
     name = "install",
     docs = ["LICENSE"],
     visibility = ["//visibility:public"],
-    deps = [":install_viewer"],
+    deps = [
+        ":install_viewer",
+        ":install_viewer_to_share",
+    ],
 )