1.4-Arcade-Website/songs.php

<?php
    $page = 4;
    require("inc_header.php");

    // ======================================================
    // ALL SONGS
    // ======================================================
    
    $table = "";

    $query = "SELECT `id`, `title`, `author`, (SELECT COUNT(1) FROM `songinstance` WHERE `song`=song.id ) as sis
              FROM `song`
              ORDER BY `title` ASC";

    $result_temp = mysqli_query($connection, $query);
    while($result = mysqli_fetch_assoc($result_temp))
    {
      $table .= "<tr>";
      $table .= "<td><a href='" . returnurl('song.php?id=' . $result['id']) . "'>" . $result['title'] . "</a></td>";
      $table .= "<td>" . $result['author'] . "</td>";
      $table .= "<td>" . $result['sis'] . "</td>";
      $table .= "</tr>";
    }  

?>

<!-- Content Wrapper. Contains page content -->
<div class="content-wrapper">

  <!-- Content Header (Page header) -->
  <section class="content-header">
    <h1>
      Songs
      <small>All song activity in one quick overview</small>
    </h1>
    <ol class="breadcrumb">
      <li class="active"><a href="#"><i class="ion ion-music-note"></i> Songs</a></li>
    </ol>
  </section>

  <section class="content">

    <div class="row">

      <div class="col-lg-12">
        <!-- TABLE: LATEST SONGS -->
        <div class="box">
          <div class="box-header with-border">
            <i class="ion ion-music-note"></i>
            <h3 class="box-title">Songs</h3>
          </div><!-- /.box-header -->
          <div class="box-body">
              <table id="songs-table" class="table table-bordered">
                <thead>
                  <tr>
                    <th>Song Name</th>
                    <th>Author</th>
                    <th># Songinstances</th>
                  </tr>
                </thead>
                <tbody>
                  <?php
                       echo $table;
                  ?>
                </tbody>
              </table>
          </div><!-- /.box-body -->
        </div><!-- /.box -->
      </div><!-- /.col -->

    </div><!-- /.row -->
    

  </section><!-- /.content -->
</div><!-- /.content-wrapper -->

<!-- DATA TABES SCRIPT -->
    <script src="plugins/datatables/jquery.dataTables.min.js" type="text/javascript"></script>
    <script src="plugins/datatables/dataTables.bootstrap.min.js" type="text/javascript"></script>
<!-- Page specific javascript -->
    <script src="dist/js/pages/songs.js" type="text/javascript"></script> 

<?php
    require("inc_footer.php");
?>