<!DOCTYPE html>
<html lang="en-us">
  <head>
    <meta charset="utf-8" />
    <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
    <title>{{{ PRODUCT_NAME }}}</title>
    <link rel="stylesheet" href="https://use.fontawesome.com/releases/v5.7.2/css/all.css" integrity="sha384-fnmOCqbTlWIlj8LyTjo7mOUStjsKC4pOpQbqyi7RrhN7udi9RwhKkMHpvLbHG9Sr" crossorigin="anonymous" />
    <link rel="stylesheet" href="https://plateforme.timmatane.ca/style/main.css" />
    <script src="https://libs.timmatane.ca/TooltipJS/dist/tooltipjs.umd.js"></script>
    <script src="https://plateforme.timmatane.ca/js/plateforme.js"></script>
    <style type="text/css">
      html,
      body {
        padding: 0;
        margin: 0;
        overflow: hidden;
      }

      .fullscreen-canvas-container canvas {
        width: 100%;
        height: 100%;
        padding: 0;
        margin: 0;
        position: relative;
      }
    </style>
  </head>

  <body style="text-align: center">
    <div class="fullscreen-canvas-container" style="width: {{{ WIDTH }}}px; height: {{{ HEIGHT }}}px; background: {{{ BACKGROUND_FILENAME ? 'url(\'Build/' + BACKGROUND_FILENAME.replace(/'/g, '%27') + '\') center / cover' : BACKGROUND_COLOR }}}">
      <canvas id="unity-canvas"></canvas>
    </div>

    <script src="Build/{{{ LOADER_FILENAME }}}"></script>
    <script>

      let gameInstance;
      window.initAppCallback = function () {
        plateformeClient.initApp();
      }

      window.initGameCallback = function () {
        plateformeClient.initGame();
      }

      window.saveHighscoreCallback = function (score) {
        if (document.fullscreenElement) {
          document.exitFullscreen();
          setTimeout(() => {
            plateformeClient.saveHighscore(score);
          }, 1000);
        } else plateformeClient.saveHighscore(score);
      }

      window.getHighscoresCallback = function () {
        if (document.fullscreenElement) {
          document.exitFullscreen();
          setTimeout(() => {
            plateformeClient.getHighscores();
          }, 1000);
        } else plateformeClient.getHighscores();

      }

      window.closeCallback = function () {
        if (document.fullscreenElement) {
          document.exitFullscreen();
        };
        plateformeClient.close();
      }

      window.restartCallback = function () {
        if (document.fullscreenElement) {
          document.exitFullscreen();
          setTimeout(() => {
            plateformeClient.restart();
          }, 1000);
        } else plateformeClient.restart();

      }

      document.addEventListener('fullscreenchange', event => {
        if (document.fullscreenElement == null) {
          const controls = document.querySelector(".fullscreen-canvas-container").querySelector(".controls");
          if (controls) {
            window.top.document.body.appendChild(controls);
          }

          const tooltipContainer = document.querySelector(".fullscreen-canvas-container").querySelector("#tipContainer");
          if (tooltipContainer) {
            window.top.document.body.appendChild(tooltipContainer);
          }
        }
      });

      window.fullscreenSwitchCallback = function (fullscreenState) {
        if (gameInstance) {
          const fcc = document.querySelector(".fullscreen-canvas-container");

          if (fullscreenState == true) {
            const controls = window.top.document.querySelector(".controls");
            if (controls) {
              fcc.appendChild(controls);
            }

            const tooltipContainer = window.top.document.querySelector("#tipContainer");
            if (tooltipContainer) {
              fcc.appendChild(tooltipContainer);
              TooltipJS.scanForInlineTooltips();
            };

            fcc.requestFullscreen();
          } else {
            document.exitFullscreen();
          };
        }
      }

      function soundChange(state) {
        if (gameInstance)
          gameInstance.SendMessage("PlateformeClient", "SoundChangeCall", state ? 1 : 0);
      }


      function initPlateformeApp() {
        createUnityInstance(document.querySelector("#unity-canvas"), {
          dataUrl: "Build/{{{ DATA_FILENAME }}}",
          frameworkUrl: "Build/{{{ FRAMEWORK_FILENAME }}}",
          codeUrl: "Build/{{{ CODE_FILENAME }}}",
          #if MEMORY_FILENAME
                memoryUrl: "Build/{{{ MEMORY_FILENAME }}}",
          #endif
        #if SYMBOLS_FILENAME
                symbolsUrl: "Build/{{{ SYMBOLS_FILENAME }}}",
          #endif
                streamingAssetsUrl: "StreamingAssets",
          companyName: "{{{ COMPANY_NAME }}}",
          productName: "{{{ PRODUCT_NAME }}}",
          productVersion: "{{{ PRODUCT_VERSION }}}",
        }).then((unityInstance) => {
          gameInstance = unityInstance;
          gameInstance.SendMessage("PlateformeClient", "InitPlateformeAppCall");
        });
      }
    </script>
  </body>
</html>
