<!DOCTYPE html>
<html>
<head>
    <title>push-selection-sk demo</title>
    <meta charset="utf-8" />
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <script type="text/javascript" charset="utf-8">
      // This bit of script loads the custom elements v1 polyfill, but only if required.
      if (!window.customElements) {
        var newScript = document.createElement('script');
        newScript.src = "https://cdnjs.cloudflare.com/ajax/libs/custom-elements/1.0.8/custom-elements.min.js";
        document.write(newScript.outerHTML);
      }
    </script>
</head>
<body>
  <push-selection-sk id=ele> </push-selection-sk>
  <button id=show>Show the dialog</button>
  <h2>Event</h2>
  <div id=event> </div>
  <script type="text/javascript" charset="utf-8">
    document.getElementById('ele').choices = [
      {
        Built : "2018-02-02T18:04:45Z",
        Dirty : false,
        Hash : "6487269f0f7efd26073feed08810ce7cda49e330",
        Name : "skiaperfd/skiaperfd:jcgregorio@jcgregorio.cnc.corp.google.com:2018-02-02T18:04:45Z:6487269f0f7efd26073feed08810ce7cda49e330.deb",
        Note : "[perf] Fix test logic",
        Services : ["skiaperfd.service"],
        UserID : "jcgregorio@jcgregorio.cnc.corp.google.com",
      }, {
        Built : "2018-02-02T17:59:24Z",
        Dirty : true,
        Hash : "11b68a4cd135029e7f10ed2765d678b09c8ccbca",
        Name : "skiaperfd/skiaperfd:jcgregorio@jcgregorio.cnc.corp.google.com:2018-02-02T17:59:24Z:11b68a4cd135029e7f10ed2765d678b09c8ccbca.deb",
        Note : "[perf] Fix test logic",
        Services : ["skiaperfd.service"],
        UserID : "jcgregorio@jcgregorio.cnc.corp.google.com",
      }, {
        Built : "2018-02-02T17:54:00Z",
        Dirty : false,
        Hash : "ebfb2e8c851602556b7f0099c97535f11f0c72e4",
        Name : "skiaperfd/skiaperfd:jcgregorio@jcgregorio.cnc.corp.google.com:2018-02-02T17:54:00Z:ebfb2e8c851602556b7f0099c97535f11f0c72e4.deb",
        Note : "[perf] Fix clicking on traces.",
        Services : ["skiaperfd.service"],
        UserID : "jcgregorio@jcgregorio.cnc.corp.google.com",
      }];
    document.getElementById('ele').chosen = 1;
    document.getElementById('show').addEventListener('click', e => document.getElementById('ele').show());
    document.getElementById('ele').addEventListener('package-change', e => {
      document.getElementById('event').textContent = JSON.stringify(e.detail);
    });
  </script>
</body>
</html>