<!DOCTYPE html>
<html lang="en">
  <head>
    <meta charset="utf-8">
    <title>Migration</title>
  </head>
  <body>
    <div style="width: 800px; margin: auto;">
      <h1>Migration</h1>

      <div id="up-to-date" style="display:none;">
        <p>Your database is up-to-date with the application.</p>

        <a href="/" class="btn btn-success">Continue to app</a>
      </div>

      <div id="need-to-migrate" style="display:none;">
        <p>Your database needs to be migrated to new version before you can use the application again.
        Database will be backed up before migration in case of something going wrong.</p>

        <table class="table table-bordered" style="width: 200px;">
          <tr>
            <th>Application version:</th>
            <td id="app-db-version" style="text-align: right;"></td>
          <tr>
            <th>Database version:</th>
            <td id="db-version" style="text-align: right;"></td>
          </tr>
        </table>

        <button class="btn btn-warning" id="run-migration">Run migration</button>
      </div>

      <div id="migration-result" style="display:none;">
        <h2>Migration result</h2>

        <table id="migration-table" class="table">
          <tr>
            <th>Database version</th>
            <th>Name</th>
            <th>Success</th>
            <th>Error</th>
          </tr>
        </table>

        <a href="/" class="btn btn-success">Continue to app</a>
      </div>
    </div>

    <script type="text/javascript">
      const baseApiUrl = 'api/';
    </script>

    <!-- Required for correct loading of scripts in Electron -->
    <script>if (typeof module === 'object') {window.module = module; module = undefined;}</script>

    <script src="libraries/jquery.min.js"></script>

    <link href="libraries/bootstrap/css/bootstrap.css" rel="stylesheet">
    <script src="libraries/bootstrap/js/bootstrap.js"></script>

    <script src="javascripts/migration.js"></script>
    <script src="javascripts/utils.js"></script>
    <script src="javascripts/server.js"></script>
  </body>
</html>