Adds "Element Embedding" demo package. (#1596)

experimental/element_embedding_demo/web/js/demo-js-interop.js

@@ -0,0 +1,43 @@
+// Sets up a channel to JS-interop with Flutter
+(function() {
+  "use strict";
+  // This function will be called from Flutter when it prepares the JS-interop.
+  window._stateSet = function () {
+    window._stateSet = function () {
+      console.log("Call _stateSet only once!");
+    };
+
+    // The state of the flutter app, see `class _MyAppState` in lib/main.dart.
+    let appState = window._appState;
+
+    let valueField = document.querySelector("#value");
+    let updateState = function () {
+      valueField.value = appState.count;
+    };
+
+    // Register a callback to update the HTML field from Flutter.
+    appState.addHandler(updateState);
+
+    // Render the first value (0).
+    updateState();
+
+    let incrementButton = document.querySelector("#increment");
+    incrementButton.addEventListener("click", (event) => {
+      appState.increment();
+    });
+
+    let screenSelector = document.querySelector("#screen-selector");
+    screenSelector.addEventListener("change", (event) => {
+      appState.changeDemoScreenTo(event.target.value);
+      setJsInteropControlsEnabled(event.target.value === 'counter');
+    });
+
+    // Enables/disables the Value/Increment controls.
+    function setJsInteropControlsEnabled(enabled) {
+      let elements = document.querySelectorAll("#increment, label[for='value']");
+      elements.forEach((el) => {
+        el.classList.toggle('disabled', !enabled);
+      })
+    }
+  };
+}());