1  {% extends 'base.html' %}
   2  {% block content %}
   3  <div class="media-player container mt-4">
   4      <div class="row">
   5          <div class="col-md-9">
   6              <video id="media-player" controls class="w-100 rounded-3" style="background: #000;">
   7                  <source src="" type="video/mp4">
   8                  Your browser does not support HTML5 video.
   9              </video>
  10              
  11              <div class="torrent-controls mt-3">
  12                  <button class="btn btn-sm btn-outline-secondary" id="play-pause">
  13                      <i class="bi bi-play-fill"></i>
  14                  </button>
  15                  <input type="range" class="form-range" id="seek-slider" value="0">
  16                  <span class="timecode ms-3" id="timecode">00:00</span>
  17              </div>
  18          </div>
  19          
  20          <div class="col-md-3 torrent-info">
  21              <h5>Download Status</h5>
  22              <div class="progress">
  23                  <div class="progress-bar progress-bar-striped" role="progressbar" style="width: 0%">0%</div>
  24              </div>
  25              <ul class="list-group mt-3">
  26                  <li class="list-group-item d-flex justify-content-between">
  27                      <span>Peers:</span>
  28                      <span class="peer-count">0</span>
  29                  </li>
  30                  <li class="list-group-item d-flex justify-content-between">
  31                      <span>Download Speed:</span>
  32                      <span class="download-speed">0 KB/s</span>
  33                  </li>
  34                  <li class="list-group-item d-flex justify-content-between">
  35                      <span>Upload Speed:</span>
  36                      <span class="upload-speed">0 KB/s</span>
  37                  </li>
  38              </ul>
  39          </div>
  40      </div>
  41  </div>
  42  {% endblock %}