sailing-analytics/java/com.sap.sailing.gwt.ui/EmbeddedMapAndWindChart.html

<!doctype html>

<html>
  <head>
    <!--[if lt IE 9]>
       <meta http-equiv="REFRESH" content="0; url=/browser-info.html">
    <![endif]-->
    <meta http-equiv="content-type" content="text/html; charset=UTF-8">
    <title>${clientConfigurationContext['brandTitle']}Sailing Analytics Race Board</title>
    <meta content='width = device-width, initial-scale = 1.0, user-scalable = yes' name='viewport'>
    <meta content='yes' name='apple-mobile-web-app-capable'>
    <meta content='black' name='apple-mobile-web-app-status-bar-style'>
    <!-- <link href='iphone-splash-screen.png' rel='apple-touch-startup-image'> -->
    <link href='images/sap-sailing-app-icon${clientConfigurationContext['whitelabeled']}.png' rel='apple-touch-icon'>
    <link rel="shortcut icon" type="image/x-icon" href="images/sap${clientConfigurationContext['whitelabeled']}.ico" />
    <!--<link href='http://fonts.googleapis.com/css?family=Ubuntu:300,400,500,700,300italic,400italic,500italic,700italic' rel='stylesheet' type='text/css'>-->
    <!--  <link href='http://fonts.googleapis.com/css?family=Open+Sans+Condensed:700,300,300italic' rel='stylesheet' type='text/css'>-->
    
    <link rel="stylesheet" type="text/css" href="/sailing-reset-2.0.cache.css">
    <link rel="stylesheet" type="text/css" href="/sailing-fontface-1.0.cache.css">
    <link rel="stylesheet" type="text/css" href="EmbeddedMapAndWindChart.css">
    
    <script type="text/javascript" src="js/jquery-3.6.0.min.js"></script>
    <script type="text/javascript" src="/gwt-base/api/client_configuration_context"></script>
    <script type="text/javascript" language="javascript" src="com.sap.sailing.gwt.ui.EmbeddedMapAndWindChart/com.sap.sailing.gwt.ui.EmbeddedMapAndWindChart.nocache.js"></script>

    <!-- Loading Indicator -->
        <style type="text/css">
    .loading {
        position: absolute;
        top: 80px;
        bottom: 0;
        left: 0;
        right: 0;
        font-size: 120%;
    }
    .loading > .sapsailing {
        margin: 40px;
        color: #008fcc;
        font-weight: bold;
    }
    .loading > .waitmessage {
        margin: 60px 40px;
    }
    
    .signal {
        border:3px solid #6a6a6a;
        border-radius: 50%;
        position: relative;
        height:300px;
        width:300px;
        margin: 0px auto;
        opacity:0;
        -webkit-animation: pulsate 2s ease-out;
                animation: pulsate 2s ease-out;
        -webkit-animation-iteration-count:infinite;
                animation-iteration-count:infinite;
        -webkit-transform: translate(-50%, -50%);
    }

    @-webkit-keyframes pulsate {
        0% {
          -webkit-transform:scale(.1);
                  transform:scale(.1);
          opacity: 0.0;
        }
        50% {
          opacity:1;
        }
        100% {
          -webkit-transform:scale(1.2);
                  transform:scale(1.2);
          opacity:0;
        }
    }
    
    @keyframes pulsate {
        0% {
          -webkit-transform:scale(.1);
                  transform:scale(.1);
          opacity: 0.0;
        }
        50% {
          opacity:1;
        }
        100% {
          -webkit-transform:scale(1.2);
                  transform:scale(1.2);
          opacity:0;
        }
    }
    </style>

  </head>
<body>
    <iframe src="javascript:''" id="__gwt_historyFrame" tabIndex='-1'
        style="position:absolute;width:0;height:0;border:0"></iframe>
    <!-- RECOMMENDED if your web app will not function without JavaScript enabled -->
    <div id="loading" class="loading">
        <p class="sapsailing">${clientConfigurationContext['brandTitle']}Sailing Analytics</p>
        <noscript>
            <p style="margin: 10px 40px;">
                By delivering real time analytics around race rankings, speeds, maneuvers, bearings etc., SAP is helping
                to simplify and demystify the complex sport of sailing.
            </p>
            <p style="margin: 10px 40px;">
                SAP Sailing Analytics provide insights and transparency to the world of sailing by utilizing Cloud and
                In-Memory Technology, processing GPS and wind measurement data in real time and visualizing contents in
                various frontends accessible from anywhere.
            </p>
            <div
                style="width: 22em; position: fixed; top: 10px; left: 50%; margin-left: -11em; color: red; background-color: white; border: 1px solid red; padding: 4px; font-family: sans-serif">
                Your web browser must have JavaScript enabled in order for this
                application to display correctly.</div>
        </noscript>
        <p class="waitmessage">Loading, please wait...</p>
        <div class="signal"></div>
    </div>
</body>
</html>