
<!DOCTYPE html>
<!--
Copyright 2022 Google Inc. All Rights Reserved.

Licensed under the Apache License, Version 2.0 (the "License");
you may not use this file except in compliance with the License.
You may obtain a copy of the License at

  http://www.apache.org/licenses/LICENSE-2.0

Unless required by applicable law or agreed to in writing, software
distributed under the License is distributed on an "AS IS" BASIS,
WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
See the License for the specific language governing permissions and
limitations under the License.
-->
<html lang="en">

<head>
  <meta charset="utf-8">
  <title>{{ APP_TITLE }}</title>
  <meta name="viewport" content="width=device-width, initial-scale=1.0, minimum-scale=1.0">

  <meta name="theme-color" content="#366597">

  <link rel="stylesheet" href="/static/dist/styles.css?v={{app_version}}" />

  <link rel="icon" sizes="192x192" href="/static/img/crstatus_192.png">

  <!-- iOS: run in full-screen mode and display upper status bar as translucent -->
  <meta name="apple-mobile-web-app-capable" content="yes">
  <meta name="mobile-web-app-capable" content="yes">
  <meta name="apple-mobile-web-app-status-bar-style" content="black-translucent">

  <link rel="apple-touch-icon" href="/static/img/crstatus_128.png">
  <link rel="apple-touch-icon-precomposed" href="/static/img/crstatus_128.png">
  <link rel="shortcut icon" href="/static/img/crstatus_128.png">

  <link rel="preconnect" href="https://www.google-analytics.com" crossorigin>

  <link rel="preconnect" href="https://fonts.googleapis.com">
  <link rel="preconnect" href="https://fonts.gstatic.com" crossorigin>

  <link rel="stylesheet" href="/static/css/main.css?v={{app_version}}">

  {# Google Identity Services library for OAuth #}
  <script src="https://accounts.google.com/gsi/client" nonce="{{nonce}}"></script>

  {# Google Charts library for timeline pages #}
  <script src="https://www.gstatic.com/charts/loader.js"></script>

  <script nonce="{{nonce}}">
    const urlParams = new URLSearchParams(window.location.search);
    if (urlParams.get("loginStatus") == 'False') {
      alert('Please log in.');
      window.location.replace('/');
    } else {
      if (urlParams.get("error") == '403') {
        alert('You do not have permission to access that page. You may need to sign in with an authorized account.');
      }
      if (urlParams.has("error")) {
        urlParams.delete("error");
        const newSearch = urlParams.toString() ? '?' + urlParams.toString() : '';
        window.history.replaceState({}, document.title, window.location.pathname + newSearch + window.location.hash);
      }
    }
  </script>
  <script type="module" nonce="{{nonce}}">
    import {ChromeStatusClient} from "/static/dist/cs-client.js?v={{app_version}}";
    import {ChromeStatusOpenApiClient} from "/static/dist/openapi-client.js?v={{app_version}}";

    window.csClient = new ChromeStatusClient(
      '{{xsrf_token}}', {{ xsrf_token_expires }});
    window.csOpenApiClient = new ChromeStatusOpenApiClient();
  </script>

  <script type="module" nonce="{{nonce}}" defer src="/static/dist/components.js?v={{app_version}}"></script>
</head>

<body class="{% if not prod %}non-prod{% endif %}">
  <chromedash-app
    appTitle="{{APP_TITLE}}"
    googleSignInClientId="{{google_sign_in_client_id}}"
    devMode="{{DEV_MODE}}"
    bannerMessage="{{banner_message}}"
    bannerTime="{{banner_time}}">
  </chromedash-app>

  <script src="https://www.googletagmanager.com/gtag/js?id=UA-179341418-1" async nonce="{{nonce}}"></script>

  {#
  Note that the following script tag must include type="module" so that the form field event listeners
  attached by shared.js will not be attached until after Shoelace event listeners are attached.
  See https://github.com/GoogleChrome/chromium-dashboard/issues/2014
  #}
  <script type="module" nonce="{{nonce}}" src="/static/dist/shared.js?v={{app_version}}"></script>
</body>

</html>
