data/templates/allgames.tpl.php

   1 <!DOCTYPE html>
   2 <html xmlns="http://www.w3.org/1999/xhtml" lang="en">
   3  <head>
   4   <meta charset="utf-8"/>
   5   <title>List of all OUYA games</title>
   6   <meta name="generator" content="stouyapi"/>
   7   <link rel="stylesheet" type="text/css" href="../datatables/datatables.min.css"/>
   8   <link rel="stylesheet" type="text/css" href="../datatables/jquery.dataTables.yadcf.css"/>
   9   <link rel="stylesheet" type="text/css" href="../ouya-allgames.css"/>
  10   <link rel="icon" href="../favicon.ico"/>
  11  </head>
  12  <body class="allgames">
  13   <header>
  14    <h1>List of all OUYA games</h1>
  15    <img class="ouyalogo" src="../ouya-logo.grey.svg" alt="OUYA logo" width="50"/>
  16   </header>
  17
  18   <table id="allouyagames" class="display">
  19    <thead>
  20     <tr>
  21      <th>Game title</th>
  22      <th>Developer</th>
  23      <th>Age</th>
  24      <th>Players</th>
  25      <th>Genres</th>
  26      <th>Release</th>
  27     </tr>
  28    </thead>
  29    <tbody>
  30     <?php foreach ($games as $game): ?>
  31      <tr>
  32       <td>
  33        <a href="<?= htmlspecialchars($game->detailUrl) ?>">
  34         <?= htmlspecialchars($game->title) ?>
  35        </a>
  36       </td>
  37       <td><?= htmlspecialchars($game->developer) ?></td>
  38       <td><?= htmlspecialchars($game->suggestedAge) ?></td>
  39       <td><?= htmlspecialchars(implode(', ', $game->players)) ?></td>
  40       <td><?= htmlspecialchars(implode(', ', $game->genres)) ?></td>
  41       <td><?= htmlspecialchars(gmdate('Y-m-d', $game->apkTimestamp)) ?></td>
  42      </tr>
  43     <?php endforeach; ?>
  44    </tbody>
  45   </table>
  46
  47   <nav>
  48    <?php foreach ($navLinks as $url => $title): ?>
  49     <a rel="up" href="<?= htmlspecialchars($url) ?>"><?= htmlspecialchars($title) ?></a>
  50    <?php endforeach ?>
  51   </nav>
  52
  53   <script type="text/javascript" src="../datatables/jquery-3.5.1.min.js"></script>
  54   <script type="text/javascript" src="../datatables/datatables.min.js"></script>
  55   <script type="text/javascript" src="../datatables/jquery.dataTables.yadcf.js"></script>
  56   <script type="text/javascript">
  57    $(document).ready(
  58        function() {
  59            var allOuyaGamesTable = $('#allouyagames').DataTable(
  60                {
  61                    paging: false,
  62                    fixedHeader: true
  63                }
  64            );
  65            yadcf.init(
  66                allOuyaGamesTable,
  67                [
  68                    {
  69                        column_number: 0,
  70                        filter_type: "text",
  71                        filter_default_label: "Filter game title",
  72                    },
  73                    {
  74                        column_number: 1,
  75                        filter_type: "text",
  76                        filter_default_label: "Filter developer",
  77                    },
  78                    {
  79                        column_number: 2,
  80                        column_data_type: "text",
  81                        data: ["Everyone", "9+", "12+", "17+"],
  82                        filter_default_label: "Filter age"
  83                    },
  84                    {
  85                        column_number: 3,
  86                        column_data_type: "text",
  87                        text_data_delimiter: ", ",
  88                        filter_default_label: "Filter player number"
  89                    },
  90                    {
  91                        column_number: 4,
  92                        column_data_type: "text",
  93                        text_data_delimiter: ", ",
  94                        filter_default_label: "Filter genre"
  95                    }
  96                ]
  97            );
  98        }
  99    );
 100   </script>
 101  </body>
 102 </html>