PHP script to open video file in lightbox

I have many videos for students in local folder outside of root dir of website, and I found solution how to call a video via php, to hide the source of the file, and also be able to be outside website root folder. Now I would like to just open this file in a lightbox, and can't seem to be able to do it. Can someone point me in the right direction. Current solution with html index and php play file is working and looks like this List.html

<html lang="en">
<head>
<title>Test Video play list</title>
<meta charset="utf-8" />
<meta name="viewport" content="width=device-width,initial-scale=1" />
</head>
<body>
<h1>Videos from DVD</h1>
<table>
  <tr>
    <th>Title</th><th>Description<th>
  </tr>
  <tr>
    <td><a href="vid.php?play_video=101">101 Intro Video</td> <td>Intro video description.....</td>
  </tr>
  <tr>
    <td><a href="vid.php?play_video=102">102 Foreword</td> <td>Foreword description.....</td>
  </tr>
</table>
</body>
</html>

and then I have a vid.php like folowing:

<?php
if ( ($_SERVER['REQUEST_METHOD'] === "GET")
     && ( isset($_GET['play_video']) ) ) {
  if ($_GET['play_video'] == "101")  {
  $file_path_name = "../video/101-Intro.mp4";
  } elseif ($_GET['play_video'] == "102") {
  $file_path_name = "../video/102-Foreword.mp4";
  }
  $ctype= 'video/mp4';
  header('Content-Type: ' . $ctype);
  $handle = fopen($file_path_name, "rb");
  $contents = fread($handle, filesize($file_path_name));
  fclose($handle);
  echo $contents; 
} else {
echo "<h1>I'm Sorry wrong link</h1>";
}
?>

So that works good, so that it directly plays video in the same video tab, but I would like to play it in the lightbox. I tried to plug in php file into source, but didn't work in any case I tried.
So the lightbox index looks like this List-Lightbox.html:

<!DOCTYPE HTML>
<html lang="en">
<head>
   <link rel="stylesheet" href="style/style.css?2020-2-7-0" media="screen,print" />
   <script src="res/jquery.js?2020-2-7-0"></script>
   <script src="res/x5engine.js?2020-2-7-0" data-files-version="2020-2-7-0"></script>

<title>Test Video play list</title>
<meta charset="utf-8" />
<meta name="viewport" content="width=device-width,initial-scale=1" />
</head>
<body>
<h1>Videos from DVD</h1>
<table>
  <tr>
    <th>Title</th><th>Description<th>
  </tr>
  <tr>
    <td><a href="../video/Intro-101.mp4" onclick="return x5engine.imShowBox({ media:[{type: 'video', url: '../video/Intro.mp4', width: 1920, height: 1080, description: '101 Intro video'}]}, 0, this);" class="imCssLink">101 intro</a>
        </td> <td>Intro video description.....</td>
  </tr>
  <tr>
    <td><a href="vid.php?play_video=102" onclick="return x5engine.imShowBox({ media:[{type: 'video', url: 'vid.php?play_video=102', width: 1920, height: 1080, description: '101 Intro video'}]}, 0, this);" class="imCssLink">102 Foreword</td> <td>Foreword description.....</td>
  </tr>
</table>
</body>
</html>

So if I replace href with vid.php it will directly played video like above without lightbox. I trued also to start lightbox within vid.php, but also no luck Thanks for help Regards, D